How to get started with Flutter

Hello therešŸ™‹šŸæā€ā™€ļø

Iā€™m excited to share my first walk of being a flutter ninja!..Yay!šŸ’ƒšŸæšŸ’ƒšŸæ

I would love this to be a series and a record of how much Iā€™ve learned in my journey as a flutter developer. And, as the saying goes, ā€œWe never stop learning;" so, do well to send me feedback and share resources that helped you to understand concepts too.

What is Flutter?

According to Google, Flutter is a UI(User Interface) toolkit designed by Google to build beautiful, natively compiled applications for mobile, web, and desktop from a single Codebasehttps://en.wikipedia.org/wiki/Codebase. The framework is built using the Dart programming language, popularly known as ā€œdart Lang." Its first stable version was introduced on December 4, 2018.

What do I need to start creating things with Flutter?

Oh well, lucky you! I had a list of things to put in place before I could start making magic using flutter. This list includes:

Step 1: Install Flutter, but thatā€™s a bit easy.šŸ˜‰ Visit Flutterhttps://docs.flutter.dev/get-started/install to get started. When you do, you will see a page like this:

widget

Select your operating system and voila! Youā€™re one step closer to creating awesome Applications.

Step 2: I had to download Android Studio. To do this, visit Android Studio Site downloadhttps://developer.android.com/studio/?gclid=CjwKCAiAqqTuBRBAEiwA7B66hW1RykaWA2BtVgufFL1nqo89eejkTWPEowtt5hdEN-dNhQS-gCDo3hoC7BAQAvD_BwE, follow the instructions, and install. It takes minutes or hours to install, depending on your internet speed. You do need an internet connection to install Android Studio.

Step 3: When the Android Studio is ready, you want to download a JDK(Java SE Development Kit) herehttps://www.oracle.com/java/technologies/javase/javase-jdk8-downloads.html. To download, you will be asked to create an oracle account; itā€™s ok, just create one using your email address, you donā€™t need to know why. I too didnā€™t know why until I got curious (except, of course, youā€™re curious enough šŸ˜ƒ).

Step 4: We will be needing an editor; itā€™s ok to stick with Android Studio, you could look up details on what plugins/ extensions youā€™ll need herehttps://docs.flutter.dev/get-started/editor?tab=androidstudio. But for the likes of myself, who have phobias of Android studio, Iā€™d propose that you download Intelli J OR Vs Code. For the record, I use the latter.

Step 5: You want to set up an emulator on your android studio. Either visit this linkhttps://developer.android.com/studio/run/managing-avds, to follow instructions and set up your emulator, or you can use your cellphone. I would advise you to, however,download an emulator ā€“ you will need good internet for that too.

Step 6: I am positive that everything is set on the background, now letā€™s make our editor more fun to use. Remember, I make use of VS Code, so I will be dropping some extensions that have made coding Flutter a bit interesting. For starters, we need to install Flutter and Dart pluginshttps://docs.flutter.dev/get-started/editor?tab=vscode. Once those are installed, open up the hamburger menu, click on ā€œSamples & Tutorialsā€, click on ā€œCodelabsā€, and now youā€™re running your first app!

For my favorite plugins, Iā€™d say that they are ā€œBracket Pair Colorizerā€ and ā€œAwesome flutter snippetsā€. Below is a screenshot of my favorite extensions, and on the right side is the default first flutter app.

The left side is a list of my favorite extensions, for starters. And the right part is the first flutter program you will run.
The left side is a list of my favorite extensions, for starters. And the right part is the first flutter program you will run.

And guess what?! We are set to go! Iā€™d love to know how well you did with these and, if you need help, please do well to connect with me on Twitterhttps://twitter.com/iamCynthiaPeter. Thank you for reading. Cheersā€‹!

Free Resources