Getting Started With Flutter : Setting Up The Development Environment

Flutter Installation Guide For Windows

As Flutter starting the revolution of mobile app development, with it we should step forward to make our contribution towards the vision Atmanirbhar Bharat to make India a self-reliant nation.

Flutter is an open-source UI software development kit created by Google. It works on Dart language and used to develop applications for multiple platforms like Android, iOS, Linux from a single codebase.

Flutter has many features which makes it best : Beautiful | Fast and Simple Development | Cross Platform Development with Single Codebase | Open Source | High Productivity

Required Tools :

> Flutter : Get stable version — flutter_windows_1.17.5-stable

> Android Studio : Get android-studio-ide-193.6626763-windows.exe

> Visual Studio Code : Get latest version from here.

Installing Flutter :

Create new folder as your development workspace and extract zip folder there.

extracting zip folder into workspace directory

We can see all flutter files in our workspace directory, but system don’t know where is our workspace so in order to access it from anywhere we have to set path (flutter/bin) in user environmental variable

bin path > C:\Users\vivekPC\Desktop\flutter_ws\flutter\bin

Let’s check if it works- open command prompt and run >flutter we can see welcome message. To verify version run >flutter version command

welcome to flutter

Flutter installed successfully ! Now can we proceed to development part, we have doctor to diagnose flutter so let’s ask him by running >flutter doctor cmd

Doctor says unable to locate Android SDK, We need Android Studio as a software development kit (SDK).

Installing Android Studio :

Install setup as by following steps-

Installing Android Studio

Setting up Android Studio

Now to check SDK tools open Configure > SDK Manager option and make sure all required SDK tools are installed.

SDK Tool

Note :

In “Android SDK Location” make sure there is no space in between. If there is any space in path, edit and change path.

If any tool is not installed then select it and click download button at left to it and ‘apply’ to download it.

Now let’s see what flutter doctors says -

It says ‘Android licenses status unknown, we have to download license.

If it says ‘Unable to locate Android SDK, then go we have to set path by creating new variable ‘ANDROID_SDK_ROOT’

To load license run >flutter doctor — android-licenses, and accept everything by pressing y, it will load and accept license.

Now it says ‘Flutter and Dart plugin not installed’ and ‘No devices available’, As flutter use dart language. Go to ‘plugins’ and install ‘Flutter’ plugin it install both flutter and dart plugin as flutter is depend on dart.

Flutter plugin

Now to attach Android Virtual Device (AVD) go to ‘AVD Manager’ option and create new virtual device

Choose device on which you want to work (in my case I choose ‘Nexus 5X’), select system image (android version, in my case I go for ‘Pie’) and download that image to use it in our device

Pie is downloaded. Now go next and verify device configuration

Device is ready. Launch this AVD in emulator

Check emulator

Let it power on and then it will connect

Device is ready and connected

Good! This view is so satisfying…

Wait..! We ain’t done here. Lets try running test app on this device. For this first create a folder for ‘projects’ in our workspace and then create ‘test_app’ from that folder >flutter create test_app . Then launch our device in emulator > flutter emulators — launch Nexus_5X_API_28. It will launch device that contains test app.

Run test app from inside the test app folder from projects >flutter run. It will run our test app that we can see on our AVD.

test app launched in AVD

Cheers! Test app is launched successfully.

We are good to go for app development. And for it we need text editor to code. We have best editor VS Code that works as IDE also, it makes so easy for development. So let’s install it.

Installing VS Code :

Install it as following steps -

VS Code installation

Open test app folder in VS Code, here ‘main.dart’ is the file that contains code.

This IDE text editor will make easy development and for it we have install required plugin as VS Code’s power comes from plugin. Go to ‘Extensions’ option at left and search for ‘Flutter’. Install it.

With this plugin, VS Code understands dart language.

All required development environment is set. We are so good to go!

Thanks to Mr. Vimal Daga Sir under which I am learning Flutter App Development. That’s all for now. Thank you all, I am happy to help if you are getting any problem.