شروع کنید: پیکربندی ویرایشگر کد

در ابتدا باید بگیم که شما می توانید برای کد نویسی با فلاتراز هر ویرایشگر کد به همراه ابزار خط فرمان استفاده کنید. با این حال، ما توصیه می کنیم برای کد نویسی جذاب تر و بهتر از ویرایشگر هایی که خواهیم گفت استفاده کنید. در این ویرایشگر ها ما افزونه هایی طراحی کردیم که به شما در کد نویسی، خطای گرامری، ویرایش ویجت های فلاتر، اجرا و اشکال زدایی و... راهنمایی های خوبی می کند.

در این قسمت ما چگونگی پیکر بندی فلاتر بر روی ویرایشگر های Android Studio ، IntelliJ و VS Code را شرح خواهیم داد. اگر نیازی به این موارد ندارید بهتر است به مرحله بعدی بروید و یک پروژه جدید در فلاتر ایجاد کنید.

نصب و برپایی Android Studio

Android Studio: یک ویرایشگر کد یکپارچه و کامل برای فلاتر!

فاز اول : نصب Android Studio

  • Android Studio, از نسخه 3.0 به بعد استفاده کنید.

همچنین شما می توانید از IntelliJ استفاده کنید. از طریق لینک های زیر اقدام به دریافت فایل نصب آن کنید.

فاز دوم : نصب افزونه Dart و Flutter بر روی ویرایشگر کد

برای راهندازی فلاتر بر روی ویرایشگر کد می بایست دو افزونه نصب شود:

  • افزونه Flutter
  • افزونه Dart برای کد نویسی با زبان دارت

برای نصب این دو افزونه مراحل زیر را دنبال کنید:

  1. Android Studio را باز کنید.
  2. با توجه به سیستم عامل خود از منوی زیر وارد بخش plugin preferences شوید
    • File>Settings>Plugins در لینوکس و ویندوز.
    • Preferences>Plugins در مک
  3. گزینه Browse repositories…, را انتخاب کرده و با جستجوی کلمه Flutter گزینه پیدا شده را انتخاب و install کنید.
  4. هنگامی که درخواست نصب پلاگین Dart را داد گزینه Yes را بزنید.
  5. با انتخاب گزینه Restart برنامه را مجدد اجرا کرده و پلاگین ها فعال شده است.

Visual Studio Code (VS Code) نصب و برپایی

VS Code: یک ویرایشگر سبک با اجرای فلاتر به همراه ابزارهایی برای debug کردن.

VS Code نصب

نصب پلاگین فلاتر بر روی VS Code

  1. VS Code را اجرا کنید
  2. گزینه View>Command Palette… را انتخاب کنید.
  3. عبارت ‘install’ را وارد کرده و گزینه ‘Extensions: Install Extension’ را از لیست انتخاب کنید. تا پنل Extensions برای شما فعال شود.
  4. عبارت flutter را در فیلد جستجو وارد کرده و گزینه ‘Flutter’ را در لیست جستجو انتخاب کنید. و در نهایت گزینه Install را انتخاب کنید.
  5. نرم افزار را مجدد اجرا کنید.

برای اطیمنان از صحت نصب فلاتر بر روی VS Code می توانید از Flutter Doctor استفاده کنید.

  1. وارد قسمت View>Command Palette… بشوید.
  2. در فیلد جستجو مقدار ‘doctor’, را وارد کنید و از لیست گزینه ‘Flutter: Run Flutter Doctor’ را انتخاب کنید.
  3. در پنل OUTPUT موارد را می توانید مشاهده و بررسی کنید.

مرحله بعد

در مرحله بعد میخواهیم در مورد اینکه چگونه یک پروژه ایجاد کنیم و همچنین یک تجریه هیجان انگیز از Hot Reload داشته باشیم.

مرحله بعد: ایجاد و پیکربندی پروژه