React Admin Panel Tutorial | React Admin Dashboard Template Design
HTML-код
- Опубликовано: 31 май 2024
- React admin dashboard from scratch for beginners. React Admin Panel UI.
Get Hostinger Discount: hostinger.com/lamadev Coupon Code: LAMADEV
If it is valuable to you, you can support Lama Dev.
Join: / @lamadev
Buy me a coffee: www.buymeacoffee.com/lamadev
Source Code: github.com/safak/youtube2022/...
Learn creative CSS animations: lama.dev/learn-css-animation
Learn SVG and SVG animations: lama.dev/learn-svg
Join Lama Dev groups
Facebook: / lamadev
Instagram: / lamawebdev
Discord: / discord
0:00 Introduction
01:50 Installation
11:00 React Router Dom 6 Tutorial
18:10 React Sidebar Design (Menu Bar)
34:41 React Navbar Design Tutorial
46:35 React Reusable Widget Components
01:04:30 React Progress Bar Component
01:16:17 React Chart Tutorial
01:24:10 React MUI Table Tutorial
01:34:43 React MUI Datatable Tutorial
01:54:58 React Single Item Page Design
02:10:23 React Form Page Design
02:31:15 How to Use React Router Dom Links
02:36:57 React Dark Mode with Context API
03:00:37 How to Deploy React App to a Hosting
03:03:46 Outro - Наука
There the genius goes again.
Lama, you are undoubtedly the best webdev tutor so far in my own judgement. You have really touched/changed lifes with your priceless tutorials.
I say much appreciation and keep it up.💪✌️.
👏👏
he only does css, i thought he is going to do a lot of things but nah
this was badly needed most of the interviewers ask ques. on these. 😭
Really, like what kinda questions? Plz dont be afraid to go long
@@stephonking2847, not actual questions but they'll ask you to code one of these with react-router then about its implementation. If not the whole application then a section of it, however again dashboards are not the only ques. you will get it might differ from C2C.
@digambernegi2023 thanks
Fantastic! Looking forward to part 2 for connecting to a DB and making it dynamic! Subscribed
Incredible project 💕
I really believe that lately there are no more limitations in learning, even without spending "direct costs" there are many great people who distribute their knowledge globally, and Lamadev is the best of them all, I can guarantee my words!
LOVE FROM INDONESIAN !
Best admin dashboard design so far. Cant wait future projects on that
Thank you so much for creating such a nice 3 hours-long tutorial video. Your explanation is very clear and recording is easy to follow. I will try to go through all of the other videos of yours.
I really wish i found you out a while back before I completed my degree. Great work !
One of the best tutorials of React I found so far!
Any chance of you showing us how to make it responsive?
Lama dev, you explain everything in detail and not like others who just type stuff without explaining it. Thank you sir ❤️.
Hi Lama. I am very thankful to you for making such a clear and easy to understand lesson. Your style of teaching and speed are very easy to understand. Keep up the good work.
Very nice tutorial. Sometings maybe improve:
1-) We added all pages Navbar & Sidebar. Maybe you can create Layouts folder and create layout & import components.
2-) You added h1 tag & resize it. But you can use just h3 element
3-) Add New btn routes same page (users/new). You can change Datatable to="new"
Very good tutorial. I really like it.
Many thanks
amazing man i love how you can deal with design part easily. I learnt a lot from u
Everything is included, the best tutorial I have ever seen. Thanks a lot
Best Tutorial I saw to dashboard react on youtube. Congrats!
I rarely comment on vids but this one deserved it. He took time to explain things. Shown effect after putting each line rather than coping a bunch of codes and saying here, used this pile to do this.
Completely worth the time and effort. Only thing I didn't understood was last 2min of tutorial on how he selected website name, but it doesn't matter.
ANYONE READING THIS, GO FOR THIS TUTORIAL IF U WANT TO LEAN BASICS PROPERLY.
Always quality projects on this channel. Keep it going man 🔥🔥👏
Hey man, this is just amazing. Thank you for this content, i've learned so much. Please keep up the good work
This was very helpful, will watch the new one. Given that we installed Material UI I saved myself some time by using other components like badges, text input, avatar, buttons and paper instead of creating them from scratch.. Thank you very much!
Lama Dev never disappoint. You are a great asset to the Dev World 👍.
Give him a thumbs up if you think he is..
good
good
thank you once again!! im really looking forward to the next part for this video, lets finish this thing out!!! i would be so excited!!! lol
Thanks so much Lama dev. You made me got a job with your priceless tutorials
Love it that Lama Dev explained in the video. 👍
Thank you Lama, we can't thank you enough for your great work.
Each and every video of yours is effin dope 🔥🔥🔥.
Yay ! I have just finished this react dashboard finally,
I am going to learn another tutorial also.
how amazing ! Thank you very much, :)
Thank lama dev, exactly on time.. I like the css shadow generator the most in whole project haha.
Thank you for such a fantastic tutorial !. It is so helpful and the way you present it is fantastic. May God Bless you!
Thank you very much for explaining every thing in details (Awesome & Valuable Content).
Awesome Video! Can't wait for the next video integrating with the backend 😄
Just came back here to say that this video helped me get an entry level programming job.
Thank you so much for your hard work. God bless.
👆Send a direct message for help 🆙 ⬆️…
What other projects have you built? What were the questions?
Thank God finally you are here with this amazing tutorial....
I am learning about angular on my internship but men I still love react, Thankyou for this gem ❤ .
Excellent tutorial! Helped me a lot! Thanks
Many Thanks Lama, Like your tutorials, You are a light
U r awesome. Thanks. First I thought this is sound of Ninja Shaun but you are just like him.
It took a while but I finally made it! Thank you for sharing the knowledge
3hrs of pain
Is it mobile responsive?
@@ekramhosen8358 no bro
lama is a national treasure. Protect him at all cost.
OMG! Thank you very much. Now I have a better understanding of web designing. Honestly my cascading stylesheet skills are very poor but thanks to you man.
holy moly, you are a true hero bro! keep it up, didn't knew your channel but now i've something to maraton! +1 sub!
Much much thank you, i found that your tutorial is easy to follow. and i already made an admin panel for my homework, following your tutorial... thaaanks
A very good tutorial for a beginner.. Im new to React and easy to understand. exactly what we need to learn.. kudos to you sir.
Great work! The dashboard is awesome.
This tutorial is amazing. Learned a lot. Thank you. ReactJS is awesome :)
Thank you very much for your lesson. It is so directly clear to my programming upgrade.
Amazing video! Thanks! It was helpful for me!
Lama dev thank you for your lessons. You are the best.
Great Video! Thank you lama, it would be nice also if there is a backend implementation using this frontend react design admin dashboard.
Thank you so much for making this tutorial!
Lama you just make me what i want to do Thanks a lot man
Thank you so muchhhhhhhhhhhh! I did my fyp using your tutorial!
Thanks Lamadev for another amazing tutrorial
Thank you safak. Nice tutorial
Thank you so much Lama for this video ❤️❤️
So I was checking your channel suddenly I couldn't see your profile pic I got upsad so much but then I refreshed and it came back, I thanked God , you became like my family member lol 🤣😂long live our king lama 💖
awesome tutorial. THANK YOU!!
Wow fabulous Lama Sir... You are really a boon for us.. God bless you with all ur wishes fullfiled..
Thanks for everything you are doing for us
Hi Lama, what do you think, is it better if we put the Navbar and Sidebar Component wrapped in the Layout Component, then place them before the "Routes" Component App.js? That way, we don't have to redial the Sidebar and Navbar Component in our "pages" component?
Thank you i always watch your tutorial it really helps me a lot in learning react.
i hope you do a tutorial for react + firebase and react native + firebase
Thank you so much. You are amazing. Every time, I realize how interesting and encouraging programming is.
Hope you will come up soon with the continuation of this system. I am waiting for the backend tutorial for this.
Lama is back...
With a banger..
Omg this is crazy good video, hope part 2
I love how all the main characters from Game of Thrones just showed up in the process of using the data table 😂
Thanks for this wonderful tutorial
i actually used redux persist methods for the dark mode on/off.
since it looked really similar to context api.
Really sad you can only give 1 like. Awesome! Great thank you for such a useful content!
i love this channel . plz be regular
Great, actually building something like this I think I will implement some of ur functionalities 📝
successfully made the front end page , thx a lot.
I'm waiting for part 2 :) I learned a lot here😇
one of the best channel for programmers
this tutorial is powerful, thank you
This is awesome thank you for the video i really appreciate
Thanks you, learn a lots from your videos.
Very good tutorial, subscribed.
Many many THANKS Lama Dev❤
Thankyou! Waiting for backend part
I see different approach for a routing between devs. For example you can add:
And then a Header component:
return (
);
This tutorial is Incredible
Thank you Lama! This is great! But It would be nice if you can make it responsive.
Do that as a homework
Thankyou so much for this video!
It was very useful for me, thanks.👍
happy to find this channel
Thank for your work, you're hero sir
Thank you for nice tutorial.
Many many thanks 😊. Love you from Bangladesh.
Thank you for perfect tut
Nice now to transpose it to SolidJS, thank you.
Amazing video! Thanks
Thank you so much for sharing.
Thank you very much I appreciate it
thank you Lama, im really learning a lot. could you please video on unit testing(jest)
maaan!! you r the best! thank you so much!
Super! Thank You Safak!
Great admin dashboard, thanks friend!
Lama dev, thank you very much for the tutorial. I always waiting for your next tutorial especially about react js and next js. For the next, please make the tutorial how to use sql or mysql with react js..🙏🙏👍
As usual, waiting for more
the ResponsiveContainer is broken :( 1:19:00 , the problem is when the first load is look fine you can also increase the size of the window but when it comes to decrease the size it wont it gonna stay where we leave as we increase.. so it will make u scroll to the right to see full size the chart , do u have any reference over recharts ? which one is the easiest between react-vis, nivo and react-chart?
Fantastic!!! Thanks!
Successfully done with this project. Really a great Journey in completing this dashboard learnt SCSS, CONTEXTAPI, React Stuff, charts.js.
So much to learn simplified easily through this project.
Thanks lamadev 🧡🧡🧡
Done with
1. NETFLIX UI ✅
2.Admin Dashboard ✅
3.React Website Loading....
Did you encounter any errors during this tutorial?
@@khosroyavari8914 no mostly it went fine. Let me know if you are facing any