DEV Community

Cover image for Create your first Android/iOS app.
saxena uditanshu
saxena uditanshu

Posted on

Create your first Android/iOS app.

In the last post, I wrote about Flutter basics & how to install flutter in your system. If you didn't install Flutter please follow the steps given in the link here Install Flutter, Official site.

Step 1. Install Flutter

I assume you installed flutter successfully in your system. I will be using windows 10 in this article. The steps will be the same for Linux & Mac Os. To check all things are ready just fire up your command prompt, terminal and type this command.

Flutter doctor

You should see something similar

Alt Text

If the output is similar we are good to go, if there is some problem flutter will give the description & how to resolve it.

Step 2. Install VsCode

Visit the link to download & install VsCode Install

  • It's the best IDE for coding.
  • IntelliSense - syntax highlighting and autocomplete with IntelliSense.
  • Debug code right from the editor.
  • Connect your Git or GitLab account & collaborate with team members.

Installed VsCode Cool! Now let's go ahead.

Step 3. Create New Flutter Project. ✔

  • Navigate to the folder/directory where you want to create the flutter project, for example- CD Desktop to navigate to Desktop.
  • In your CMD/terminal type this command.
 flutter create HelloWorld

Here, HelloWorld is the name of your project
Now Flutter will start installing files needed for our project. You should see something similar in the end.

Alt Text

Step 4. Setup VsCode for Flutter Development.✔

  1. Open VsCode.
  2. Click 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. Alt Text

Yehee! You just setup VsCode successfully.

Step 5. Create a Virtual Device. ✔

  1. Open Android Studio.
  2. Open AVD Manager from Settings & click create virtual device.
  3. Alt Text
  4. Select device type & android version. Alt Text
  5. click next & launch device. Alt Text

Yehee! you successfully created your virtual android device. Now back to VsCode.

Step 6. Code a Hello World App.✔

  1. Open VsCode.
  2. Goto Files > Open Folder >
  3. Select Flutter project folder which we created above 'Hello World'.
  4. Something similar will open. Alt Text
  5. Click lib>main.dart
  6. 'Main.dart' will open in code editor. Alt Text
  7. Now press F5 or from above toolbar Run > Start Debugging & select the virtual android device we created.

Alt Text

  1. Everything should be fine if you followed the steps correctly, Now an virtual device will show on your screen.
  2. Wait a few minutes for the app to be built and installed to the virtual device. Alt Text
  3. WoW! You created your first android/ios app.

I will explain the code in next post, as you see the post is too long and sorry if you find some mistakes here.

Top comments (0)