Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/mhmzdev/flutter-roadmap-and-resources-guide

A roadmap from a beginner's point of view. Which can help you in becoming a full fledge flutter developer.
https://github.com/mhmzdev/flutter-roadmap-and-resources-guide

dartlang flutter flutter-roadmap guide roadmap

Last synced: 9 days ago
JSON representation

A roadmap from a beginner's point of view. Which can help you in becoming a full fledge flutter developer.

Awesome Lists containing this project

README 

        
🗺 Flutter Roadmap & Resource Guide



*In Reference to detailed Article Here*



I will be sharing a simple roadmap and resources that I use personally for improving my flutter skills. You can obviously figure out your way of learning but here's mine. I will keep on adding link from [Flutter Offical Docs][flutterdoc] so that you might get an idea how helpful Flutter official documentation is. 😃



### 🏃‍♂️ Let's Begin!



Its more like a mix of Roadmap and Resource. So, that if you are a complete beginner you will have something to jump to :)



## 🎯 Confusion Regarding Dart



A lot of people think ask whether we need to learn **Dart** before starting flutter or not? My opinion is:



- If you are new programmer, you must the knowledge of OOP and Stack in Data structure will be a plus!

- Otherwise, there is no need to learn Dart specifically its quite similar to Java/C++/C# so you will keep getting it on the way :)










## 💻 Which IDE is BEST!?



I have seen a lot of beginners confused between which IDE to choose for Flutter development. Well, here is my suggestion for you.

- If you have a **High End** machine **(at least SSD & 8GB RAM)** then you can go for [Android Studio][android-studio-setup-official-docs] and feel free to use Emulator Alongside.

- If you have a **Low End** machine **(at least 4GB RAM)** then you can go for [VS Code][vscode-setup-official-docs] and you **Cannot User Emulator** because it will slows down your system if you opened even a single tab of Chrome for searching some errors.








🔴 **Suggestion**:



I would **strongly recommend** you to **download Android Studio** even if you are not planning to use it. WHY? Well because it will get you a lot of stuff like Android Gradle, Android SDKs, Android Emulators etc built-in. Otherwise, you will need to download them manually and set each one of them. And Believe me, its pain in the ass!



## 👨‍🏫 Flutter Basics

Starting a complete beginner if you are looking for some Udemy courses or YT playlist I would recommend you the following:



- [Getting Started - Flutter Doc][flutter-get-started]

- [Angela Yu Udemy Course][angela-yu-udemy]

- [Net Ninja YT Playlist - Flutter for Beginners][net-ninja-playlist]



After this, you must have the knowledge as shown below:








## 💾 Database



Now, you are done with the basics of flutter and its time to up your flutter game. Let's start with some **Database**. For flutter, I would recommend you to start with **Firebase**. You can use the following resources depending on which helps you to learn stuff faster:



- [Firebase with Flutter - Flutter Doc][data-backend-official-doc]

- [Firebase Official Doc for Flutter][firebase-flutter-official]

- [Net Ninja YT Playlist - Flutter & Firebase][net-ninja-firebase-plyalist]



But What if your client asks you store data locally? No problemo! You can learn **[SQFlite][sqflite-flutter-pkg]** quite similar to *sqlite*.








## 🎨 Responsive UI



Till here you are a complete flutter developer who is very good with Flutter alongside at least very common database i.e Firebase. For Flutter apps it's your responsibility to make your apps responsive for various types of screen sizes. Hence, make sure to learn Responsive UI in Flutter and you can use the following to get you started:

- [Responsive Apps - Flutter Doc][responsive-ui-official-doc]

- [Responsive UI Setup - YT][responsive-ui-setup-yt]

- [Medium Article][responsive-ui-article]



## 🌐 Networking



If you are at this stage altough you can develop apps with beautiful responsive UI alongside database. But, you need to keep learning more and more stuff so that you can manage data otherway around. For that, make sure to learn **RESTful API** and **jSON Data**. In case you are a good with socket programming you can learn that but that's optional here :)



