1st day with flutter - Hello Flutter!!

Hi Friends,

I am here with you to share the First day experience of #30DaysOfFlutter.

In this series we will learn flutter together!!

So we will run today hello world application using flutter step by step.

First Step - Installation

This is the most tricky part for any new developer who is started learning Flutter. Go through following steps of installing flutter sdk.

First you need to go to flutter get-started link  as below -

https://flutter.dev/docs/get-started/install

You need to select you operating system here for downloading the Flutter installation bundle.

Here I will go for the windows OS but the steps for all the OS will be same.

After downloading extract the zip file and place the flutter folder in the desired directory for ex -  C:\src\flutter

Second Step - Add Environment Variable

This is the second important step before running our first Flutter application. 

In this we will add Flutter to Path environment variable. So first type 'env' in the start bar and select Edit Environment variables for your account.

Now under User variable  check if there is an entry called 'Path'

  • If the entry exists, append the full path to flutter\bin using ; as a separator from existing values.
  • If the entry doesn’t exist, create a new user variable named Path with the full path to flutter\bin as its value.

This step is also required to run Flutter commands in terminal.

Third Step - Run Flutter Doctor

From the terminal window goto the Flutter directory and run the following command -

This command will check your environment and displays a report of the status of our Flutter installation.

Final Step - Set up IDE :- Android Studio

Android studio offers a complete IDE experience for Flutter. You can also use others IDEs such as IntelliJ for an Android developer android studio is preferrable option. 

Start Android Studio and open Plugins from menu. Search for Flutter plugin and install that. Click yes when prompted to install the Dart plugin.

Now restart the Android Studio.

Create Flutter Project

Start a new Flutter project from File --> New.

Select Flutter application as the project type then click on Next.

Verify the Flutter Sdk path specifies the SDK's location. If this field is empty then provide the Flutter SDK path here - for example

C:\src\flutter

Enter the project name and then click on Next. 

Click finish.

Wait for android studio to create the project.

You may need to configure the Dart Sdk path if Dart not configure error is coming after the project creation.

You can provide Dart sdk path as below -

c:\src\flutter\bin\cache\dart-sdk

Run your First Flutter App now

In the android studio toolbar select the android device emulator before running your first app. You can also connect your own device via Usb and run the app on the device.

Yeah we have done that!!!


This is our first Flutter app running in the device. 

So we have completed the first day with flutter and running our sample flutter application.

You can find the source code on my github repository -

https://github.com/akash-bisariya/FirstFlutterApp

Thanks guys please do post any question or issue in the comments.





 


No comments:

Post a Comment

Flutter : Using Form and Text Fields

Flutter is a popular cross-platform mobile development framework that allows developers to build native apps for both Android and iOS using ...