flutter

Setup Flutter di Visual Studio Code

Install the Flutter and Dart plugins

  1. Start VS Code.
  2. Invoke View > Command Palette….
  3. Type “install”, and select Extensions: Install Extensions.
  4. Type “flutter” in the extensions search field, select Flutter in the list, and click Install. This also installs the required Dart plugin.

Validate your setup with the Flutter Doctor

  1. Invoke View > Command Palette….
  2. Type “doctor”, and select the Flutter: Run Flutter Doctor.
  3. Review the output in the OUTPUT pane for any issues.

Create the app

Do you want to run your Flutter app on the web? The web version of Flutter is available on the beta channel. To try it out, check out the Write your first Flutter app for the web codelab.

  1. Invoke View > Command Palette.
  2. Type “flutter”, and select the Flutter: New Project.
  3. Enter a project name, such as myapp, and press Enter.
  4. Create or select the parent directory for the new project folder.
  5. Wait for project creation to complete and the main.dart file to appear.

The above commands create a Flutter project directory called myapp that contains a simple demo app that uses Material Components.

Run the app

  1. Locate the VS Code status bar (the blue bar at the bottom of the window):
    status bar
  2. Select a device from the Device Selector area. For details, see Quickly switching between Flutter devices.
    • If no device is available and you want to use a device simulator, click No Devices and launch a simulator.
    • To setup a real device, follow the device-specific instructions on the Install page for your OS.
  3. Press the Settings button—a cog icon gear on the top right (now marked with a red or orange indicator) next to the DEBUG text box that reads No Configuration. Select flutter. And choose the debug configuration: To create your emulator if it is closed or to run the emulator or device that is now connected.
  4. Invoke Debug > Start Debugging or press F5.
  5. Wait for the app to launch — progress is printed in the Debug Console view.

 Warning: When launching your app from a Mac, if you see ERROR: Could not connect to lockdownd, error code -17, make sure that you have trusted your computer.

After the app build completes, you’ll see the starter app on your device.

Starter app on iOS
Starter app

Leave a Reply