How to install Flutter on Windows 11

미연

·

2022. 5. 6. 10:17

Hi there, in this tutorial we will learn complete installation of Flutter on windows 10 and all things are the same on windows 11. Which includes: First, Running a flutter project on android studio using a virtual device. Second, running a Flutter project on VS Code. Third, useful extensions for Flutter which will make your work much more easier during a project.Even if you are a user of VS Code, follow all the steps and do NOT skip anything that all unnecessary things are already skipped. Don't forget to Like the post and Subscribe my blog and don't miss my Future Real Project tutorials. So, let's get started. Go to flutter.dev and press Get Started. Choose windows and install it according to your system type.Here you can see it, in my case, I choose 64 and install it leaving everything as a default, just press next next and install Git is ready. Now download Flutter SDK and extract itand do not install it in Program Files, install it as suggested in documentation.Cut the 'flutter' folderand create src folder just in the C disk.and paste the flutter folder in it.Go to bin folder copy the path and search environment variables Select the path, if you don't have it, create it and press edit button. Press new button and paste the copied path... press ok and ok. Now let's test it. Search 'cmd' and open it.Run 'flutter' command, if you are seeing also like this then congratulations. Let's check Git also type 'git --version' it's all working. Run 'flutter doctor'command which tells us what's left. So, next step is installing of Android Studio download Android Studio and JDK While running flutter projects, JDK 11 or JDK 16 has some bugs so JDK 8 is the best version. Link to JDK 8 is in the description.Install JDK firstand now Android Studiojust nextand customselect the theme you want, I prefer darcula, make sure that these are also checked as mine, leave this page as a default and finish and go to 'SDK Manager'in 'SDK Tools' download 'Android SDK Command-line Tools' also, ok ok accept and next.And now go to 'AVD Manager' add 'Virtual Device' select the device and download Android version.and here go to 'Advanced Setting' and increase internal storage of virtual device so that when you have installed 3 or more Flutter projects, you will not get 'insufficient storage error' while installing the new one.Next, install Flutter and Dart plugins and now we can create new Flutter project. Show here Flutter SDK folder this is our project and let's run first virtual device. This error occurs every time when you run a brand new project, to solve it go to File -> Project Structure and select the latest Android SDK. One last thing, that we have to install Android License run this command flutter doctor --android-license and accept itnow we have no problemsrun the project and it's all okay it's turn to install VS Code. Now, download VS Code from official website after that, install it leaving everything as a default and make sure that this checkbox is also checked. Select the theme you want.Go to extensions install flutter extension and it also installs dart extension next, that import extension which helps you to manage and fix all imports next pubspec assets extension this helps you to add or update your dependencies on prospect.aml file next material icon theme install it if you want to get the material design icons into your VS Code Next, bracket pair colorizer 2.It colorizes your brackets in different colors so that the code will be easy to read press ctrl+shift+p and search flutter new project set flutter SDK folder and we have installed many things i think it's time to restart the computer if you have the same error restart and we will continue so restarted open vs codepress ctrl+shift+p and type flutter new project choose application select folder to create the project in and type project name check this checkbox and here select virtual device which is a virtual device that you have created via android studio that's why we need to install android studio to create virtual device.This is our brand new projectand here I will show you how to use power spec assist before it let's get rid of some commands now press ctrl+shift+p again search pubspec assist select add or update dependencies and insert package name for example 'flutter_bloc'and you can see that it added the last version of flatter_bloc package.I forgot to mention two more useful extensions first one is 'bloc'.When you right click to 'lib' folder there is no auto bloc or cubit creator let's edit go to extensions and search bloc and next dart data class generator this helps you to create data classes based on class properties go back and again right click to 'lib' folder and you can see bloc and cubit to create them fast.Don't forget to Like the post