Learn Material UI in One Hour - React Material UI Project Tutorial [2022]

Are you new to Material UI? Have you heard about it but never actually tried it out? Maybe you dived into it but it felt overwhelming? It's easy to learn if you know where to start! This video will help you to get started quickly, welcome to a one-hour Material UI Crash Course.

✅ A special YOUTUBE discount code is automatically applied!

📚 Materials/References:

🌎 Find Me Here:

[sarojthakur]

I'm one of those guys who requested material-ui. thanks a lot, you really care about your subscriber desire.

[techandy]

Hello Sir, I just want to thank you for all of your amazing videos. I went from a high school kid who knows a bit of Javascript and Python to a U of Waterloo CS Student with Full-Stack web dev experience through your videos. All of your videos are spot-on and well-organized, and I have learned tremendously through them. I hope I can meet you in the future and buy you a drink! :)

[concentrify]

I liked how you show us how to explore and read the documentations and apply that stuffs to your source code. This is very vital activity that every programmer should know. I appreciate what you did. Keep it up!

[mrlamblambs]

At this point, I'm just marathoning your entire catalog and making personalized adjustments here or there. Hands down the greatest guided tutorials I've come across, and you aren't even asking any money! Easy subscribe and like to every video :)

[procydev]

You're so freakin amazing and I can't wait to see that sub count keep rising. Keep up the amazing tutorials! You really carry yourself well and the format of your lessons, while fast, make it easy to follow along.

[benmarr]

Turoials like this are always so hit and miss but you explained this really well and I think everyone appreciates how you explain where things are in the documentation and how to utilise it. Thanks a lot!

[parikshitrawat]

This kind of documentation walkthrough is very helpful. I don't see it very often on other channels. You should do it for other libraries and frameworks also(if you haven't already in your older videos), great stuff.

[TheMainManNorthOfEquator]

What an absolutely amazing tutorial i am noob on react and this has blown my mind love it, you reduced the learning curve for me by a magnitude of 20. Thanks so much and keep smashing in your videos

[MyNameIsSalo]

this helps a lot. I watched the full 3 part series going over full stack web development and it was extremely helpful for learning how to setup the website but material UI was glossed over so fast in that video, especially the JS CSS stuff which was copy pasted. Helps a lot seeing that explored further.

[siddharthupadhyay]

Great video JSMastery, however a few things have changed from 2022 that I must bring to the notice of new viewers so that they don't struggle as much.
So at the time of writing (Feb 2023) the brand name is changed from "material-ui" to "mui" in V5
1. as a result of the change of name of the hook, the import shown in the video doesn't work, the new import statement is shown on the homepage of mui site.
2. @material-ui/core doesn't work, now it is @mui/material
4. @material-ui/icons is @mui/icons-material (and that means npm i @mui/icons-material)

6. they have dropped the support for mui/material/styles (imported as material-ui/core/styles in the video) and moved useStyles, makeStyles to @mui/styles however that doesn't work either.

[pets_talk]

Great tutorial, it was so easy to follow you and I`ve learnt a lot! Definitely would like to see the part 2! Is it already available?

[AverageCho]

You are a great teacher. I really appreciate your balance of simple explanations with enough depth and references to documentation for deeper understanding. I have "used" material-ui a couple times before from other tutorial vids but this is the first time I have truly learned and appreciate its beauty and it's all thanks to you! Really appreciated and subscribed for life!

[maferangulo]

Keep it up! The clearest description Ive ever seen in a tutorial, thank you so much :)

[Chipmunk-wkut]

Thank you so much. I wanted to learn the past version with a new version coming out this time. It has helped a lot and has been well applied to the current project.

[hoostysauce]

Thank you! I really enjoyed the clear step by step process. Your video helped quickly grasp the basic organization of Material UI and how all the parts fit together.

[stanleyagwu]

Thanks a lot for quality and timely content as always. Waiting for part 2. This channel is still underrated, but I know soon it's gonna be up there. Thanks

[Kapthos]

One of the best tutorials i've seen so far. First video that I see on this channel, and it is already subscribed!

[SuperMuzaffar]

For those whose styling is not working, makeStyles is deprecated in the latest version. Please use this code instead:

- First, import the useTheme() hook and assign it to a variable named theme. Then, create an object with properties as shown in video, and finally, apply it to the Material Component using sx={ }.

ex:
- const theme = useTheme();
- const container = {
backgroundColor: theme.palette.background.paper,
padding: theme.spacing(8, 0, 6),
}
- <Container maxWidth='sm' sx={container}>

[kukinhabh]

This is one of the best tutorial videos i've ever watched, thank you for doing this, great job !

[rezkin]

This is great. I also love how you go into detail of where to look and how to look through the documentation. That's something that most teachers don't do but I think its important to do so.