Complete Flutter Web Course 2021 | Building a Flutter Web Dashboard
Vložit
- čas přidán 28. 07. 2024
- Invest in yourself! Use my link and check out the first chapter of any course for FREE! bit.ly/2SZHiOq
This complete flutter web course is part of my class on Skillshare that you can access FOR FREE if you sign up to Skillshare using this link 👉 skl.sh/3gNUqym
SKILLSHARE CLASS LINK 👉: skl.sh/3gNUqym
SOURCE CODE & ASSETS 👉: github.com/Santos-Enoque/flut...
0:00 Introduction
2:42 Sponsorship
3:47 Before you start
5:38 When to use flutter web
7:46 Responsive design
10:42 Flutter project structure
14:53 Gets overview
23:48 How to get help
25:24 Flutter web layout
27:30 Flutter custom themes
33:58 Building a flutter web site layout
40:22 Flutter web responsive widgets
52:15 Top navigation part one
01:02:06 Top navigation part two
01:09:51 Menu controller
01:22:13 Flutter web side menu
01:39:24 Local Navigator
1:49:23 Overview Cards
2:03:03 Overview Cards pt2
2:09:55 Adding Charts to the website
2:21:40 Flutter Datatables
2:30:45 Drivers & clients screen
2:33:46 Authentication page
2:41:10 url navigation with gets
2:54:40 Firebase authentication (BONUS)
CONTACT
Email ✉️ : santosenoque.ss@gmail.com
Twitter 👉 / santosenoque2
Linkedin 👉 / santos-enoque
This video is sponsored by DataCamp
This amount of knowledge for free is the reason why I'm always grateful to you guys. We all appreciate the efforts. Thank you.
I am glad to know that I helped
They deserve to be paid for giving such a wonderful course.
I love this tutorial. No unnecessary introductions of flutter as that can be found everywhere. Covers the most useful Web practices of Flutter
Thank you for your comment, and I am glad i could be of help in anyway
Your videos are the best on CZcams to learn Flutter and Dart. You take time to edit the videos, animate the characters, and it is a very unique experience to watch them. Audio quality is great. 5 stars! ⭐⭐⭐⭐⭐🤩
you are the best man, I wish you will upload more courses like this for different ideas. Thanks and all the best
I want to thank you for your slowly and clear speech, no need for subtitles for me
Awesome work!…many of Devs are relaxing after watching this.
Thanks you very much, I felt like I pair programmed the whole app with you.
You are a life savior, I have literally been looking for an updated video for weeks. Most of the content is so confusing and outdated.
I.m glad I was able to help you mate, thanks for watching
Thank you! I have been looking for something that is not outdated to learn flutter and I found it! :D
I am glad it helped
Hey man, I have been struggling with routing on web and your video has been a great help. Thank bruv, keep it up.
Santos can you do a video tutorial showing how to build a CRUD app using Flutter with Graphql/Hasura?
How is state management handled in Flutter when graphql is used?
Was about to drop flutter for web when I came across this, very grateful.
You're the kindest man in this world! Thank you for the tutorial! Big hug from Indonesia!
Parabens!! Realmente ótimo
Bro. This is the best! God bless you!
It's amazing!!! Thank's for this wonderful content.
Thank you so much Santos! your video was a very good introductory help for me. there was a couple of things that I had to fix regarding compatibility with dependencies for new versions. The use of the data_table_2 inside the ListView for the Overview page was a tricky one. the table must be wrapped in a SizedBox in order to fill a finite space, otherwise it will throw a rendering error because the table wants to fill an infinite space. Therefore, you must define a width and height for the Sized Box wrapping the data table widget.
I'm using :
data_table_2: ^2.5.0
flutter version: 3.10.0
Hello Santos, thanks a ton for such a wonderful tut. I followed the tutorial and did everything as in the video, but it seems I am missing something. The not found page doesn't seem to work for me.
At the same time, the page routing too isn’t working properly.
Parabens pelo video e obrigado ajudou bastante
Thank you very much. Still years after, there is no such content and tutorial available for Flutter Web. Great work.
It’s about time to upload a new version
@@SantosEnoque Yes, we need it.
great ! I'm looking forward to this video form u , thank u very much. 🤩
Thanks for watching
Hello, Santos.... Thanks for sharing your talent
thanks man ! love from Malaysia
Gracias Mister Santos un gran maestro, para un gran framework....saludos de los andes peruanos
Really you are professional, thanks for this
This worth more than udemy paid courses for web
love to have such tutors on youtube
keep it up
thankyou so much
wonderfull work
Thank you
Thanks so much for such video! I finally found something useful on the net!
However, I would like to suggest you to put more details for example on security aspect of the Flutter project e.g. CSRF tokens in forms or securly communicate to custom back-end.
Any way, thanks so much!
Exactly
thanks man, you're the best.
Amazing tutorial.
Santos how can I populate the Datatable with Firestore data? Using this same architecture in your code.
Thank you!
Thank you so much for your effort. Am wondering, why you chose to name the rouutes in uppercase letters in your tutorial and in the repository on your github a different solution in lowercase.
how would you approach OpenID Connect , OAuth 2.0 , JSON serialization & HTTP requests in Dart / Flutter?
Nice content here. I love it.
Congratz, man. Show !
Thank You!
Excellent video !
great stuff.
Thank you!
Please consider flutter with node tutorial.
Thank you for the suggestion! And thanks for watching
Hello, thank you for the great video. I have a question about navigation. I am trying to make a dashboard using getx, and I would like to display in the url the path of the menu I am in. For example when I click on the menu "drivers" that in the url is displayed "localhost/drivers". I tried "html.window.history.pushState(...)" to change the url and it works, but when I go back with the button on the browser I get errors, I can't go to the previous page. Could you please find a solution that would allow me to display the name of the menu in the url and to manage the back button of the browser ?
Muito bom os videos. extremamente competente.
Muito obrigado Messias
awesome
Your channel is heaven man.
Thank you very much
thank god for people like you
Thank you mate ♥️🔥🎯
That's an amazing video thanks, but there is a new techniques like custom widget that I didn't know I think focus on web would make the different because the other content is more focus to mobile keep it up.
Thank youuuuuuu!!! From Brazil! :)
VALEUUUU
Hey santos , I have been working on a portfolio and wanted to integrate firebase for some of its services, but I am facing some exceptions ! I will be helpful if you guide me .
Enoque como faço para usar o botão voltar do navegador em sincronia com as rotas navegadas?
How would you add titles/category name for those side menu items. Example SALES as the title then drivers as the item
Thanks for this content. There is just one thing I was left wondering, is there away to interact with files, both download them and upload them for the browser. Thanks!
Hey Santos, hope you are doing well, can u explain me bit of what is the hack you doing with Expanded(child: Container()), some places
Nice. Another content to add to watchlist
♥️🔥🔥🔥
@Рустам Мусабаев thanks
Thanks sir for this video, it's very usefull case :)
Glad it was helpful!
You from Bengaluru !! Really appreciate the course
Awesome, good job to you 👍🙏
Thank you 👍
What dependency do you use ( that tells what next steps is to be taken )
Hello great video. I don't get any any menu items on small screens. Is there any reason why "SmallScreen" is not in the GitHub project? Many thanks
What is the theme and fonr you are using in your vscode? Btw thaks for the awesome content!
congratulation. u have new subscriber
keep up sir, you re the best
Thank you
Much thanks to you !!! , only one thing changing the course when you change the gadget utilizing the menu is extremely required, I hung tight for that however it didn't come xD, I don't have the foggiest idea how to look for that in the event that you can if it's not too much trouble, interface me to an instructional exercise, or on the off chance that you understand what we call that? also, thank you once more.
Hello mate, first thanks for watching, I can maybe create. a video about that
nice tut, but how can i navigate to a new screen changing only view with side nave still there , in short how can i make the side nav persistence. thanks
THAAANKS A LOT
Thank you.💕💕
💋💋
Great tutorial learnt a lot of things watched whole video, write code myself by following you
1. One thing after log out click we go to AuthenticationPage but when we login again it is showing Overview page, but showing active item on logout on side bar
2. After clicking on sidemenu items it is not opening screen but not fast ,
Is flutter web performance is not good?
First of all....awesome work Santos thanks for that!
After implementing the navigation with gets I get the error "Duplicate GlobalKey detected in widget tree". Can't find the source of the error. Can anyone help :/
HI sir! glad to see your videos, thank you. Can you give me tutorial for connecting our website to firestore? i have problem with this sir, that i can't connect my project to firestore.
The one and only course youll ever need...
a few seconds later: you need to be familiar with flutter...
hahaha sorry for that
thanks guy
seems a good video to watch next weekend! :)
definetly
super super work
how to fix responsives with Null safty? I got some issue with it
How to auto update of numbers with change in firebase cloud store ,like ("rides in progress , packages delivered" numbers)
Hi Mr. Santos, what if I want to créate sub-menus?
good work
Bro can u come with course of implemeting Flights booking API flutter....I can t find anywhere
Sure, thanks for the suggestion
can I ask how to fix the auth,, if I logged in its fine,, then refresh back to authpage,,
I'm new to flutter firebase, and also how to add roles,, because some items of the menuItem is not for the other user??
Great Video btw it helps me understand the framework.
ไบโอมซากุระคือใหญ่เวอร์ คลุมทั้งเขา สวยมากๆ ด้วยอะ
Be blessed
hi sir please i try to define another interface after login page but i have error like Excepted a value of type 'NavigationController' but got one of type 'NavigationController'
nice video, please make more videos on flutter web apps :)
We will!
How do you get those inline error highlights and messages? Is that part of core vscode, the flutter extension, or another extension?
Hi Sir,
I was building the same type of dashboard. But while creating the data table using datatable2 package. i am facing some errors. In my project debug console is showing that datatable built. after that it is showing errors. can i have some clarity over this.........?
Thanks. Is the git repo available for the code?
Thanks
Thanks for watching
Thanks for such a beautiful Knowledge sharing ...
I downloaded code as zip file from github and tried to run in VSCode to see the end result before start coding ... did't work ... if i create new web project in VSCode and run default code .. it works perfectly in Chrome Browser ... any idea/hint will be highly appreciated ... Thanks again
How does this compare to react ?
Can you please explain that why flutter web loading slow for first time and can I use to build my web in flutter because that are not SEO available guidelines ... Please explain that
what is the name of your theme on visual studio code
what is vs code theme do you use
Hello, Thank you for this video.
Could you please describe how to change the route name(in the URL) for each widget inside the site layout?
Hello, did you find the solution please ?
@@raogoyougbare8986 you did?
@@fatercio did u?
got an error saying Duplicate Global key when using Navgator, could you please help me?
I cant get the menu item to work, cant click on them. Anyone solve this? im using flutter 3.0.5 ? thanks
what's the vscode theme you're used?
Sir Please guide for dropshiping & affiliate marketing flutter ecommerce app 🙏
at 46:36 is the size between small and medium not cover?
I have tried many Flutter tutorials but most are slow explaining minute things or super fast just talk while typing and move on. This is one of the course where concepts are explained and then code is written later. Wonderful approach sir.
Thank you so much for the good lecture. May I ask for a lecture on how you did it when you deployed the flutter web?
sure
When selecting right screen you use ?? in case the widget is null. But ?? does not work because widget cannot be null. Is this a change in Flutter today?
why u are so good i love u
Thank you
kindly make another this type of tutorials.... make proper web base responsive projects......
Can u do a video about localNavigator and route tht u used in this course
Hey mate thanks for the suggestion
I can't get the google fonts to work. I am getting a dependency error with path_provider ^2.0.0. When I change the path provider to accommodate it leads to many dependency issues. Anyone have a solve for this?
I like your videos very much. How did you create your virtual character in the video?
Thanks, I used adobe character animator
Hello, @Santos Enoque. Very nice tutorial. But I am having some "graphic" problems. When i change between the items in the sidemenu I get a bad transition with som greyish blinking. What could that be? It is when I have maxsize.
did u fix it ?