Flutter Development Enviroments Explained in Less Than 5 Minutes

There is no denying that flutter is on the rise. With its latest update, it has also added full support for Linux applications, making it a flexible tool for making apps for ios/android/web/windows/mac … pretty much anything (even chrome extensions). This begs the question about which development environment to pick to build your next flutter app. In this post, I will be outlining the available option and what they are good/not good for. The criteria used to judge the environments are:

Without further ado let’s get right into it.

Android Studio

Let’s start with probably the biggest player. Android Studio is the goto option for android development in java and kotlin and was the first to welcome flutter. It is probably still the widest used environment and even the flutter.dev website shows it as the default in their setup tutorials. Also, most popular courses, such as London App Brewery’s flutter development Bootcamp use Android Studio. With all this being said I think that Android studio is the best option for beginners starting with flutter.

Now let’s see how it stacks up to the criteria:

• ⚡ Speed: Here is where my problem with Android Studio starts. Since it is a fully-fledged IDE it will take longer to load over traditional text editors. Also, older devices will struggle to run it on intensive load, especially if you also open up any designer tool (XD,Figma, Sketch, etc.). However given the proper hardware specification, which can be found on the android studio website it will run great, and probably only startup times are going to be noticed. And hey it’s still miles better than Xcode 😉 (8gb storage for an IDE cough cough)
• ⚙ Functionality: As for functionality, it has the full package if app development is all you are doing, so IntelliSense, boilerplate code, color inspectors, etc. The advantage that Andriod Studio (and IntelliJ) has over the rest is the flutter inspector which wins a lot of people over as you will be able to inspect properties of your widgets in a visual way
• 🖥 Source Controls: Full git integration, and more in-depth information about the commits and pulls. Again android studio has a bit of an advantage over vscode as it makes things easier by making them visual

Intellij

Android Studio is pretty much built on intellij, so it will have all the features that Android studio has however since it is more general a bit more configuration will be needed to get it working like Android Studio. But on the plus, the fact that it is more general allows you to do more than just app development on it, which for some developers is a better choice.

How it scores on each criterion is similar to Android Studio, but keep in mind the additional setup time.

VSCode

VSCode was launched in 2015 and has quickly gained traction for just being a great text editor. It has an excellent community, with extensive walkthroughs on youtube. It allows you to change the look and feel exactly how you want it and allows you to easily add key commands to make your workflow as efficient as possible.

VSCode has extensions for flutter/dart which comes with all the commands necessary for building flutter apps. It also has many packages that make it easier to write flutter code by providing boilerplate code. You will also find many other extensions that can greatly improve your workflow. Furthermore, it has IntelliSense built-in and some would argue that this version is even better than what you find in android studio or Intellij

As for how it fairs in the criteria:

• ⚡ Speed: VSCode is a code editor with a fancy package system. This means that loading it is extremely fast and opening files from the terminal is a simple command away. Also if you master the keyboard shortcuts you can zoom past all your files and settings without even ever touching your mouse or trackpad, the holy grail many developers.
• ⚙ Functionality: Out of the box VSCode is just a text editor, you need to install the necessary packages to get it to work with flutter development. The flutter team has a walkthough of everything you need. Once that is done it is only a flutter inspector away from having all the features of android studio
• 🖥 Source Controls: Source control is also built into vscode, albeit not as feature-rich as Android Studio, however, if you are used to the terminal for source control you will feel right at home

Honorable Mentions

This can’t be taken by themselves because as of now you can’t use them to build apps as they are limited to displaying one page online, and no additional flutter packages. However, these are still great if you are a beginner looking to get used to building apps with flutter and want to experiment with some widgets.

Dartpad

Dartpad is an online flutter/dart compiler that runs the code and displays it online to you. You can only write one file of code and you cannot import packages, however, it is a great option for playing with widgets and testing out ideas. Or to test dart function you are going to use in your app without the UI interface getting in the way.

Also, another cool thing about dartpad is its integration with GitHub gists, like that you can save your dart code as a gist and run/share it later.

Furthermore, it has a slight victory over codepen as it supports minimal code suggestion tool.

Codepen

Codepen is used for sharing web design online. You will find many developers and designers who upload their designs and animation in HTML/CSS/JS and Vue. They have recently added flutter support, so you can expect a similar experience if you have used it before. Again like dartpad it only supports one file of code and no external packages.

This is a great tool if you want to learn/explore flutter widgets and animations and if you want to start yourself sharing your flutter design and animations.

Further, it is an excellent choice for anyone who makes blogs or tutorials about flutter, as you can integrate your created pen into your website (even to your Medium post!) so that you can more clearly display your ideas and steps.

My choice 👀

I use VSCode. I started with Android Studio as I had developed android apps in the past but the speed of VSCode and the extensions library won me over. The speed is also a great benefit and has helped me to just start more projects because it is so easy .Especially if you are also a web developer that works with other technologies, VSCode has been serving me well in all my development needs. And with the plugin SettingsSycn I can take it to wherever I go and use it on whatever machine I happen to have at that time.

Conclusion

In conclusion, I hope that this information was useful in helping you decide where to start with your flutter app development journey. It is interesting to see the growing number of tools and support for flutter development and probably this list will change very soon (especially with the looming release of Github’s codespaces project) and I hope to provide an updated list when this happens.

Originally published at https://www.dailyflutter.monster on August 7, 2020.