I have an interview in a few days for a position with flutter. I'm a Backend dev and had no experience with this but, man, this was so clear to me. Thank you
This kind of content is of critical importance. Explaining basic concepts in a simple & easy to follow way is a key for flutter enablement, also seeking help from Filip to present the content is a huge extra!
I'm reading the comments: 99% (not accurate) of them are about the love we feel for Filip. A lot of us think to know flutter thanks to him, Matt, Emily and Andrew but, most of the time, we forget that there is a whole team behind both the amazing technology they created and the crafting of these videos, so... to the whole flutter team: Thank you ❤
Agreed! I think it's a little unfair that I get a lot of credit just because I'm the one explaining, while the ones doing the arguably harder work of building and maintaining the SDK often don't. Kudos to the whole team behind Flutter, both inside Google and outside.
I first heard of flutter when i wanted to make an app with user authentication as a project to get selected for a team of app developers at my college.(i had no exp in dev before that other than writing html for my own fun webpages). I had 7 days to learn, setup and complete the task and 2 days were spent on setting up and ensuring everything works. It was really the hardest step in my journey.
Just to say "Thank you"! This was my first contact with Flutter and as an "Old Programmer (I started with Basic in 1984)" I was a little scared by the format of everything, despite programming well in Python, this Dart format was still very strange to me. Now I'm ready to make my first program in Flutter.
I'm still fairly new to Flutter, but had experience with Java and Android development and I really enjoyed your lesson and appreciate the flexibility in your guide and the little challenges in it which I enjoyed as well, Thanks Filip!
Hello! Big thank you to Flutter and the community, this video was a great start for me to get into mobile app programming and here we go: My Wave App (content creator dashboard on mobile) is live so thanks to TH-cam and this channel!
I have seen your video 2 times, it was very logical and straight forward and to the point, basic stuff and structure is very clear and with minimalistic code, I am converting my existing web app based on php, html, javascript. your tutorial made my life easier as you have not made confused by using alternative methods, you taught only the things which are practical and most logically useful rest playing with options left to developer that's good good but flow of developing good UI is awesome. I really appreciate you work.
Aww. Thanks! I'm still around, of course. But I'm also super happy about the current team and their work here on TH-cam. And I'm arguably happier working on my own sand castles and sometimes popping in to give a talk or two. So, everyone wins! :)
Thank you so much for this. I had a different tutorial (from a bigger channel...) that completely went over the installing stuff part and other important things. Figured it out myself and when I came to programming decided to switch to this. After finding that you explained everything that went wrong for me (had VS Code but not VS). Great tutorial from a didactic, content and result standpoint!
You should become a teacher, just a thought. Was able to learn this and actually pay attention a hundred times easier than any of my college professors teachings. Thank you!
Thanks a lot for this amazing combo (the website course + the video), I am a beginner (with some basic knowledge in programming) and I wanted to see what flutter is capable to do. Building with you step by step this project was perfect for me I almost spent the whole day with this video I also loved the presentation it is so creative, thanks again
I never left! No, but seriously. I'm working on my own stuff but I love the fact that the Flutter team sometimes lets me pop in and give a talk or codelab. Best of both world, if you ask me. :)
Very nice and important way to give an overview about how to learn to programm and use flutter! Im totaly new by using flutter, and i have to say i understand the most things. Thanks!
beautiful and insightful. It really covers the basics. I'd really like a tutorial that covers more advanced topics, for intermediate level. kudos to everyone on the team who made this video possible.
Hi. I finished the tutorial and wanted to go for the advanced version in the codelab. But when I clicked the link it brings me to DartPad but no advanced code. Any idea where can I find the advanced code?
I've done my share of cross compiling, working with microcontrollers and RTOS embedded platforms... reminding me that flutter will also work with my linux desktop is really something that speeds up development. It would, however be nice with a basic GUI designer like gtk, because even though flutter is quite straightforward to design by code, it feels like a lot of typing just for prototyping your layout, which can easily be automated. With .Net/C# or Delphi/Pascal you can design your layout in minutes and then start assigning actions to your buttons/widgets... makes it easier to assign the design phase to an actual UX designer, and then take over or assign the programming afterwards. Programmers are not necessarily good designers and vice versa.
Beautifully presented this video, Success isn’t overnight. It’s when everyday you get a little better than the day before. It all adds up,, work hard for your dream, have a great day, lk
First off - great tutorial and codelab. 👏 Found a bug in the codelab though - or atleast I think it's a bug. On the 9th step you link to a advanced version of the app but the link takes us to a dartdev page which doesn't include the app in question. Hope you will fix the link. Thx.
EDIT: The advanced version link does not work, just links to a simple for loop!! Great tutorial, thank you so much! Please do more! You are very entertaining and insightful, great teacher. I failed at the custom favorites page and needed help because I never used .asLowerCase when "printing", which threw a error when I tried to "Text(pair)", because it said it cant be a string. I just assumed it would automatically utilize lower case format?
I'd expect better video quality, he should be on a tiny window at one of the corners of the screen with high fidelity of the content clearly made visible, but kudos for putting out a lesson on the topic
I followed the tutorial but i got bunch of errors... Im not 15:32 and on window... Target of URI doesn't exist: 'package:english_words/english_words.dart'. Try creating the file referenced by the URI, or try using a URI for a file that does exist. Target of URI doesn't exist: 'package:provider/provider.dart'. Try creating the file referenced by the URI, or try using a URI for a file that does exist. The method 'ChangeNotifierProvider' isn't defined for the type 'MyApp'. Try correcting the name to the name of an existing method, or defining a method named 'ChangeNotifierProvider'. Undefined name 'WordPair'. Try correcting the name to one that is defined, or defining the name. The method 'watch' isn't defined for the type 'BuildContext'. Try correcting the name to the name of an existing method, or defining a method named 'watch'. 'unnecessary_breaks' is not a recognized lint rule
try saving your pubspec.yaml file and also saving your analysis_option.yaml files. The main.dart file may not recognize the changes until you save those files
Unfortunately the link to the advanced version is broken (just lands on a "hello world" script) - do you have an archived copy somewhere else? Great tutorial by the way! Edit: I found a copy on the Wayback Machine, but I'll leave this comment here in case you want to update the link.
@@sg2_ Hey, thanks for the heads up! I've flagged it with our team. In the meantime, if anyone's looking for the advanced version: dartpad.dev/?id=e7076b40fb17a0fa899f9f7a154a02e8
I love how at 39:17 the background color of the video also "went blue", and the deep orange color of the button is actually the color of his shirt (noticeable at 52:12) 😂
I'm interested in making an app for Iphone and android phones. You say how important it is to know the target prior to installing anything. I couldn't watch this whole thing because it was painful to watch. ChatGPT suggested Flutter and Dart because it is easy to apply to many devices without the need to recode. Now I will have to dig more because what you said questions that.
in one place you have to say "notify listeners" and then "watch". is it sound or visual. small details but why google is missing such details. why it's not just "listen" instead of "watch". then you have clear understanding what's going on. BTW a grate tutorial
Hi! I try to run the debug mode but the pop up screen is not showing why is that? It says the flutter SDK is not valid open settings? I changed its path still the error was gone, but still the selected edge browser is not popping up.
This first app seemed to be more of a console app. I came in looking to go straight to mobile for android. Having used ionic with Angular, React and Vue I expected to get Flutter/Dart/Android with mobile controls and scripts. I guess I will have to start with a tutorial specific to my targeted platform.
Has anybody found the code for the "advanced" version of the app, would love to check it out, but as others have mentioned the link now contains something else.
Hey, das Video ist wirklich super. Nur komme ich bei min 38:13 nicht weiter. Bei mir ist einen Absatz zu machen leider nicht möglich. Evlt weis jmd wie man da vorgehen muss
what a nice dude, i should say some stuff is a bit (tiny bit) different now to the video and even the doc but yeah i will try it and see if its a good option to add to my frontend skill ( which i hate what is wrong with the terminal? who needs gui?? let me be with my laravel and api and wrapper....)
I've been using Flutter for a while now, but I have not used State Management tools like Provider, Riverpod, etc. But I got confused with this project, by converting from StatelessWidget to StatefulWidget in order to use setState for the selected menu Icon to update its state. If we are using Provider in this project, why not using Provider(ChangeNotifierProvider with ChangeNotifier) to change the state of the selected menu icon?
I get error 403. That’s an error. Your client does not have permission to get URL /codelabs/flutter-codelab-first from this server. That’s all we know. any idea how can solve it?
Wow been struggling for hours with just running the default app and getting all sorts of errors and it couldnt run. I didnt know we always have to update the pubspec smh
Subscribe for the latest → goo.gle/FlutterYT
Aa
I have an interview in a few days for a position with flutter.
I'm a Backend dev and had no experience with this but, man, this was so clear to me.
Thank you
how did the interview go?
@@vikhyat2038 he can't leave us hanging like that
bro how much they pay in your area for a web dev (fullstack) and where if you dont mind me asking
@@vikhyat2038 they hired a mexican dev (mexican ceo so understandable)
@@ahgpy here like 1k to 1.5k usd monthly. it depends of the company (international had likely more higher salaries but national are very low)
This kind of content is of critical importance. Explaining basic concepts in a simple & easy to follow way is a key for flutter enablement, also seeking help from Filip to present the content is a huge extra!
I'm reading the comments: 99% (not accurate) of them are about the love we feel for Filip. A lot of us think to know flutter thanks to him, Matt, Emily and Andrew but, most of the time, we forget that there is a whole team behind both the amazing technology they created and the crafting of these videos, so... to the whole flutter team: Thank you ❤
Agreed! I think it's a little unfair that I get a lot of credit just because I'm the one explaining, while the ones doing the arguably harder work of building and maintaining the SDK often don't. Kudos to the whole team behind Flutter, both inside Google and outside.
@@filiphracek oh glade to see your account 😁
I first heard of flutter when i wanted to make an app with user authentication as a project to get selected for a team of app developers at my college.(i had no exp in dev before that other than writing html for my own fun webpages). I had 7 days to learn, setup and complete the task and 2 days were spent on setting up and ensuring everything works. It was really the hardest step in my journey.
Just to say "Thank you"! This was my first contact with Flutter and as an "Old Programmer (I started with Basic in 1984)" I was a little scared by the format of everything, despite programming well in Python, this Dart format was still very strange to me. Now I'm ready to make my first program in Flutter.
I'm still fairly new to Flutter, but had experience with Java and Android development and I really enjoyed your lesson and appreciate the flexibility in your guide and the little challenges in it which I enjoyed as well, Thanks Filip!
Thank you!
@@filiphracek❤😢
Hello! Big thank you to Flutter and the community, this video was a great start for me to get into mobile app programming and here we go: My Wave App (content creator dashboard on mobile) is live so thanks to TH-cam and this channel!
I have seen your video 2 times, it was very logical and straight forward and to the point, basic stuff and structure is very clear and with minimalistic code, I am converting my existing web app based on php, html, javascript. your tutorial made my life easier as you have not made confused by using alternative methods, you taught only the things which are practical and most logically useful rest playing with options left to developer that's good good but flow of developing good UI is awesome. I really appreciate you work.
What a lovely, informative, well-paced presentation! Thank you!!
Loving the course, content and methodology. Thank you!!!
We've missed you Filip 🔥🔥
Aww. Thanks! I'm still around, of course. But I'm also super happy about the current team and their work here on TH-cam. And I'm arguably happier working on my own sand castles and sometimes popping in to give a talk or two. So, everyone wins! :)
@@filiphracek Glad to know you're doing great. All the best. See you at the next flutter event
This approach of teaching code works best for me. Thanks so much!
Thank you for this tutorial. You teach at a great pace, good explanations, and always in detail. You're good at teaching others for sure!
Thank you for creating this video. It's been very helpful to get started with the basics of Flutter and know what it has to offer. 😊
flutter is really the true choice for the devlopers who only want to write codes one time
Thank you so much for this. I had a different tutorial (from a bigger channel...) that completely went over the installing stuff part and other important things. Figured it out myself and when I came to programming decided to switch to this. After finding that you explained everything that went wrong for me (had VS Code but not VS).
Great tutorial from a didactic, content and result standpoint!
Been there man (the setup is so complicated , it really sucks )
You should become a teacher, just a thought. Was able to learn this and actually pay attention a hundred times easier than any of my college professors teachings. Thank you!
Fantastic introduction! I started to jump from C# to Flutter just to broaden my coverage. Super interesting.
Thanks a lot for this amazing combo (the website course + the video), I am a beginner (with some basic knowledge in programming) and I wanted to see what flutter is capable to do. Building with you step by step this project was perfect for me I almost spent the whole day with this video
I also loved the presentation it is so creative, thanks again
Wait what? Is he back?
Sadly no😢😢
He's described as a community member so i guess he's not back xd
Anyway I'm happy to see him again on this chan :)
I thought the same & was happy to see him back!!
I never left!
No, but seriously. I'm working on my own stuff but I love the fact that the Flutter team sometimes lets me pop in and give a talk or codelab. Best of both world, if you ask me. :)
@@filiphracek 💪❤️
Very nice and important way to give an overview about how to learn to programm and use flutter! Im totaly new by using flutter, and i have to say i understand the most things. Thanks!
Thank you, my English has improved a lot!
amazing presentation style; I'm enjoying watching and learning immensely!
Welcome back Filip, we really miss you 😍😍
Thank you, your videos are a pleasure to watch!
Great tutorial to begin my journey into Flutter/Dart development. Thank you for this!
Thank for sharing👍
i know html css js and c+ and I want to make apps so I am learning using this video thank you the the team that made flutter and filip
Thanks bro, we appreciate all the work you done and the way of explanation.
beautiful and insightful. It really covers the basics. I'd really like a tutorial that covers more advanced topics, for intermediate level. kudos to everyone on the team who made this video possible.
Hi. I finished the tutorial and wanted to go for the advanced version in the codelab. But when I clicked the link it brings me to DartPad but no advanced code. Any idea where can I find the advanced code?
i knew flutter, coz i watch filip.... nice to see you back
I've done my share of cross compiling, working with microcontrollers and RTOS embedded platforms... reminding me that flutter will also work with my linux desktop is really something that speeds up development.
It would, however be nice with a basic GUI designer like gtk, because even though flutter is quite straightforward to design by code, it feels like a lot of typing just for prototyping your layout, which can easily be automated.
With .Net/C# or Delphi/Pascal you can design your layout in minutes and then start assigning actions to your buttons/widgets... makes it easier to assign the design phase to an actual UX designer, and then take over or assign the programming afterwards.
Programmers are not necessarily good designers and vice versa.
Waiting for the speed run version now, Filip! ✌️
He’s back on channel! 🎉
Really Nice bro. Thank you for this amazing tutorial.
Thank you very much Felip really i appreciatethe the tutorial and it is the first time that i write a feedback on TH-cam 😍😍
I can't watch this and keep mute. I'm screaming a big thank you to DW for a great work.
watching this video was very enjoyable and informative, thank you Filip
Man, the statefull widget has been a nightmare to me...until this codelab! Thanks
We miss him on the Flutter team 🧑💻!!
Great video , having so much fun learning Flutters
Really enjoyed this. I came from native ios design.
Thanks for your sharing. There is the best training video.
Thank you very much Filip, very clear tutorial!, I appreciate your time and efforts to put this together.
Great Codelab! Hats off to Filip. Very smooth, very clear, very nice video.
Beautifully presented this video, Success isn’t overnight. It’s when everyday you get a little better than the day before. It all adds up,, work hard for your dream, have a great day, lk
Happy to be a part of Flutter community
First off - great tutorial and codelab. 👏
Found a bug in the codelab though - or atleast I think it's a bug. On the 9th step you link to a advanced version of the app but the link takes us to a dartdev page which doesn't include the app in question. Hope you will fix the link.
Thx.
This was really helpful guide for someone new with Flutter. Thank you!
EDIT: The advanced version link does not work, just links to a simple for loop!!
Great tutorial, thank you so much! Please do more! You are very entertaining and insightful, great teacher.
I failed at the custom favorites page and needed help because I never used .asLowerCase when "printing", which threw a error when I tried to "Text(pair)", because it said it cant be a string. I just assumed it would automatically utilize lower case format?
I am also trying to access the advanced version but it is not available.
Thank you so much for the overview!
It was fun to build, thanks!
Man this is a good tutorial. Props my guy!
I'd expect better video quality, he should be on a tiny window at one of the corners of the screen with high fidelity of the content clearly made visible, but kudos for putting out a lesson on the topic
What a fun walkthrough. Thanks Filip & Flutter Team
I followed the tutorial but i got bunch of errors... Im not 15:32 and on window...
Target of URI doesn't exist: 'package:english_words/english_words.dart'.
Try creating the file referenced by the URI, or try using a URI for a file that does exist.
Target of URI doesn't exist: 'package:provider/provider.dart'.
Try creating the file referenced by the URI, or try using a URI for a file that does exist.
The method 'ChangeNotifierProvider' isn't defined for the type 'MyApp'.
Try correcting the name to the name of an existing method, or defining a method named 'ChangeNotifierProvider'.
Undefined name 'WordPair'.
Try correcting the name to one that is defined, or defining the name.
The method 'watch' isn't defined for the type 'BuildContext'.
Try correcting the name to the name of an existing method, or defining a method named 'watch'.
'unnecessary_breaks' is not a recognized lint rule
try saving your pubspec.yaml file and also saving your analysis_option.yaml files. The main.dart file may not recognize the changes until you save those files
i had so much fun learning and doing this. thank you.
Thank you so much for this tutorial!!
From my perspective Flutter is an elegant way of doing things more complicated. Learn React.
Unfortunately the link to the advanced version is broken (just lands on a "hello world" script) - do you have an archived copy somewhere else?
Great tutorial by the way!
Edit: I found a copy on the Wayback Machine, but I'll leave this comment here in case you want to update the link.
Thanks for the comment, I was looking the same.
@@sg2_ Hey, thanks for the heads up! I've flagged it with our team. In the meantime, if anyone's looking for the advanced version: dartpad.dev/?id=e7076b40fb17a0fa899f9f7a154a02e8
@@KhanhFlutter Thanks i was looking for Same
@@KhanhFlutter saves the day!
32:39 : for windows right click and select refractor for which you'll get the extract options
Thank you!
Even with that I still missing the Extract Widget Option
Very good introductory lesson
Thank you for the video, great style and tutorial
That's a great video. Very easy to follow.
19:31 how was that gradient put in the video? it looks nice :)
I love how at 39:17 the background color of the video also "went blue", and the deep orange color of the button is actually the color of his shirt (noticeable at 52:12) 😂
I'm interested in making an app for Iphone and android phones. You say how important it is to know the target prior to installing anything. I couldn't watch this whole thing because it was painful to watch. ChatGPT suggested Flutter and Dart because it is easy to apply to many devices without the need to recode. Now I will have to dig more because what you said questions that.
Can anyone please mention: which OS(iOS/Android/WEB/DESKTOP) he has used as a TARGET DEVICE in his project?
in one place you have to say "notify listeners" and then "watch". is it sound or visual. small details but why google is missing such details. why it's not just "listen" instead of "watch". then you have clear understanding what's going on. BTW a grate tutorial
Anyone knows what screencast app he’’s using to overlay in transparency his screen with. Looks great and makes it interesting to watch as well.
Hi! I try to run the debug mode but the pop up screen is not showing why is that? It says the flutter SDK is not valid open settings? I changed its path still the error was gone, but still the selected edge browser is not popping up.
Nevermind I resolved it.. lol I chose the chrome browser instead of windows.. thank you
Welcome back Filip ♥️
Huge thank you for this tutorial!!!
Nicely explained. It helped. Thnx!
Filip you were right. Downloading, installing and environment setup is the hardest thing. I'm stuck and confused. Error after error.
Esse cara é Brasileiro, não tenho dúvidas
I hope to have more Chinese subtitles, which can help me learn more easily
This first app seemed to be more of a console app. I came in looking to go straight to mobile for android. Having used ionic with Angular, React and Vue I expected to get Flutter/Dart/Android with mobile controls and scripts. I guess I will have to start with a tutorial specific to my targeted platform.
This screencast is very cool. What app was used to achieve the zoom and transparency effects
Filip is back!
Has anybody found the code for the "advanced" version of the app, would love to check it out, but as others have mentioned the link now contains something else.
46:53 if you are not seeing the auto-formatting as shown in the video, go to settings > formatting and enable "Format On Save" option.
Thank you, man) I have been fun)
Hi, thanks for the codelabs!
Just a random question, I really like the font you use in the vscode editor, which one is it?
I feel like copy pasting it and not feel like learning.
Thank you! I experience it the exact same way, it's tutorial hell.
Chapters have been added to the video description if you want to skip around to specific sections of the Codelab!
Awesome tutorial as always
Filip is back! Yay! :)
Hey, das Video ist wirklich super. Nur komme ich bei min 38:13 nicht weiter. Bei mir ist einen Absatz zu machen leider nicht möglich. Evlt weis jmd wie man da vorgehen muss
Happy to see you again!
Thank you for this helpful course i very appreciate it, but the advanced version is not available
what a nice dude, i should say some stuff is a bit (tiny bit) different now to the video and even the doc but yeah i will try it and see if its a good option to add to my frontend skill ( which i hate what is wrong with the terminal? who needs gui?? let me be with my laravel and api and wrapper....)
I've been using Flutter for a while now, but I have not used State Management tools like Provider, Riverpod, etc. But I got confused with this project, by converting from StatelessWidget to StatefulWidget in order to use setState for the selected menu Icon to update its state. If we are using Provider in this project, why not using Provider(ChangeNotifierProvider with ChangeNotifier) to change the state of the selected menu icon?
I'm learning flutter for a University subject but we are using another version of Dart that's not compatible for this Codelab. 😢
I get error 403. That’s an error.
Your client does not have permission to get URL /codelabs/flutter-codelab-first from this server. That’s all we know. any idea how can solve it?
If anyone is having problems getting the Shortcut for Extract Widget in Windows. Put your Cursor on "Text", then CTRL + period.
Wow been struggling for hours with just running the default app and getting all sorts of errors and it couldnt run. I didnt know we always have to update the pubspec smh
For some reasons the app didn't work properly on my VS. Is there an Android Studio version of this example?