React Booking | Reservation App UI Design for Beginners

Поділитися
Вставка
  • Опубліковано 23 гру 2024

КОМЕНТАРІ • 551

  • @mahdimiad
    @mahdimiad 2 роки тому +6

    I got surprised from your full stack of dashboard project and now you are doing another one, that is ready great.
    If you apply to a job just send them these 4 videos and you they will hire you for sure.
    Thank you

  • @adventurer2395
    @adventurer2395 2 роки тому +23

    Dear lama, your project ideas, teaching, and front end skills are incredible. You seem like a front end dev at heart. I think you really shine when you do React and Firebase/Firestore projects. I know people keep asking you for MERN, but from an engineering perspective it’s not your strength and it’s just too much time to build with SOLID principles and no spaghetti code, so the controller ends up basically doing everything. So I think React/Firebase would be a good area to specialize.

  • @kiddhkane
    @kiddhkane Рік тому +2

    Thank you so much for giving a detailed tour around the finished app in the beginning. I can't count how many times I wasted my time watching half of some other course, just to see it's not what I really wanted.

  • @abubakarsiddiquekawser938
    @abubakarsiddiquekawser938 2 роки тому +33

    0:00 Introduction
    01:11 Installation
    06:45 Navbar Design
    11:30 Header Design
    18:25 React Advanced Search Bar Design with a Calendar
    42:28 Homepage Lists
    56:50 Email List Component
    01:00:43 React Footer Design
    01:04:04 Search Result List Page
    01:30:10 Hotel Page Design
    01:42:30 React Slider Without any Library
    01:53:38 Outro

  • @pranavyeole102
    @pranavyeole102 2 роки тому +5

    I don't have much money now but when I get it I'll donate to show appreciation to your work, I promise.

  • @caracaxa1
    @caracaxa1 2 роки тому +53

    Hello Lama, as always your content is far the best ones we can find on internet.
    For the backend I would like to see it using node js, firebase. But implementing the safest method to store logged in users on the browser and protecting the API routes.
    Thank you

    • @theoatchole3068
      @theoatchole3068 2 роки тому

      you can watch the jwt token tutorial he made he explained to persist the users who logged in without store them in the localstorage on the browser wich is a lack of security

  • @johnwayne7726
    @johnwayne7726 2 роки тому +1

    Neredeyse kanalındaki tüm videoları izleyip aynı anda uyguladım, sayende çok şey öğrendim. Her şeyi sade ve kafa karıştırmadan yapıyorsun umarım bu şekilde içeriklerine devam edersin, sayende meslek sahibi olacağım neredeyse :D

  • @xcrxwadda8287
    @xcrxwadda8287 2 роки тому +17

    Keep up the good work Lama😊... Backend.. express,node, Mongodb

    • @aarnasinghal5057
      @aarnasinghal5057 8 місяців тому

      Thank you so much for the easy explanation!!

  • @fernandoaung6426
    @fernandoaung6426 2 роки тому +1

    I'm a big fan of Lama Dev. Your tutorial is really helpful for me.Thank you guy!

  • @adebisisheriff159
    @adebisisheriff159 2 роки тому

    Lama dev!!!!!!!! You are a great teacher indeed. I do not regret knowing you. Always look forward to your videos. Cheers

    • @cchelseacxx
      @cchelseacxx 2 роки тому

      👆Send a direct message for help 🆙 ⬆️..

  • @studyhere20
    @studyhere20 2 роки тому +1

    seriously and honestly, you are a master in teaching web developments. Thank u Lama

  • @juliusholbert6598
    @juliusholbert6598 2 роки тому +6

    This is an awesome project I look forward to completeing after doing some of your other projects! thank you for everything you do! Lama would love to see Amazon servies used on the backend in the future

  • @mohamedboularas6480
    @mohamedboularas6480 2 роки тому +7

    its amazing project thank you, for back it's more important to finish that with MERN Stack logic so with Node express and mongo DB, it's gonna be full project, thank you so much Mr lama 🙏

  • @mikrobe
    @mikrobe 2 роки тому +9

    Hi Safak, thank you once again for your amazing tutorials. You have covered a lot of technologies so far and, if it is not out of your scope, I would be glad to see a backend built with NestJs and Cassandra

  • @ousmanevincentdione9369
    @ousmanevincentdione9369 2 роки тому +1

    We like your amazing content !! If I like React today it's thanks to you !! I wish you good health.

  • @ngasa1257
    @ngasa1257 2 роки тому +1

    36:20 I think the handleOption() function return statement is follow the comma operator semantic, it copy the previous options state with (...prev) and change it options state from left to the right
    //Comma operator semantic
    let x = 1;
    x = (x++, x);
    console.log(x);
    // expected output: 2
    x = (2, 3);
    console.log(x);
    // expected output: 3

  • @Ali-ei3mg
    @Ali-ei3mg Рік тому

    Thanks @LamaDev for great react + css tutorial
    I'm learning webdevelopment almost from 5 months never seen good css tutorial with react

  • @OnlyJavascript
    @OnlyJavascript 2 роки тому

    man...this is the real REACT love. A classy one.

  • @siddharthjain4687
    @siddharthjain4687 2 роки тому +2

    Really great! Thank you . Only thing which is missing over here is Responsiveness.

  • @johnedet4551
    @johnedet4551 2 роки тому +3

    Mern Stack all the way sir... your content are always awesome... Thank you for all you do

  • @aditya__exe
    @aditya__exe Рік тому +4

    Hey lama, it was a great tutorial, just a small advice, I think position "fixed" will work better than position "sticky" in the slider

  • @bulent1824
    @bulent1824 2 роки тому +1

    Your lessons are the best. Also looking forward to see your next tutorial.

  • @DarbazDara
    @DarbazDara 2 роки тому

    Sub and notification for the first time see a channel who really deserve that... really good teaching skills and great examples.... Thank you!

  • @mulualemmhretu
    @mulualemmhretu Рік тому

    Dear Lama, You are such an enthusiastic developer and teacher who teaches us by creating an excellent tutorial free on UA-cam . Thank you again. You are so talented and kind to share your knowledge. May God bless you. I wonder why some people wouldn't subscribe and just watch your tutorial. Maybe in your tutorial, I didn't listen you said subscribe and like. it shows you have full of confidence!. and you have !.. If that is the case I recommend you to say ' subscribe' and 'like' while teaching. I would like to see your channel reach 500K Subscribers by the end of 2023.

  • @333PerezJuan
    @333PerezJuan 2 роки тому +2

    Nice job, excellent video, you're a master!! thank you for sharing this.

  • @adnanali-zm9rv
    @adnanali-zm9rv 2 роки тому

    Thanks for this masterpiece, just completed front end work and learned a lot from you, now moving towards backend.

  • @olegvoskovets4309
    @olegvoskovets4309 2 роки тому

    Дякую за викладання матеріалу. Приємно Вас чути

  • @BulBulAhmed-cu3eu
    @BulBulAhmed-cu3eu 2 роки тому

    Dear lama, You are really a good at teaching. I love your content. Love from Bangladesh.

  • @hariswaesamah6648
    @hariswaesamah6648 2 роки тому +1

    Another amazing project from lama, you really help me alot about design and for the fisrt time i have no idea how to design how to use snippet css and how to make such a beautiful UI and you inspire me a lot i will always support your chanel.

  • @devsCafe1980
    @devsCafe1980 2 роки тому +2

    Firebase is a goo option for backend as well with implementing Redux, Thanks Lama👌

  • @ornefacciola
    @ornefacciola 2 роки тому

    Incredible video! I've just finished it, I had only got stuck one time because i had to install zsh terminal, other than that, everything works perfect. Thank you for your patience, for explaining so well and calmly.

    • @cchelseacxx
      @cchelseacxx 2 роки тому

      👆Send a direct message for help 🆙 ⬆️..

  • @olaokunade677
    @olaokunade677 2 роки тому +1

    Thank you for this lama dev

  • @TasniMarwane
    @TasniMarwane Рік тому

    I'm really happy to follow this tutorial with you, I'm learning a lot of things. thank you very much lama.

  • @peterpardo4138
    @peterpardo4138 2 роки тому

    Hey Lama, I just want to thank you for this video! :) It really helped me develop my skills. Thank you so much and I genuinely appreciate your effort.

  • @pranavyeole102
    @pranavyeole102 2 роки тому

    Wow this was awesome! Just finished watching this!

  • @bozhidardenev8903
    @bozhidardenev8903 2 роки тому +2

    Hello Lama, thank you for the great content. It will be amazing to see the implementation of this project with NEXT js.

  • @financialFreedom662
    @financialFreedom662 2 роки тому +2

    please also extend this project with dash boards (users, hotelers, web admins) with Nest, node or next along with a react natvie app. this way the project will be a whole driving the students from end to end,. much apreciated your efforts, your teaching method is just awosome and easy to follow. stay blessed

  • @sunithat6771
    @sunithat6771 2 роки тому

    nodejs, expressjs , mongodb as backend thank you so much for all your work

  • @holicneko1668
    @holicneko1668 2 роки тому +1

    35:29 why we need square brackets for name. i think we can access Object Properties by syntax: object['property'] . But operation[name] is property[object] right?

  • @lameckotieno5837
    @lameckotieno5837 2 роки тому

    Design was my issue but tried other libraries they seemed hard then i followed your advice on plain CSS in the other video its been helpfull thank you for using it here you are teaching us real world application of css

  • @souravraj
    @souravraj Рік тому

    This was such a nice video. I learned so much. Keep up the fantastic work!

  • @screyesg
    @screyesg 2 роки тому

    Thanks from Chile! Awesome tutorial!

  • @fizamunir7692
    @fizamunir7692 2 роки тому

    Thank You Lama from the core of my HEART.. Stay blessed💞

  • @tanyadixit8257
    @tanyadixit8257 2 роки тому +3

    Your tutorials are really amazing! I got to learn more about react in these 2 hours video than a udemy course taught me with 8 hours of content!!! Really amazing

  • @quickguidesbynatanoob9867
    @quickguidesbynatanoob9867 2 роки тому

    Hi Lama, hoping to see the backend of this project soon. More power!

  • @SOMEONE-jg6jg
    @SOMEONE-jg6jg 2 роки тому +4

    keep up the awesome work. Let's use graphql instead of REST for this project.

  • @macedit
    @macedit 2 роки тому

    Hi from Turkey. Thanks for UI Desing and waiting for backand 👏

  • @andrewaghoghovwia1948
    @andrewaghoghovwia1948 2 роки тому +3

    Thanks for sharing.. I'd love to see a backend using cloud services.. AWS would be nice!

  • @monzurulislambaf
    @monzurulislambaf Рік тому

    Excellent tutorial . I love it. Thanks Lama dev .

  • @taiseen-cse
    @taiseen-cse 2 роки тому

    at 1:28:57
    "if you can not design a nice website, nobody care, what you cant do with react because you are a react developer, it means you are a frontend developer, doesn't matter if you are a full-stack developer or not, it's really important guys, don't understatement the design part, it's really important..."
    Your this speech is so much valuable for us as a beginner... ♥♥♥

  • @CarloXManuelX
    @CarloXManuelX 11 місяців тому

    I thank you a lot for the effort you put in your videos to teach us in the best way possible, im learning a lot of things watching your videos, you've helped me improve my skills, thank you again, you're the best!

  • @florenthajdari116
    @florenthajdari116 2 роки тому

    Very good!
    Just I don't understand why you have just under 100K subscribers!
    New programmers should subscribe you, because they can learn a lot from you!
    You deserve more than 500K - 600K subscribers!
    Anyway, good luck and don't stop bringing new things!

  • @Owl-f3z
    @Owl-f3z Рік тому

    Hello lama dev, I followed the video and created search results part by my self. This was the first time i was able to design without being confused. Thank you so much. You are a great teacher.

    • @arjuno7058
      @arjuno7058 Рік тому

      Hello can you help me? I'm a beginner and just started coding. I tried the instructions in the video but I didn't get the same folder as his. Where did I go wrong?

  • @okorojohn7788
    @okorojohn7788 2 роки тому +2

    Many thanks again Mr Lama for your wonderful tutorials.
    I suggest you build the backend with MongoDB.

  • @vamshikrishnareddy76
    @vamshikrishnareddy76 2 роки тому +1

    Thank you for styling it in css as a beginner it's hard to wrap my head around when the tutorials use bootstrap etc just import few things and boom it works like a magic without knowing the underlying css it's hard to follow 😅

  • @designmatemj
    @designmatemj 2 роки тому +6

    Hey Lama, can you please use MERN Stack for the backend of this project? And please make the authentication system of this project.

    • @morshedulislamriaad6496
      @morshedulislamriaad6496 2 роки тому

      why not try yourself?

    • @designmatemj
      @designmatemj 2 роки тому +2

      @@morshedulislamriaad6496 I wish I could have that level of skills.... I am a beginner programmer who has just started to learn MERN Stack. But ya once I master MERN I will definitely not look for tutorials.

    • @clever_maureen_coder77
      @clever_maureen_coder77 2 роки тому

      @Maureen Jain, amazing idea. Please LAMA work on this idea.

  • @dimond789
    @dimond789 Рік тому

    Love your work. You are at the top!!!

  • @kietack1203
    @kietack1203 Рік тому

    OMG, this is gold mine. TYSM

  • @mohdali-yq8gq
    @mohdali-yq8gq Рік тому +1

    Dear Mr. Lama, I will highly recommend to develop the backend in Strapi as it is a very innovative new technology which is a very great headless CMS as the subjected front end is very beautifully created by you so please incorporate the Strapi as a backend because we can learn more and more concepts in Strapi like how to upload many a images and many more new concepts like how to create the custom routes and much more but at the end please use the backend technology whichever you consider is more appropriate for this project.
    Again thanks as we are really seeking such a wonderful and beautifully teaching on the platform UA-cam

  • @hamidr8391
    @hamidr8391 2 роки тому +2

    Thank you so much for this tutorial. Please use MERN Stack for backend.

  • @modz7675
    @modz7675 2 роки тому

    best channel on all youtube

  • @sandeeptummalagunta8680
    @sandeeptummalagunta8680 2 роки тому

    Great tutorial Sir. Take a bow.

  • @viniciusm.m.7822
    @viniciusm.m.7822 2 роки тому

    Excelente, meu brother! Thanks!!! Forte abraço do Brasil!

  • @shivamsaini4815
    @shivamsaini4815 2 роки тому

    Marvelous, You are such a genius.

  • @eusebiojoveth1120
    @eusebiojoveth1120 2 роки тому +2

    Conteúdo de alta qualidade como sempre!
    Muito obrigado mestre!
    Um forte abraço.

    • @viniciusm.m.7822
      @viniciusm.m.7822 2 роки тому

      Topzera mano! Kkk vc já é developer ou está em busca do firts júnior job?

    • @eusebiojoveth1120
      @eusebiojoveth1120 2 роки тому +1

      @@viniciusm.m.7822 Já sou developer, actualmente trabalho com angular mas estou estudando o React

    • @viniciusm.m.7822
      @viniciusm.m.7822 2 роки тому

      @@eusebiojoveth1120 q bom, parabéns brother! Se sobrar alguma vaga pra quem busca first job na trilha Web e puder me indicar seria muito bom! kkk Tenho projeto individual de cadastro de produtos em Js/Html/Css (com certificação) e agora estou desenvolvendo o meu 1º em React.

  • @mohdali-yq8gq
    @mohdali-yq8gq Рік тому

    Dear lama, without any exaggerating, your teaching skills are wonderful as they are embedded with absolute practical approach and I have very first time went through such a unique and incredible video on UA-cam platform. These kind of tutorials are very, very beneficial for the persons who have passion to learn more and more and excel their carrier in software engineering. I have been learning a lot through the subjected React Booking UI design and gone through with the backend as well which is a great and well optimized. You have covered lots of different topics and explained those in a very easy to understand way at last but not least, I have a very humble request to you that is to create the backend of the subjected tutorial on Strapi as it is one of the easiest and CMS and lot of API's are created automatically and handling backend becomes very handy where more and more time can be diverted on Frontend. hope you will not turn down my request and in a very near future and you will post the backend of the subjected UI on Strapi which will be a very great example of Strapi on the UA-cam platform and more and more people can take advantage to learn the new technology called as strapi by the great person like you Mr. Lama Dev

  • @hoangnguyenvan831
    @hoangnguyenvan831 2 роки тому

    You are very talented , great content as always

  • @aseladaskon85
    @aseladaskon85 2 роки тому +2

    Hi Lama,
    Fantastic video tutorial. Learned a lot about UI design. one thing you missed out which is the responsiveness of the app. can you please implement that too? thank you.

  • @NavyaVedachala
    @NavyaVedachala 2 роки тому +1

    @30:00 where is the dot available in keyboards? I can only find a fullstop

    • @NavyaVedachala
      @NavyaVedachala 2 роки тому +2

      found it: Keep the Alt key pressed (key just to the left of the Space bar), then you successively type the numbers 0 1 8 3 then you finally release the Alt key, which will bring up the middle dot / median dot at desired location.

  • @pastor9411
    @pastor9411 2 роки тому +15

    Can you do back-end with nodejs?

  • @yokubibnsafar7895
    @yokubibnsafar7895 2 роки тому +1

    Assalamu Aleykum! Thank you for this useful video))

  • @promisejaychilufya3384
    @promisejaychilufya3384 2 роки тому +3

    Hi Lama, Thank you for the great content you're such an amazing teacher I love the way you simplify and make everything understandable.
    Please for the backend use MERN stack😊
    I'm enjoying creating my first react project to add to my portfolio. I'm grateful

  • @Kuena866
    @Kuena866 2 роки тому

    I can't wait to watch this one

  • @theidanking
    @theidanking 2 роки тому +1

    you are amazing! i wish to see the backend for the React Booking, its include file upload and can over a lot.

  • @daamas3809
    @daamas3809 2 роки тому +17

    Hey Lama! Could you do Strapi as the backend CMS? this can also be integrated with or without GraphQL if required

    • @apple2655
      @apple2655 2 роки тому

      I would love to see those together with :)

  • @tuncyanik
    @tuncyanik 2 роки тому +1

    thanks, it would be perfect if using google maps auto-complete on the search field and a new property listing page with coordinates,desc, images, etc.

  • @learnprogramming746
    @learnprogramming746 2 роки тому +1

    Great work sir!♥ Could you please next make a tutorial on an Employee Payroll Management System, As there are no tutorials available! It would be really nice to see how to do it using MERN

  • @dragonkali2788
    @dragonkali2788 2 роки тому

    Wow awsome , really loved it thanks , iam taking your project as a reference ,really really thanks man , i will pray for you as well , all the best

  • @quantontheway
    @quantontheway 2 роки тому

    amazing! thx Lama

  • @nadnet
    @nadnet 2 роки тому +2

    Could you please make the backend with Django & Django REST Framework?

  • @Sam-os9jt
    @Sam-os9jt 2 роки тому

    Wonderful!!! for the backend, i hope watching Node js and Mysql. thank you so much

  • @ChambahRussell
    @ChambahRussell Рік тому

    This is amazing, great work

  • @RianY2K
    @RianY2K 2 роки тому +2

    Thank you Lama Dev, hope you can use Next JS for future tutorial?

  • @EmmaEG
    @EmmaEG 2 роки тому

    MERN with Redux, your projects are amazing, thanks for your help!

  • @joecolas
    @joecolas 2 роки тому

    very nice ui and very good work. thank you so much @lamadev for this useful tutorial

  • @techtitbits
    @techtitbits 2 роки тому +9

    Hi @LamaDev am actually waiting for an implementation of that admin dashboard with NodeJS backend and MongoDB. I need it badly to implement in my project. Also a quick question, does react-query work in the same way as axios. And will that be a much better option with regards to client state and server state? Thank you

  • @drip1717
    @drip1717 2 роки тому +6

    It would be nice if you actually used some relational databases like MySQL or PostgreSQL, combined with Node. Mostly because the previous projects you've created were just MongoDB, so it would be a good opportunity to learn something else. Huge respect to you my friend, I learned a lot from your tutorials.

  • @lakshyayadav6069
    @lakshyayadav6069 2 роки тому

    Hey lama, you have the best content on the whole internet.
    I have a request can you make a Razorpay payment video. Pleassseeeeee

  • @leviudeh8843
    @leviudeh8843 2 роки тому

    Thanks for the tutorial. MERN stack will be fantastic.

  • @dhruvshah1555
    @dhruvshah1555 2 роки тому +3

    For back-end please consider firebase with rtdb instead of firestore, because less tutorial available on rtdb, please make full stack, ie auth, payment gateway and crud operation,
    Thanks

  • @randomcell708
    @randomcell708 2 роки тому +5

    Lovely tutorial Lama, as always. How about using GraphQL and SQL/Postgres or something similar for backend?, Theres so many Mern stack tutorials at the moment, would be good to see something different

  • @jamjam3337
    @jamjam3337 2 роки тому

    Thank you for the great content! 👏👏👏

    • @cchelseacxx
      @cchelseacxx 2 роки тому

      👆Send a direct message for help 🆙 ⬆️.

  • @finociasubahani3567
    @finociasubahani3567 2 роки тому +1

    Superb awesome video, thank you so much, please do with node,express, mongodb for backend

  • @ozgurdogru2727
    @ozgurdogru2727 2 роки тому

    perfect project again. thank you!

  • @mirobagaric6710
    @mirobagaric6710 2 роки тому

    Great tutorial! Thank you!

  • @danaharley3565
    @danaharley3565 2 роки тому

    Awesome😍 thanks lama

  • @wusudavid2575
    @wusudavid2575 2 роки тому +1

    I would like if we could implement pagination for those tables on the admin dashboard

  • @abishieks8069
    @abishieks8069 2 роки тому +1

    Backend with sanity would be appreciated dude😊

  • @gulay3203
    @gulay3203 2 роки тому

    awesome tutorial👏🏼

  • @xyunsx
    @xyunsx 2 роки тому +1

    amazing !! we need to see in API build : node js & SQL combination :D