DEV Community

Cover image for Flutter Development (Day: 0).
bugudiramu
bugudiramu

Posted on • Originally published at allaboutflutter.blogspot.com

Flutter Development (Day: 0).

  • This tutorial will tell you about Flutter.If you don't know about it then the upcoming posts will explain you everything.This is 30 day tutorial which explains about Flutter for absolute beginners.

  • prerequisites: If you are enthusiastic and Curious.

  • Today we are going to take a step to setup our environment and some dart basics.

First of all everyone asks what is Flutter?

Flutter is Google's portable UI toolkit for creating beautiful applications.
It is directly compiled to native binary code i.e., it won't wrap things up like cordova and xamarin.

Flutter is also useful for creating Web and Desktop applications with single codebase.We can use same source code for creating Mobile,Web and Desktop applications.

Flutter uses Dart as the programming language.

Architecture of Flutter Block Diagram:

Flutter Architecture

Steps to Follow:

  1. Visit flutter.dev to get started installing the sdk in your machine.Choose the OS of your system.

  2. There is a big blue button which says flutter_windows/mac.zip. just click the button it will start downloading.

  3. When download completes extract it (Don't extract in C drive I recommend extract it somewhere ex.Desktop because it won't mess up with OS programm files.).

  4. Update the path.

  • If you wish to run Flutter commands in the regular Windows console, take these steps to add Flutter to the PATH environment variable:
  • From the Start search bar, type ‘env’ and select Edit environment variables for your account.
  • Under User variables check if there is an entry called Path: If the entry does exist, append the full path to flutter\bin using ; as a separator from existing values like Desktop:\flutter\bin (F:\flutter\bin).
  1. Now you are ready to run flutter commands from anywhere in your machine.
C:\Users\ramu>flutter doctor
Doctor summary (to see all details, run flutter doctor -v):
[√] Flutter (Channel stable, v1.7.8+hotfix.3, on Microsoft Windows [Version 10.0.17763.593], locale en-US)

[√] Android toolchain - develop for Android devices (Android SDK version 28.0.3)
[√] Android Studio (version 3.4)
[√] VS Code (version 1.36.1)
[√] Connected device (1 available)

• No issues found!
Enter fullscreen mode Exit fullscreen mode

Setup the editor

  • Install VS Code VS Code is a light-weight editor with Flutter app execution and debug support.
  • Install the Flutter and Dart plugins in VS Code from the extensions.
  • Invoke View > Command Palette (ctrl + shift + p) .
  • Type “install”, and select Extensions: Install Extensions.
  • 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
  • Invoke View > Command Palette.
  • Type “doctor”, and select the Flutter: Run Flutter Doctor.
  • Review the output in the OUTPUT pane for any issues.

  • If you are following this tutorial please leave your opinion 👀 / say Hii ✋/.

  • If you have any doubts feel free to ask me.

Top comments (0)