2 |
3 | [comment]: <> (*In Reference to detailed Article Here*)
4 |
5 | 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. 😃
6 |
7 | ### 🏃♂️ Let's Begin!
8 |
9 | Its more like a mix of Roadmap and Resource. So, that if you are a complete beginner you will have something to start with :)
10 |
11 | ## 🎯 Confusion Regarding Dart
12 |
13 | A lot of people think ask whether we need to learn **Dart** before starting flutter or not? My opinion is:
14 |
15 | - If you are new programmer, you must have the knowledge of OOP and Stack in Data structure will be a plus!
16 | - 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 :)
17 |
18 |
19 |
20 |
21 |
22 |
23 |
24 | ## 💻 Which IDE is BEST!?
25 |
26 | I have seen a lot of beginners confused between which IDE to choose for Flutter development. Well, here is my suggestion for you.
27 | - 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.
28 | - 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.
29 | - If you have a **Low End** machine **(at least 4GB RAM)** then you can go for [Intelli][Intelli] 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.
30 | - If you have a **Low End** machine **(at least 4GB RAM)** then you can go for [DartPad][DartPad] To help you write code Dart
31 |
32 |
33 | ## 👨🏫 Dart Basics
34 | Starting a complete beginner if you are looking for some Udemy courses or YT playlist I would recommend you the following:
35 |
36 | - [Getting Started - Dart][Dart-get-started]
37 | - [Mohamed Shushan Youtube Course][DartPlaylist-get-started]
38 |
39 |
40 | After this, you must have the knowledge as shown below:
41 |
42 |
43 |
44 |
45 |
46 |
47 |
48 |
49 | 🔴 **Suggestion**:
50 |
51 | 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!
52 |
53 | ## 👨🏫 Flutter Basics
54 | Starting a complete beginner if you are looking for some Udemy courses or YT playlist I would recommend you the following:
55 |
56 | - [Getting Started - Flutter Doc][flutter-get-started]
57 | - [Wael abo hamza Youtube Playlist][Wael-abo-hamza-Youtube-Playlist]
58 | - [Abdullah Mansour Udemy Course][Abdullah-Mansour-playlist-udemy]
59 | - [Hassan Fulaih Udemy Course][Hassan-Fulaih-udemy]
60 | - [Angela Yu Udemy Course][angela-yu-udemy]
61 | - [Net Ninja YT Playlist - Flutter for Beginners][net-ninja-playlist]
62 |
63 | After this, you must have the knowledge as shown below:
64 |
65 |
66 |
67 |
68 | ## 💾 Database
69 |
70 | 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:
71 |
72 | - [Firebase with Flutter - Flutter Doc][data-backend-official-doc]
73 | - [Firebase Official Doc for Flutter][firebase-flutter-official]
74 | - [Net Ninja YT Playlist - Flutter & Firebase][net-ninja-firebase-plyalist]
75 | - [Flutter With Firebase Arabic][Flutter-With-Firebase-Arabic]
76 |
77 | But What if your client asks you store data locally? No problemo! You can learn **[SQFlite][sqflite-flutter-pkg]** quite similar to *sqlite*.
78 |
79 |
80 |
81 |
82 | ## 🎨 Responsive UI
83 |
84 | 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:
85 | - [Responsive Apps - Flutter Doc][responsive-ui-official-doc]
86 | - [Responsive UI Setup - YT][responsive-ui-setup-yt]
87 | - [Abdullah Mansour][responsive-ui-article-Abdullah Mansour]
88 | - [Medium Article][responsive-ui-article]
89 |
90 | ## 🌐 Networking
91 |
92 | 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 :)
93 |
94 | - Networking in Flutter
95 | - [Networking - Official Doc][networking-official-doc]
96 | - [Send Data to Internet - Official Doc][send-data-official-doc]
97 | - [Fetch Data from Internet - Official Doc][fetch-data-official-doc]
98 | - RESTful API
99 | - [Medium Article - Complete Guide][restapi-medium-article]
100 | - jSON Data Parsing
101 | - [Parsing Complex jSON - Medium Article][json-medium-article]
102 | - other sources
103 | - [Flutter Networking PlayList][Flutter-Networking]
104 |
105 |
106 |
107 |
108 |
109 | 📱 Apps you can try:
110 | - [Flutter E Commerce App Using Getx][Flutter-E-Commerce-App-Using-Getx]
111 | - [Shop App Api][Shop-App-Api]
112 | - [Music App - Article][music-app]
113 | - [News App][news-app]
114 | - [Social App][social-app]
115 |
116 | ## 🛠 State Management
117 |
118 | The next big thing you need to learn for Flutter is managing the state. There are a lot of State management techniques that you can use. Following are few:
119 | - [State Management - Flutter Doc][state-management-official-doc]
120 | - [Providers][provider]
121 | - [BloC][bloc]
122 | - [Redux][redux]
123 | - [MobX][mobx] and others.
124 |
125 | Example PlayList
126 | - [Providers PlayList][provider-Playlist]
127 | - [Bloc PlayList][bloc-Playlist]
128 | - [Getx PlayList][Getx-Playlist]
129 |
130 | ## 📱 Store Knowledge
131 |
132 | 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.
133 |
134 |
135 |
136 |
137 |
138 | ## 🤔 What's Next?
139 |
140 | 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:
141 |
142 |
"Achivements Don't Speak themselves!"
143 |
144 | - 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 😊
145 | - 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!
146 |
147 |
148 | ## 📃 Other Resources
149 |
150 | Below are the resources which you can use to expand you Flutter knowledge and research:
151 | - [Flutter Official Doc][flutterdoc]
152 | - Medium
153 | - [Flutter Community Medium][medium-flutter-community]
154 | - [Flutter Medium][medium-flutter-officials]
155 | - [Dart Medium][medium-dart]
156 | - GitHub
157 | - [Flutter Community GitHub][flutter-community-github]
158 | - [Awesome Flutter GitHub][awesome-flutter-github]
159 | - Facebook Groups
160 | - [Flutter Community FB Group][flutter-community-fb]
161 | - LinkedIn Pages
162 | - [Flutter Devs][flutterDevs-linkedin]
163 | - [Flutter App Development][flutterAppDev-linkedin]
164 | - YouTube
165 | - [Flutter][flutter-yt]
166 | - [Pesa Channel][PesaChannel]
167 | - [Fun with Flutter][funWithFlutter-yt]
168 | - [MTECHVIRAL][mtechviral-yt]
169 | - [Easy Approach][easyapproach-yt]
170 |
171 |
172 | ### Make sure to 🌟 the Repo!
173 |
174 | ## Author
175 |
176 | #### AhmedMohamedGhanam 🧑
177 |
178 | [portfolio 🧑] [my-portfolio]
179 |
180 | [Facebook](https://www.facebook.com/profile.php?id=100011744910238)
181 |
182 |
183 | [Gmail](ahmedmohamedghanam6@gmail.com)
184 |
185 |
186 |
187 |
188 | [](https://www.linkedin.com/in/ahmed-mohamed-a67100193)
190 |
191 | 👉 You can also follow my GitHub Profile to stay updated about my latest projects:
192 |
193 | [](https://github.com/Ghanam330)
194 |
195 | Copyright (c) 2021 AhmedMohamedGhanam
196 |
197 | ## 🔑 LICENSE
198 | - This project has been Reviewed by Senior Engineers in the field of Flutter
199 |
200 | [live-resume]: https://github.com/Ghanam330
201 | [linkedin-profile]: https://www.linkedin.com/in/ahmed-mohamed-a67100193/
202 | [github-profile]: https://github.com
203 | [github-readme]: https://github.com/Ghanam330/Ghanam330
204 | [Flutter-E-Commerce-App-Using-Getx]: https://github.com/Ghanam330/Shopping_Market_App
205 | [Shop-App-Api]: https://github.com/Ghanam330/UdemyshopAppApi
206 | [music-app]: https://medium.com/@ekosuprastyo15/flutter-music-app-example-with-api-deezer-21653239db48
207 | [news-app]: https://github.com/Ghanam330/NewsAppFlutter
208 | [social-app]: https://github.com/Ghanam330/socialapp
209 | [json-medium-article]: https://medium.com/flutter-community/parsing-complex-json-in-flutter-747c46655f51
210 | [restapi-medium-article]: https://medium.com/flutterdevs/using-rest-api-in-flutter-d19e6eb972b8
211 | [Flutter-Networking]: https://www.youtube.com/watch?v=IQ6NJ8JoO9E&list=PL3aG1K3LWCre6DIC2amKlXjn_kd2P6zE9
212 | [send-data-official-doc]: https://flutter.dev/docs/cookbook/networking/send-data
213 | [fetch-data-official-doc]: https://flutter.dev/docs/cookbook/networking/fetch-data
214 | [sqflite-flutter-pkg]: https://pub.dev/packages/sqflite
215 | [vscode-setup-official-docs]: https://flutter.dev/docs/get-started/editor?tab=vscode
216 | [Dartpad]:https://dartpad.dev
217 | [Intelli]:https://dart.dev/tools/jetbrains-plugin
218 | [android-studio-setup-official-docs]: https://flutter.dev/docs/get-started/editor
219 | [responsive-ui-setup-yt]: https://www.youtube.com/watch?v=z7P1OFLw4kY&ab_channel=FilledStacks
220 | [responsive-ui-article]: https://medium.com/nonstopio/let-make-responsive-app-in-flutter-e48428795476
221 | [responsive-ui-article-Abdullah Mansour]: https://www.youtube.com/watch?v=y3Vb_Z4Stco
222 | [responsive-ui-official-doc]: https://flutter.dev/docs/development/ui/layout/responsive
223 | [provider]: https://pub.dev/packages/provider
224 | [bloc]: https://pub.dev/packages/bloc
225 | [redux]: https://pub.dev/packages/redux
226 | [mobx]: https://pub.dev/packages/mobx
227 | [state-management-official-doc]: https://flutter.dev/docs/development/data-and-backend/state-mgmt/options
228 | [provider-Playlist]: https://www.youtube.com/watch?v=ihvYEh9HcbI&list=PLV1fXIAyjeuaXqlV086QKLa2Z5D2u6QPY
229 | [bloc-Playlist]:https://www.youtube.com/watch?v=cE7APaTeRXY
230 | [Getx-Playlist]: https://www.youtube.com/watch?v=DS7oGzG8lTw&list=PLV1fXIAyjeuZ2pOUkmHwzMJCJgCedrQJW
231 | [data-backend-official-doc]: https://flutter.dev/docs/development/data-and-backend/firebase
232 | [flutter-get-started]: https://flutter.dev/docs/get-started/install
233 | [Dart-get-started]: https://dart.dev/tutorials/server/get-started
234 | [DartPlaylist-get-started]: https://www.youtube.com/watch?v=Hptcyp4E-To&list=PLnzqK5HvcpwQSrjaK2zpggw2uhf4VrLtI
235 | [angela-yu-udemy]: https://www.udemy.com/course/flutter-bootcamp-with-dart/
236 | [net-ninja-playlist]: https://www.youtube.com/watch?v=1ukSR1GRtMU&list=PL4cUxeGkcC9jLYyp2Aoh6hcWuxFDX6PBJ&ab_channel=TheNetNinja
237 | [Abdullah-Mansour-playlist-udemy]: https://www.udemy.com/course/complete-flutter-arabic
238 | [Hassan-Fulaih-udemy]: https://www.udemy.com/course/fluttercourse
239 | [Wael-abo-hamza-Youtube-Playlist]: https://www.youtube.com/watch?v=ckwAJ4O3fvU&list=PL93xoMrxRJIsoHL8gG1UBfVoXKi7OxbLU
240 | [Flutter-With-Firebase-Arabic]: https://www.youtube.com/playlist?list=PLuBL2DYgVDm2Gyr-2AFaNFj0JA8WSSH0T
241 | [net-ninja-firebase-plyalist]: https://www.youtube.com/watch?v=sfA3NWDBPZ4&list=PL4cUxeGkcC9j--TKIdkb3ISfRbJeJYQwC&ab_channel=TheNetNinjaTheNetNinjaVerified
242 | [flutterdoc]: https://flutter.dev/
243 | [firebase-flutter-official]: https://firebase.google.com/docs/flutter/setup?platform=android
244 | [medium-flutter-officials]: https://medium.com/flutter
245 | [medium-flutter-community]: https://medium.com/flutter-community
246 | [medium-dart]: https://medium.com/dartlang
247 | [stackoverflow]: https://stackoverflow.com
248 | [flutter-yt]: https://www.youtube.com/channel/UCwXdFgeE9KYzlDdR7TG9cMw
249 | [funWithFlutter-yt]: https://www.youtube.com/channel/UCU8Mj6LLoNBXqqeoOD64tFg
250 | [mtechviral-yt]: https://www.youtube.com/channel/UCFTM1FGjZSkoSPDZgtbp7hA
251 | [easyapproach-yt]: https://www.youtube.com/channel/UC4hWRtPpBaq72ERUuKsvO7g
252 | [flutter-community-fb]: https://www.facebook.com/groups/FlutterArabic
253 | [flutterDevs-linkedin]: https://www.linkedin.com/showcase/flutterdevs/
254 | [flutterAppDev-linkedin]: https://www.linkedin.com/company/flutter-app-development-firm/
255 | [flutter-community-github]: https://github.com/fluttercommunity
256 | [awesome-flutter-github]: https://github.com/Solido/awesome-flutter
257 | [itsallwidges]: https://itsallwidgets.com/
258 | [fidev]: https://fidev.io/
259 | [PesaChannel]: https://www.youtube.com/channel/UCXtrcGwng31h3NUOqhV1Kew
260 | [my-github]: https://github.com/Ghanam330
261 | [my-portfolio]: https://ghanam330.github.io/AhmedMohamedWebsite/#/
262 |
--------------------------------------------------------------------------------