- Networking in Flutter

  - [Networking - Official Doc][networking-official-doc]

  - [Send Data to Internet - Official Doc][send-data-official-doc]

  - [Fetch Data from Internet - Official Doc][fetch-data-official-doc]

- RESTful API

  - [Medium Article - Complete Guide][restapi-medium-article]

- jSON Data Parsing

  - [Parsing Complex jSON - Medium Article][json-medium-article]










📱 Apps you can try:

  - [COVID-19 Tracker][covid19-app]

  - [The Holy Qur'an App][holy-quran-app]

  - [Music App - Article][music-app]

  - [News App][news-app]



## 🛠 State Management



The next big thing you need to learn for Flutter is managing the state. There are a lot of State managment techniques that you can use. Following are few:

 - [State Management - Flutter Doc][state-management-official-doc]

 - [Providers][provider]

 - [BloC][bloc]

 - [Redux][redux]

 - [MobX][mobx] and others.



## 📱 Store Knowledge



Since you are a cross-platform app developer now, you must know about the guidelines of uploading an app to App Store and Google Play store. So, make sure to get knowledge about uploading an app accordingly.










## 🤔 What's Next?



Learning never ends! Keep learning with resources, keep exploring, keep sharing your apps and projects with others to get reviews and help. And always remember:



"Achivements Don't Speak themselves!"



- Get yourself a Nice looking [GitHub profile][github-profile] and showcase your project with proper documentation. This shows other people who are looking for developers that you are serious about your work and career. Get a nice GitHub Readme for you. [Here's mine][github-readme], you can use it and customize it for yourself 😊

- Same goes for having a Nice looking [LinkedIn profile][linkedin-profile] and make connection. This will keep you going and you will get numerous opportunity on the way!

- Another good way to present yourself will be having a [live resume][live-resume]. Ask your friend to get you simple one.



## 📃 Other Resources



Below are the resources which you can use to expand you Flutter knowledge and research:

- [Flutter Official Doc][flutterdoc]

- [ItsAllWidgets][itsallwidges]

- Medium

  - [Flutter Community Medium][medium-flutter-community]

  - [Flutter Medium][medium-flutter-officials]

  - [Dart Medium][medium-dart]

- GitHub

  - [Flutter Community GitHub][flutter-community-github]

  - [Awesome Flutter GitHub][awesome-flutter-github]

- Facebook Groups

  - [Flutter Community FB Group][flutter-community-fb]

  - [Let's Flutter with Dart][letsFlutterWithDart-fb]

- LinkedIn Pages

  - [Flutter Devs][flutterDevs-linkedin]

  - [Flutter App Development][flutterAppDev-linkedin]

- YouTube

  - [Flutter][flutter-yt]

  - [Fun with Flutter][funWithFlutter-yt]

  - [MTECHVIRAL][mtechviral-yt]

  - [Easy Approach][easyapproach-yt]

  - [Net Ninja][net-ninja-playlist]



## Make sure to 🌟 the Repo!



## Author



#### Muhammad Hamza 🧑

[![LinkedIn Link](https://img.shields.io/badge/Connect-Hamza-blue.svg?logo=linkedin&longCache=true&style=social&label=Connect

)](https://www.linkedin.com/in/mhmzdev)



👉 You can also follow my GitHub Profile to stay updated about my latest projects:



[![GitHub Follow](https://img.shields.io/badge/Connect-Hamza-blue.svg?logo=Github&longCache=true&style=social&label=Follow)](https://github.com/mhmzdev)



Copyright (c) 2020 MUHAMMAD HAMZA



## 🔑 LICENSE

- This project is licensed under the MIT License - see the [LICENSE](LICENSE.md) file for details



[live-resume]: https://mhmz.dev

[linkedin-profile]: https://www.linkedin.com/in/mhmzdev/

[github-profile]: https://github.com/mhmzdev

[github-readme]: https://github.com/mhmzdev/mhmzdev

[covid19-app]: https://github.com/mhmzdev/Covid19-Tracker-App

[holy-quran-app]: https://github.com/mhmzdev/The_Holy_Quran_App

[music-app]: https://medium.com/@ekosuprastyo15/flutter-music-app-example-with-api-deezer-21653239db48

[news-app]: https://github.com/theindianappguy/FlutterNewsApp

[json-medium-article]: https://medium.com/flutter-community/parsing-complex-json-in-flutter-747c46655f51

[restapi-medium-article]: https://medium.com/flutterdevs/using-rest-api-in-flutter-d19e6eb972b8

[networking-official-doc]: https://flutter.dev/docs/development/data-and-backend/networkings

[send-data-official-doc]: https://flutter.dev/docs/cookbook/networking/send-data

[fetch-data-official-doc]: https://flutter.dev/docs/cookbook/networking/fetch-data

[sqflite-flutter-pkg]: https://pub.dev/packages/sqflite

[vscode-setup-official-docs]: https://flutter.dev/docs/get-started/editor?tab=vscode

[android-studio-setup-official-docs]: https://flutter.dev/docs/get-started/editor

[responsive-ui-setup-yt]: https://www.youtube.com/watch?v=z7P1OFLw4kY&ab_channel=FilledStacks

[responsive-ui-article]: https://medium.com/nonstopio/let-make-responsive-app-in-flutter-e48428795476

[responsive-ui-official-doc]: https://flutter.dev/docs/development/ui/layout/responsive

[provider]: https://pub.dev/packages/provider

[bloc]: https://pub.dev/packages/bloc

[redux]: https://pub.dev/packages/redux

[mobx]: https://pub.dev/packages/mobx

[state-management-official-doc]: https://flutter.dev/docs/development/data-and-backend/state-mgmt/options

[data-backend-official-doc]: https://flutter.dev/docs/development/data-and-backend/firebase

[flutter-get-started]: https://flutter.dev/docs/get-started/install

[angela-yu-udemy]: https://www.udemy.com/course/flutter-bootcamp-with-dart/

[net-ninja-playlist]: https://www.youtube.com/watch?v=1ukSR1GRtMU&list=PL4cUxeGkcC9jLYyp2Aoh6hcWuxFDX6PBJ&ab_channel=TheNetNinja

[net-ninja-firebase-plyalist]: https://www.youtube.com/watch?v=sfA3NWDBPZ4&list=PL4cUxeGkcC9j--TKIdkb3ISfRbJeJYQwC&ab_channel=TheNetNinjaTheNetNinjaVerified

[flutterdoc]: https://flutter.dev/

[firebase-flutter-official]: https://firebase.google.com/docs/flutter/setup?platform=android

[medium-flutter-officials]: https://medium.com/flutter

[medium-flutter-community]: https://medium.com/flutter-community

[medium-dart]: https://medium.com/dartlang

[stackoverflow]: https://stackoverflow.com

[flutter-yt]: https://www.youtube.com/channel/UCwXdFgeE9KYzlDdR7TG9cMw

[funWithFlutter-yt]: https://www.youtube.com/channel/UCU8Mj6LLoNBXqqeoOD64tFg

[mtechviral-yt]: https://www.youtube.com/channel/UCFTM1FGjZSkoSPDZgtbp7hA

[easyapproach-yt]: https://www.youtube.com/channel/UC4hWRtPpBaq72ERUuKsvO7g

[flutter-community-fb]: https://web.facebook.com/groups/fluttercommunity/

[letsFlutterWithDart-fb]: https://web.facebook.com/groups/425920117856409/

[flutterDevs-linkedin]: https://www.linkedin.com/showcase/flutterdevs/

[flutterAppDev-linkedin]: https://www.linkedin.com/company/flutter-app-development-firm/

[flutter-community-github]: https://github.com/fluttercommunity

[awesome-flutter-github]: https://github.com/Solido/awesome-flutter

[itsallwidges]: https://itsallwidgets.com/

[fidev]: https://fidev.io/



[my-stackoverflow]: https://stackoverflow.com/users/12297382/hamza

[my-github]: https://github.com/m-hamzashakeel

[my-medium]: https://mhamzadev.medium.com/

[my-portfolio]: http://mhmz.dev