Material UI React Tutorial
HTML-код
- Опубликовано: 27 июл 2024
- This react material ui tutorial will cover all aspects of material ui and react to get you up and running to use them for your next website development project or application.
- Adrian's RUclips Channel:
/ @adriantwarog
- Design for Developers - Enhance UI:
A book that Adrian has created to help you improve the look of your apps and websites.
Enhance UI: www.enhanceui.com/
- Material UI:
material-ui.com/
- Timestamps:
0:00 - Intro
00:70 - What is material ui
01:36 - Material UI Create React App
03:33 - Material UI Button
12:24 - Material UI Checkbox
16:55 - Material UI Textfield
20:57 - Material UI makeStyles for Buttons
24:07 - Material UI Themes with ThemeProvider
27:23 - Material UI Typography
32:13 - Material UI Containers and Grids
36:57 - Material UI Responsive Design
39:23 - Material UI AppBar 
Наука
I've watched multiple tutorials on this and they've all been really difficult to follow but you did a phenomenal job here. Thank you so much. I finally feel like I have a basic understanding of MUI now.
What an amazing tutorial ! One of the first videos I have watched in which the explanation is so crystal clear. Learned tonnes of stuff. Keep up with the good content Adrian !
I really appreciate the fact, that we get a detailed guide like this for free, truly amazing. Thank you! :)
Crystal clear video and audio quality. While doing the crash course, he wasn't jumping all over the place. It was really smooth. He kept the same speed and did everything in a linear fashion. I feel like watching this video was able to get me ready-enough to watch project tutorials which features Material UI. Thanks for featuring it :)
Fast, Precise, and Easy to grasp. One of the best tutorials I've ever encountered.
This video answered all the questions I was having with Material UI! Thank you!
Really nice tutorial. Started learning React about a month ago. I have to say, material UI makes a lot of things sooo easy. For example, I spent a lot of time manually animating my inputs to look as sleek as MUI ones just to find out Material UI already includes them. Thank you for this tutorial ;)
Awesome to hear
Material UI is really awesome when you are starting to learn React. It helps
Wait till you pay for Pro 🚀
Excellent intro to Material UI, was easy to follow the steps. Also, excellent video editing, I like that code, results, and speaker camera all visible at the same time.
Struggling with my first project using Material, this was so helpful! Thanks!
Just in time. Exactly what I was looking for.
Awesome
same here !!
hello sir may I ask some thing to you?
Why r u spamming same comment everywhere 🙄🙄
It is great you are collaborating with other artists and give them chance to present themselves at your hub!
You're honestly a God. I'm taking a technical final for my interview and they suggested Material UI. and wow. such a time saver!
Excellent video! I appreciate the simplicity and the emphasis in the documentation :)
I always think that there should've good , small and precise materialUi tutorial on youtube. And this tutorial is the best and finest of all tutorials out there. Thanks Brad and Adrian 🔥
Perfect
This was excellent, exactly what I needed. STRAYT TO THA BLAADY POINT MAATE! Not long back from a year in 'Straya', had an amazing time! Much love from Scotland bro, Liked and subbed to your chanel!
Thank you, very much!
Perfect start to estimate and use material-ui!
I've really enjoyed this video thanks Brad and Adrian for this good piece of content!!
I have been waiting for this for so long.
Finally! Thanks Brad and Adrian!
Adrian is now rocking on RUclips 🔥
Brad you explore lots of great mentor's with great content.
Thank you.
Hahah thanks
Wow, this video was as clean and easy to use as one could hope. Fantastic job sir.
You can use the library styled-components and override the default components, works very well.
This is just amazing, the video was really helpful
This video was great! Definitely going to use Material UI a lot more.
truly you made me up and running with material very fast when i felt bootstrap is not enough for my app and the deadline was close:)thanks
Thanks a lot for this video. I would love to learn more about theme nesting!
Material UI is such a life saver. Thanks for the amazing tutorial!
Thank you! It is a good video to getting a common point of view on how to use Material UI and what is it.
More power to this channel, awesome & in time content
I was looking for a great video that was short and sweet so I could jump into playing around with mui and this was great! I liked being able to see how easy it makes mobile responsiveness! I have a lot of fun doing that myself but I like how it simplified the process if I ever wanted the shortcut. I'd like to see more to build a responsive app if you did more videos on mui.
Very nice tutorial. Super simple and to the point. keep it up.
My advice. Main things to learn or to keep in mind in any platform in any programming language any device.
How to:
1. input data
2. output data
detailed:
input: single value, multiple values, lists, checkboxes, buttons, images, videos
output: single value, multiple values, lists, checkboxes, buttons, images, videos
get some details of any single comonent and how to change it...
This was a great introduction to Material UI, thank you Adrian.
Just what i expected for react ui thanks so much
One of the best tutorials on RUclips. Many thanks.
Thank you for this. So much to learn in such a short video
I am 200% sure, I will require the advanced videos on the same. Damn, you made my life so simpler, Thanks, Brad & Adrian. A complete Udemy course will be perfect for sure :) I don't know why I never put more time to learn material, its so useful and Adrian made it easy... :) Awesome Content creators
Awesome
Great tutorial, Adrian! Thank you!
Fast, Loud, and Clear ! Perfecto ! It is auto subscribed haha..
Best tutorial for me in YT on React-MUI. Great !!!!!!
Really Great Video Adrian ! Many times I start learning about Material Design but Most tutorials confuse me From where I can start But after this I'm able to use this one in my project. Thank!
The way the react symbol rotates behind his head around 27:00 looks like kpop cat ears and I can't unsee it every time it rotates. Edit: Watched right to the end and when you asked if you should make more, yes. Your explanations are right to the point and give enough to get started while giving away just enough to make me want to look into certain things more. I also liked how you showed the header bar last. I came here looking for that one in particular and having it last made me watch the whole thing.
I'm glad I wasn't the only one who saw that🤣🤣🤣
was waiting for this thank you so much
Hhaha! am surprised Adrian suddenly showed up, I thought something was wrong? You rock Adrian! Thanks to Traversy Media! He rocks!
The best and only mui tutorial I will ever need. Thanks
One suggestion. It is more convenient to use another ToolBar component just below the AppBar, to get the appropriate marginTop. Manually setting the marginTop leads to many inconsistencies there.
Overall I learned few new things here. (Y) Thanks for this video!
Ayyye! Adrain is back on the channel!
Very useful and crisp video on Material UI + React.
Thank you! This is exactly what I needed in the app I am creating
Hahah cool
Great video mate!
just FYI instead of adding marginBottom to the AppBar you could just pass position='static' as a prop :)
Best intro for Material-UI!
Would like a few more videos on other components in MUI especially designing forms. Although it was overall pretty nicely done tutorial.
Damn this is going to make my portfolio apps look 10x better thank you so much!
Need more videos on this...Looks much clean and helpful
Adrian is back again!!! For the 3rd time! You look so good Adrian and you are awesome! Thanks for all of your tutorials and tips 😊
Adrian wrote this comment by himself)
@@user-md3cd3qb3v which comment???
@@MaxProgramming this one, btw just a joke)
@@user-md3cd3qb3v Nice koke 😂😂
I thought material ui is boring but your explanation made me reconsider it in my next project
Awesome!
this is great! I got inspired by you, got my MUI series in the process. Thanks!
What a timing. Was about to search this resource. Thanks!
same!!
Haan bhai, jo tum sochte ho wahi upload ho jata hai😂😂😂
I was about to begin my project using Bulma Framework, then this dropped..!
Highly Appreciate Your Hard Work, Knowledge and Efforts, Thanks to make this beautiful video. Thumbs Up :)
Wow , was lookin this for weeks thnx for providing man
Great!
The best tutorial I have seen so far.
Clean e fast! Thanks for the video :)
This was great. Please do more! thank you!
Definitely interested in more mui tuts!
This is sooo cooooooooooollll. I've never used this before!!
Please do make videos on Components.
I used semantic ui but material ui really looks cool. ^^ And thanks for the video.
So useful and only in 40 minutes, thank you so much, really appreciate it.
Thanks,
I'm waiting for the part 2 of this video,
Where we will create a full functional website 😀
Cool! Thanks for letting me know
Thanks! This is really helpful!
非常感谢，这是我看过最好的教程
10/10 highly recommended!
That's it. Thats all I wanted. You are a Legend. Thanks mate!
Just exactly what i am looking for. thanks very much
Definitely, I want more MUI tutorial from you.
helped me a lot in my new job, I'm a beginner thanks, a hello from Brazil
Great video! thanks for posting
It is the easiest and simplest explanation of the material
Thanks and Greetings 🇪🇬
Awesome video! Helped me a lot! I am just trying to up my game in React and here it comes! Thnx a lot Adrian and Brad. Love the channel
NO ONE CAN BEAT THIS CHANNEL EVER
Thanks a lot. I did a HUGE step in UI develoipment
Thanks for bringing brilliant content.
Awesome
Awesome man. Would love if you could add drawers to the next material UI video
Nice THANK U and Traversy media , where we learn so many things about your career
Amazing tutorial!!!
Material UI is being used more and more with React as compared to other UI libraries.
Excellent Video! Highly useful!
Thanks!
You guys must have been sent from up above! Can't thank you enough.
Thanks for such as good content!
Trying to watch significantly less and code, code, code a lot more so as to not remain in tutorial hell. I've decided to keep this channel, however. Quality content that feels up to date and relevant.
This is an amazing video! I have watched at all to have an overview of the library and now I know what I can do. Of course is an obligation to look at the oficial documentation as well. In adition, english is not my native language, but I could understand you perfectly withouth subtitles, in 1.25 speed! drinking mate since Argentina!!! thanks you very much!
Needed it. Thanks
Great tutorial, thank you!
Great tutorial I will say. Thank you so much
Thanks Brad you understand what web developer needs and update your channel with great content really love this channel
Great video. Enjoyed watching it.
wow thank you! now I can play with those to learn more
great. Yes more MUI tutorials please
Cool stuff on this channel
Thanks bro, So grateful.
I'm from Thailand.🇹🇭
Love the content!
Pls more of this 😢, material ui is awesome 😀