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

Поделиться
HTML-код
  • Опубликовано: 26 дек 2024

Комментарии • 768

  • @javascriptmastery
    @javascriptmastery  3 года назад +35

    JavaScript Mastery PRO launching soon! Be the first one to find out about it - javascriptmastery.eo.page 🔥

    • @nullvoid7543
      @nullvoid7543 2 года назад

      record part 2. This video has reached 5k likes.

    • @zee_designs
      @zee_designs 2 года назад

      it's 7k now

    • @justChuka
      @justChuka 2 года назад

      it says "Sorry, an unknown error has occurred. Please try again later."

    • @mahnazmohamadmoradi7770
      @mahnazmohamadmoradi7770 2 месяца назад

      ​@@zee_designs‏‪2:41‬‏ ‏‪2:44‬‏

  • @sarojthakur7161
    @sarojthakur7161 3 года назад +211

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

  • @concentrify8041
    @concentrify8041 3 года назад +102

    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!

    • @javascriptmastery
      @javascriptmastery  3 года назад +7

      Thank you!

    • @gillesashley9314
      @gillesashley9314 Год назад

      Yes it's like teaching how to fish and not fishing for them. I like tutorial that really teach how to use documentations.

  • @techandy42
    @techandy42 3 года назад +24

    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! :)

  • @larrye
    @larrye Год назад +2

    Thank you! This was a great video. I loved how you kept it short, simple and actually started the project FROM THE BEGINNING of creating a react app.

  • @GustavoScarpellini
    @GustavoScarpellini 3 года назад +18

    He did it again boys and girls. He did it again. Thank you so much!

  • @mrlamblambs5263
    @mrlamblambs5263 3 года назад +5

    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 :)

  • @shashankojha3452
    @shashankojha3452 3 года назад +12

    Yesterday I finished up the "Alan AI news reader " project and really wanted to learn about Material UI and this video got uploaded :D

  • @TheMainManNorthOfEquator
    @TheMainManNorthOfEquator 2 года назад +4

    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

  • @rezkin7946
    @rezkin7946 2 года назад +5

    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.

    • @javascriptmastery
      @javascriptmastery  2 года назад +1

      I love your comment! May I use it as a testimonial for my upcoming course platform? :)

    • @rezkin7946
      @rezkin7946 2 года назад

      @@javascriptmastery of course. I dont mind.

    • @javascriptmastery
      @javascriptmastery  2 года назад

      @@rezkin7946 could you please reach out to me to javascriptmastery00@gmail.com

  • @Kapthos
    @Kapthos 2 года назад +1

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

  • @marcosadriano05
    @marcosadriano05 3 года назад +5

    As a begginer, i'm learning a lot of all your videos. Thanks for share your knowledge, master!

  • @shaggy118
    @shaggy118 3 года назад +2

    I wrote to you 3 days ago and asked about material ui, and you add such video, i'm so happy

  • @maferangulo840
    @maferangulo840 Год назад +2

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

  • @radeonblue1816
    @radeonblue1816 3 года назад +3

    This is the first great Material UI tutorial where a tutor is trying to teach how to get freedom in material UI by helping us understand the documentation so that we can ourselves become the boss, unlike those thousands of youtubers who try to tell us that how great they are using material ui. Thank you sir for helping us learn.

    • @javascriptmastery
      @javascriptmastery  3 года назад

      That was the point, thanks! 😊

    • @javascriptmastery
      @javascriptmastery  2 года назад

      I love your comment! May I use it as a testimonial for my upcoming course platform? :)

    • @radeonblue1816
      @radeonblue1816 2 года назад

      @@javascriptmastery sure

    • @javascriptmastery
      @javascriptmastery  2 года назад

      @@radeonblue1816 awesome thanks, please reach out to me at javascriptmastery00@gmail.com

  • @grequchannel
    @grequchannel 3 года назад +2

    Wow! Exactly today I designed a todo app layout and wanted to start impelenting it in material-ui tomorrow. What a timing!

  • @AverageCho
    @AverageCho 3 года назад +7

    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!

    • @javascriptmastery
      @javascriptmastery  3 года назад

      That's amazing David, thanks!

    • @javascriptmastery
      @javascriptmastery  2 года назад +1

      I love your comment! May I use it as a testimonial for my upcoming course platform? :)

    • @AverageCho
      @AverageCho 2 года назад

      @@javascriptmastery yes, of course!

    • @javascriptmastery
      @javascriptmastery  2 года назад +1

      ​@@AverageCho I'm so glad to hear that! Would you please share your email with me so that I can reach you? :)

  • @siddharthupadhyay4246
    @siddharthupadhyay4246 Год назад +14

    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
    3. thus import {Typography} from '@mui/material' instead of import {Typography} from '@material-ui/core'
    4. @material-ui/icons is @mui/icons-material (and that means npm i @mui/icons-material)
    5. thus the correct import of PhotoCameraIcon is import {PhotoCameraIcon} from '@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.

    • @kephasmseteka3462
      @kephasmseteka3462 Год назад +1

      eish.....it makes this video hard to learn from

    • @ImranKhan-ft7ns
      @ImranKhan-ft7ns Год назад

      You have any idea how to use makeStyles with react18 now ?

    • @siddharthupadhyay4246
      @siddharthupadhyay4246 Год назад

      @@ImranKhan-ft7ns MUI has discontinued makeStyles so you can't use it now

    • @kabangadavid4986
      @kabangadavid4986 Месяц назад

      the useStyles, makeStyles work properly with the new version of mui. But you have to ensure the "makeStyles" has been properly imported.
      Instead of import makeStyles from '@mui/styles', simply add curly braces on makeStyles. So it becomes import { makeStyles } from '@mui/styles'. This way, it will run

  • @calmyourmind5617
    @calmyourmind5617 2 года назад +1

    A great teacher who teaches how to read..You are great man

  • @hamzaiftikhar4516
    @hamzaiftikhar4516 3 года назад +1

    The Best Material ui course on RUclips and I want more material ui lectures.

  • @benmarr5128
    @benmarr5128 3 года назад +3

    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!

  • @munandisichali605
    @munandisichali605 3 года назад

    This is the most needed video I have watched on youtube this year on my react UI feature

  • @ajaykumarreddy8841
    @ajaykumarreddy8841 3 года назад +2

    I was just surfing on the web today thinking about learning Material UI. You sure can read my mind!

  • @skullb0y356
    @skullb0y356 3 года назад

    I m Glad Someone is showing how to make whole project without copy pasting the source code which lot others do
    Thank For being Original

  • @thesecondsage
    @thesecondsage 3 года назад +7

    It's always a good day when you drop something new

  • @hikerdean2674
    @hikerdean2674 3 года назад +1

    I'm working on a small personal project with Material UI. This video is extremely informative and very easy to understand. Thanks!

  • @surij8376
    @surij8376 3 года назад +1

    I am so glad that I found this channel. Amazing! content!

  • @takiniteasel6044
    @takiniteasel6044 2 месяца назад

    Just found your channel and am really impressed with your tutorials. I noticed that this one is 3 year old and could use an update to how Material UI is installed now. Cheers

  • @mattoattacko
    @mattoattacko 3 года назад

    contacted taskade and they hooked me up, even one month later. Thanks guys!

  • @elissitdesign
    @elissitdesign Год назад

    One feature I would have liked to see is a full screen pop up of a selected image using MaterialUI.
    Fantastic tutorial; clear and concise!

  • @slmshady539
    @slmshady539 3 года назад +3

    Right on time ya man. My employers want me to write some cards tomorrow. You made my Sunday awesome.

    • @javascriptmastery
      @javascriptmastery  3 года назад

      Enjoy the rest of your Sunday!

    • @66_vaibhavvarunkar60
      @66_vaibhavvarunkar60 3 года назад

      Hey are you into web development ?

    • @slmshady539
      @slmshady539 3 года назад

      @@66_vaibhavvarunkar60 ha Bhai

    • @66_vaibhavvarunkar60
      @66_vaibhavvarunkar60 3 года назад

      @@slmshady539 where I mean in which company ?

    • @slmshady539
      @slmshady539 3 года назад

      @@66_vaibhavvarunkar60 Bangalore sorry can't name it. Working as Reactjs Redux developer

  • @procydev1372
    @procydev1372 3 года назад +6

    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.

  • @King-Gilamashur2758
    @King-Gilamashur2758 3 года назад +2

    Just finishing the MERN part 3 and I really wanted this to fully grasp all the ui stuff we did in that tutorial. Thanks a ton bro.

  • @Zachi98
    @Zachi98 2 года назад

    Im really not that kind of person who likes or comment. Im more like a quiet viewer, but this has to be the greatest Tutorial I ever saw. Thank you so, so much.

  • @raunakagarwal6077
    @raunakagarwal6077 3 года назад +2

    It was so awesome. Thanks a lot!

  • @dannyman2200
    @dannyman2200 3 года назад

    Just noticed this channel, two videos in and I'm liking it quite a lot, not too fast not too slow

  • @Codebybryce
    @Codebybryce 3 года назад +1

    Thanks for the video! I’m trying to crash-course my self into developing a web app from scratch. I found your video and this UI library to be very helpful

  • @codewithfarhad8594
    @codewithfarhad8594 3 года назад +3

    literally what I was looking for the other day. thank you ❤️

  • @karldtrumpeter
    @karldtrumpeter 3 года назад +2

    Thanks so much, most comprehensive and short tutorial which I could find online to get me going.

  • @CognitivePrimate
    @CognitivePrimate 3 года назад +3

    Wow, this was really really accessible to a noob like myself. Thank you so much for your detailed explanations. So many tutorials just breeze through things and forget we're here to actually learn them. I'm looking forward to more of these. Thanks!

  • @stanleyagwu4818
    @stanleyagwu4818 3 года назад +7

    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

  • @khandoor7228
    @khandoor7228 3 года назад +10

    My Favorite React UI library also!! Yeah Let's go in depth with it. Also Request a Next.js version!

  • @jq_dev
    @jq_dev 2 года назад

    You are the best in any web development tutorial for me man, keep up!

  • @pimpstay
    @pimpstay 2 года назад

    This is the best free software Ive seen. Respect.

  • @hassanahmed9525
    @hassanahmed9525 3 года назад +3

    I am the one who is in severe need of a material UI course. And here is your video. THANKYOUUUU. BTW I am your regular student

  • @davidtzirima9301
    @davidtzirima9301 3 года назад +2

    Thanks mate i have been waiting for this big time

  • @vinodsagar2412
    @vinodsagar2412 2 года назад

    WOW.... you are the best in the world for me.... thanks a lot for such a nice lecturer on MatUi... Kudos ...

  • @frankie_goestohollywood
    @frankie_goestohollywood 2 года назад

    Thank you 🙂One of my favorite RUclips channels.

  • @Arifhossain-fk3ub
    @Arifhossain-fk3ub 3 года назад +40

    Yes plz....make a vdo regarding complex MUI based..

  • @caolanfanning7261
    @caolanfanning7261 3 года назад +1

    This is so cool! I'm currently grinding to get my first job (self-thought) and this was super clean, clear and concise! Love it from Ireland bro.

  • @pratapgavali4786
    @pratapgavali4786 3 года назад +2

    Thank you for this video, Actually I just started your full stack MERN project series, and I was little bit confused about material UI but now I got clarity, thank you and your full stack series also incredible, Thank you 😊😊

  • @parikshitrawat8680
    @parikshitrawat8680 3 года назад +5

    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.

  • @psyferinc.3573
    @psyferinc.3573 2 года назад +1

    your super cool. i love how you made me realise that looking into things is neccesary and needed if i want to evolve. thank you.

  • @zayeedbs
    @zayeedbs 3 года назад +11

    The Like to Dislike ratio says that all! Very Nice tutorial!

  • @amrutkhot992
    @amrutkhot992 3 года назад +2

    You are Inspiration to me ... just because of your videos I started learning reactjs..! #GOAT....Waiting for your second video on this.....

  • @dinesh.p8642
    @dinesh.p8642 3 года назад

    Adrian, Thank you so much. You deserve millions.

  • @Z07-d
    @Z07-d 3 года назад +3

    By far my favourite channel to learn slightly above beginner level javascript. I appreciate you for taking your time to create these content. DON'T STOP!

  • @themarksmith
    @themarksmith 3 года назад +2

    I would love to see a part two! Excellent video, thanks!

  • @md.didarulislam1728
    @md.didarulislam1728 3 года назад

    This guy is our man...He is our hero !! He uses windows...he uses VS Code...he uploads tutorial in JS framework/library...yes we want more complex MUI design !!

  • @polycarpnalela6951
    @polycarpnalela6951 7 месяцев назад +1

    Thank you so much for this video. It has helped me get started with MUI

  • @ramvignesh7157
    @ramvignesh7157 2 года назад +1

    Thanks for the video..came from after watching the Authentication part in Social media mern web app 7hrs video...Thanks again Man for ur contribution in Tech

  • @shrunty
    @shrunty 3 года назад +1

    Grid layout for cards is at 43:45 for anyone looking for this

  • @abhaygupta894
    @abhaygupta894 3 года назад

    You are sooooo great...it's a blessing to come across this channel.. Gonna share this with all my friends.. that a lot man. Another video on material ui would be great on themes and all.

  • @strawhat1583
    @strawhat1583 3 года назад +2

    Full quality content. Thanks for this tutorial.

  • @panshak
    @panshak 3 года назад +1

    You're an amazing teacher. Thanks so much.

  • @TheJason118511
    @TheJason118511 2 года назад +2

    I liked how you changed the title to say 2022 even though this was made in the beginning of 2021

    • @javascriptmastery
      @javascriptmastery  2 года назад

      Yes, gotta do it for the SEO :)

    • @TheJason118511
      @TheJason118511 2 года назад

      @@javascriptmastery kinda greasy but i suppose you gotta do what you gotta do! could always just make an updated version so it's not as fake, but honestly i am nobody to tell you how to run your youtube channel

    • @javascriptmastery
      @javascriptmastery  2 года назад +2

      MUI v5 project coming soon :)

    • @HolliVids
      @HolliVids 2 года назад

      ​@@javascriptmastery Looking forward to it!

    • @DailyNevFacts
      @DailyNevFacts 2 года назад +2

      @@TheJason118511 I feel the same man. I have noticed this channel is churning 'the latest' tutorials out but when you come to learning it, dependencies are out of date and just one big head ache for a learner. Unsubbed because of that!

  • @MyNameIsSalo
    @MyNameIsSalo 3 года назад +1

    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.

  • @eajajulratan2004
    @eajajulratan2004 3 года назад +6

    oh man!
    You are a live saver!
    Love you a lot!❤️
    I was trying to learn material ui by myself!
    But i was stuck.

  • @angelokailath7342
    @angelokailath7342 3 года назад +1

    Awesome intro on material UI...thank you!!

  • @TC-gv9fs
    @TC-gv9fs 3 года назад +1

    Always enjoy your content!!

  • @kttalkZ
    @kttalkZ 2 года назад

    You have instantly gained a follow the moment you have deleted the src folder - cheers -good one

  • @eliasimokhai
    @eliasimokhai 3 года назад +1

    Those who dislike this great content are really something. with only this video I am good to go with material ui. thank you so much. And I have sure subscribe to your channel. thanks a lot

  • @Patinhow100
    @Patinhow100 3 года назад +1

    Thank you so much for the amount of free content and impeccable quality.

  • @ProWebb
    @ProWebb 3 года назад

    I can't believe this is free content, thanks a lot. I am studying react and I like your videos. Thank you so much!

  • @lucas.sgomide
    @lucas.sgomide 3 года назад

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

  • @pygemssoftware4254
    @pygemssoftware4254 3 года назад +2

    As I have said in 2 different accounts this guy is super talented sincere generous and gifted teacher.
    Pls keep on with material ui sockets mern memories extensions
    One of two best RUclips channels

  • @jr-hp7er
    @jr-hp7er 3 года назад

    Great Timing, I too had a request long back....Loved it..
    Part 2 - please....ooo my demands..But I m damn sure everyone loved watching it....much love sir

  • @fredcal
    @fredcal 3 года назад +2

    hey man, first of all, congrats on the channel, ive been learning a lot, thank you for that!
    Just want to point a new video sugestion, what about some in depth video about MongoDB and express? Those are really helpful tools, we could learn a lot more from you!
    Thanks!

  • @nikhilsourav2025
    @nikhilsourav2025 3 года назад +1

    One of the most awaited video. Thanks a lot ❤️

  • @PostMeridianLyf
    @PostMeridianLyf 2 года назад

    I made a second account to like + subscribe. No way i'll miss your videos now. Thanks so much!

  • @mymusicloversworld
    @mymusicloversworld 3 года назад +1

    Best tutorial I have seen so far.
    You explain so nicely.
    Thank you 🎉

  • @pravingamit3525
    @pravingamit3525 3 года назад +1

    This is my first tutorial of react and I loved it

  • @maskman4821
    @maskman4821 3 года назад +1

    This is an awesome tutorial, material-ui really makes ui good looking and easy. I will definitely give it a try, yeah please make advanced tutorial on material-ui, thank you so much !!!

  • @shabazuddin2854
    @shabazuddin2854 4 месяца назад

    Explained Very Well! You are a great TEACHER.

  • @Creepwood
    @Creepwood 2 года назад

    Wow! Realy nice tutorial. Thank you!
    And i definitely need the cool shotcuts that you used around 40:35.
    Awesome. You get a big like and an abbo :)

  • @itsMrRuky
    @itsMrRuky 3 года назад +1

    This was exactly what i needed. Thank You so much

  • @RachadoPT
    @RachadoPT 3 года назад +1

    Oh boy, the timing! I'm creating a website for a customer and I'm using Material UI for the first time on it! Hope it comes out well. This video will definitely help me with that! Thank you 🙏

  • @kevintran1611
    @kevintran1611 3 года назад

    I love Material UI and it's dynamic range in customization. A video on theming would be awesome!!!

  • @soltiscd
    @soltiscd 3 года назад +3

    Yes sir! Thank you as always!

  • @vedantmondkar9963
    @vedantmondkar9963 3 года назад +15

    Me in the search of video on a new topic of JS,
    JS mastery: I am here with my new video
    Thanks man

  • @pgallovich
    @pgallovich 3 года назад +1

    Thank you for creating this video. It inspired me to signup for your JavaScript Mastery course. I hope you create more videos on Material UI and React. I am working on some projects and this would be super helpful. I really appreciate your training.

  • @hoostysauce6039
    @hoostysauce6039 2 года назад

    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.

  • @shubhamkumarsingh
    @shubhamkumarsingh 3 года назад +1

    looking for the complex mui video🤩. Thanks a lot!

  • @BalaramGayen
    @BalaramGayen 3 года назад +2

    you are great sir. you deserve 1 million subscriber :)

  • @qcmira2024
    @qcmira2024 3 года назад

    Love your teaching style !

  • @mattmarkus4868
    @mattmarkus4868 3 года назад

    Yes- please do a video on more complex components with mui!

  • @yusufaltundal3482
    @yusufaltundal3482 Год назад

    Helpful content. Especially about difference between component and component api docs. I learned very much thank you.

  • @danielgoldin6107
    @danielgoldin6107 2 года назад

    lets go for the advanced material ui course!!

  • @abdelhamidbacha7335
    @abdelhamidbacha7335 3 года назад +2

    Whaat
    I was juste thinking i need a course to learn material ui
    First thing i find on youtube this video
    Thanks a loot

  • @pets_talk
    @pets_talk 3 года назад +6

    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?