React Booking | Reservation App UI Design for Beginners

แชร์
ฝัง
  • เผยแพร่เมื่อ 6 ก.ย. 2024

ความคิดเห็น • 546

  • @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.

  • @mahdimiad
    @mahdimiad 2 ปีที่แล้ว +5

    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

  • @pranavyeole102
    @pranavyeole102 2 ปีที่แล้ว +4

    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

  • @xcrxwadda8287
    @xcrxwadda8287 2 ปีที่แล้ว +17

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

    • @aarnasinghal5057
      @aarnasinghal5057 5 หลายเดือนก่อน

      Thank you so much for the easy explanation!!

  • @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 🙏

  • @abubakarsiddiquekawser938
    @abubakarsiddiquekawser938 2 ปีที่แล้ว +32

    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

  • @kiddhkane
    @kiddhkane ปีที่แล้ว +1

    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.

  • @siddharthjain4687
    @siddharthjain4687 2 ปีที่แล้ว +2

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

  • @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

  • @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

  • @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

  • @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

  • @studyhere20
    @studyhere20 2 ปีที่แล้ว +1

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

  • @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

  • @devsCafe1980
    @devsCafe1980 2 ปีที่แล้ว +2

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

  • @finociasubahani3567
    @finociasubahani3567 2 ปีที่แล้ว +1

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

  • @fernandoaung6426
    @fernandoaung6426 2 ปีที่แล้ว +1

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

  • @johnedet4551
    @johnedet4551 2 ปีที่แล้ว +3

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

  • @hamidr8391
    @hamidr8391 2 ปีที่แล้ว +2

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

  • @ousmanevincentdione9369
    @ousmanevincentdione9369 2 ปีที่แล้ว +1

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

  • @andrewaghoghovwia1948
    @andrewaghoghovwia1948 2 ปีที่แล้ว +3

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

  • @olaokunade677
    @olaokunade677 2 ปีที่แล้ว +1

    Thank you for this lama dev

  • @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.

  • @333PerezJuan
    @333PerezJuan 2 ปีที่แล้ว +2

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

  • @mulualemmhretu
    @mulualemmhretu ปีที่แล้ว

    Dear Lama, You are such an enthusiastic developer and teacher who teaches us by creating an excellent tutorial free on TH-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.

  • @adebisisheriff159
    @adebisisheriff159 ปีที่แล้ว

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

    • @cchelseacxx
      @cchelseacxx ปีที่แล้ว

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

  • @yokubibnsafar7895
    @yokubibnsafar7895 2 ปีที่แล้ว +1

    Assalamu Aleykum! Thank you for this useful video))

  • @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

  • @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 😅

  • @olegvoskovets4309
    @olegvoskovets4309 ปีที่แล้ว

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

  • @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

  • @SOMEONE-jg6jg
    @SOMEONE-jg6jg 2 ปีที่แล้ว +4

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

  • @adnanali-zm9rv
    @adnanali-zm9rv 2 ปีที่แล้ว

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

  • @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?

  • @OnlyJavascript
    @OnlyJavascript 2 ปีที่แล้ว

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

  • @sunithat6771
    @sunithat6771 2 ปีที่แล้ว

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

  • @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.

  • @okorojohn7788
    @okorojohn7788 2 ปีที่แล้ว +2

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

  • @bulent1824
    @bulent1824 2 ปีที่แล้ว +1

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

  • @nadnet
    @nadnet 2 ปีที่แล้ว +2

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

  • @ornefacciola4051
    @ornefacciola4051 ปีที่แล้ว

    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 ปีที่แล้ว

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

  • @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.

  • @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

  • @BulBulAhmed-cu3eu
    @BulBulAhmed-cu3eu ปีที่แล้ว

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

  • @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 TH-cam

  • @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!

  • @TasniMarwane
    @TasniMarwane ปีที่แล้ว

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

  • @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

  • @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

  • @akashupadhyay7104
    @akashupadhyay7104 2 ปีที่แล้ว +1

    Gooood one brother...
    Please make one project to create a small react design components library just like bootstrap. So that one can create their own and use it with the help of class name using CDN or with different ways..

  • @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.

  • @quickguidesbynatanoob9867
    @quickguidesbynatanoob9867 ปีที่แล้ว

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

  • @pastor9411
    @pastor9411 2 ปีที่แล้ว +15

    Can you do back-end with nodejs?

  • @macedit
    @macedit 2 ปีที่แล้ว

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

  • @fizamunir7692
    @fizamunir7692 2 ปีที่แล้ว

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

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

  • @le2karthikpatnaik362
    @le2karthikpatnaik362 10 หลายเดือนก่อน +1

    Hey Lama Dev could plz provide a vedio of deploying hotel bookin app

  • @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.

  • @CarloXManuelX
    @CarloXManuelX 7 หลายเดือนก่อน

    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!

  • @aseladaskon85
    @aseladaskon85 ปีที่แล้ว +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.

  • @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

  • @Systeminn.org_
    @Systeminn.org_ ปีที่แล้ว

    sir, your method is soo smooth and clear, i never seen any helpful on youtube, i learn React on your channel, thanx a lots , great sir

  • @RianY2K
    @RianY2K 2 ปีที่แล้ว +2

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

  • @pranavyeole102
    @pranavyeole102 2 ปีที่แล้ว

    Wow this was awesome! Just finished watching this!

  • @xyunsx
    @xyunsx 2 ปีที่แล้ว +1

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

  • @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

  • @abishieks8069
    @abishieks8069 2 ปีที่แล้ว +1

    Backend with sanity would be appreciated dude😊

  • @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

  • @souravraj
    @souravraj ปีที่แล้ว

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

  • @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.

  • @screyesg
    @screyesg 2 ปีที่แล้ว

    Thanks from Chile! Awesome tutorial!

  • @mounzrulislamsobuj3327
    @mounzrulislamsobuj3327 ปีที่แล้ว

    Excellent tutorial . I love it. Thanks Lama dev .

  • @arbazzkhan3239
    @arbazzkhan3239 ปีที่แล้ว

    you can separate headerlist from header and add it to navbar as component. And use from react router dom in navbar, So that nav bar and navlist goes to all routes. And add header only to home route. its easy to implement instead of adding condtions. read about outlet how to works

  • @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

  • @modz7675
    @modz7675 2 ปีที่แล้ว

    best channel on all youtube

  • @SunilKumar-cu3yz
    @SunilKumar-cu3yz 2 ปีที่แล้ว +2

    MERN stack, please. I want the backend to be MongoDB, express, and nodeJS.

  • @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 TH-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 TH-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

  • @kietack1203
    @kietack1203 ปีที่แล้ว

    OMG, this is gold mine. TYSM

  • @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.

  • @mbmalek92
    @mbmalek92 2 ปีที่แล้ว

    Hi lama you are awesome
    Please build POS system using react and node

  • @dimond789
    @dimond789 ปีที่แล้ว

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

  • @-smit-543
    @-smit-543 10 หลายเดือนก่อน +1

    session 1 -> 43:21

  • @Sam-os9jt
    @Sam-os9jt 2 ปีที่แล้ว

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

  • @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.

  • @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!

  • @habibikebabthe4th868
    @habibikebabthe4th868 ปีที่แล้ว +5

    you git doesnt work

  • @shivamsaini4815
    @shivamsaini4815 2 ปีที่แล้ว

    Marvelous, You are such a genius.

  • @viniciusm.m.7822
    @viniciusm.m.7822 2 ปีที่แล้ว

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

  • @TechnicalSamBha
    @TechnicalSamBha 2 ปีที่แล้ว

    Best video thanks for help love you from India....Lama love thanks

  • @danaharley3565
    @danaharley3565 2 ปีที่แล้ว

    Awesome😍 thanks lama

  • @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

  • @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

  • @sumanthprabhu11
    @sumanthprabhu11 2 ปีที่แล้ว +3

    Node (Express) and MongoDB Please

  • @sandeeptummalagunta8680
    @sandeeptummalagunta8680 2 ปีที่แล้ว

    Great tutorial Sir. Take a bow.

  • @hoangnguyenvan831
    @hoangnguyenvan831 2 ปีที่แล้ว

    You are very talented , great content as always

  • @leviudeh8843
    @leviudeh8843 2 ปีที่แล้ว

    Thanks for the tutorial. MERN stack will be fantastic.

  • @shubhamsood589
    @shubhamsood589 2 ปีที่แล้ว +2

    nodejs for backend

  • @Pareshbpatel
    @Pareshbpatel 2 ปีที่แล้ว

    Amazing Tutorial on React App UI Design. Thanks, Lama Dev
    {2022-06-13}, {2022-06-15}

  • @wusudavid2575
    @wusudavid2575 2 ปีที่แล้ว +1

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