Skip to main content

Tutorial: How to Setup Flutter in Windows and to be ready for building awesome mobile apps in easy 4 steps.

Every day we see frameworks born to just make our life easier, faster and more efficient.
I was always looking for a framework to build a native-like mobile application using just one code, it makes things go faster and easier and cost effective for business owners & entrepreneurs who develop new ideas,

I have found many cross-platform frameworks and I have used many of them like Xamarin and lately Ionic after I have found that it works with my favorite scripting languages (JS/TypeScript).
To be honest, I have never found any native-like performance in any of those.

Yesterday I have read that Google's Flutter is now Beta, which means for me it is a market-ready framework,

Flutter is Google’s mobile app SDK for crafting high-quality native interfaces on iOS and Android in record time. Flutter works with existing code, is used by developers and organizations around the world, and is free and open source. [Flutter's Website]

After I have tried the samples and flutter's gallery apps on google play market, I was so interested to give it a try, maybe this might be the framework that I am waiting for.

Here it is a tutorial on how to setup your windows environment to be ready for flutter development.
of course, you can use the official documentation but I think we will make it easier for you here.

1- Installing Flutter:

First, you need to install GitBash and complete the installation process using the wizard

Download Flutter SDK
Extract the zipped file and open flutter_console.bat
Now you have installed Flutter Successfully

2-Making Flutter Available in your Windows PowerShell and Git Bash:

Open your control panel -> User Accounts -> User Accounts (Again)
Then in the left menu locate and open "Change my environment variables"
Choose "Path" Then Press Edit-> Add New
Paste Flutter SDK bin folder directory like this example "D:\flutter\bin"
Press Ok!
Horrrrraaay!! You can use Flutter now easily in your favorite command line application (Git Bash/ Windows Powershell)

NB: You MAY need to restart your windows for the new changes

3-Installing Android Studio & Latest Android SDK:

This one is the easiest, download the latest version from this Link ==> Android Studio

4- Configuring Code Editor and Debugger:

I found that vs code is a lightweight code editor with every feature needed to develop awesome apps.
you can install it from here Visual Studio Code

Press on Extention icon then search for "flutter", then press install, Reload!


-You can start a new project by pressing Ctrl+Shift+P then write flutter and choose Flutter: New Project, enter project name => then choose project folder, and wait for the magic to happen.
-You can start to emulate your project by connecting your phone to computer and then run debug from vs code.

Waiting for your comments if there is any tutorial request or any problem happen while moving with these 4 steps.


Popular posts from this blog

Tutorial: How to configure Xampp / Apache to serve Ring language files

Ring Language is a new programming language that brings good new features to the table.
Simple, Very easy to read, Object Oriented, Smart garbage collector that puts the memory under the programmer control.
you can use it for mobile or web or software development...
See "Hello, World!"
know more about ring from here -> Why Ring?

Now lets go back to our tutorial.....

How to configure  Xampp / Apache to serve Ring language files

-Download Ring from here: Ring 1.0 for Windows
-Download Ring's Web Library form here: WebLib 1.0 (CGI Library)
-Download Xampp from here: Xampp

-After installing, go to the installation directory then open this folder> xampp\apache\conf\
-Open this file with your favorite editor "httpd.conf"

-Search for the lines: (CTRL+F)

<Directory /> AllowOverride none Require all denied  </Directory> Change it to this :

<Directory /> Options FollowSymLinks Options +ExecCGI AllowOverride none …