Build and Deploy a Fully Responsive Restaurant Website with Modern UI and UX in ReactJS
This video is perfect for you if you want to learn how to transform a #Figma design into a fully functioning website, improve your CSS skills, and create modern and responsive #ReactJS websites.
💻JS Mastery Pro - https://jsmastery.pro?discount=youtube
✅ A special YOUTUBE discount code is automatically applied!
⭐Hostinger - https://www.hostinger.com/javascriptmastery
Use the code JAVASCRIPTMASTERY to save up to 91% on all yearly hosting plans.
📚 Materials/References:
Starter Code - https://downgit.github.io/#/home?url=https://github.com/adrianhajdin/project_modern_ui_ux_restaurant/tree/main/starter_src
GitHub Code (give it a star ⭐) - https://github.com/adrianhajdin/project_modern_ui_ux_restaurant
Figma File - https://www.figma.com/file/yvClSI9AZBRX8UaaGEByF3/Modern-Ui%2FUx%3A-Gericht?node-id=53%3A2
UI8 Gericht - https://ui8.net/iqonicdesign/products/gericht-restaurant-website-ui-in-figma
BEM Educational Link - https://sparkbox.com/foundry/bem_by_example
📧 Mailing List JavaScript Mastery Pro: https://resource.jsmastery.pro/newsletter 🔥
💻 Become a part of our Discord Community - https://discord.gg/n6EdbFJ
By the end of this video, you'll learn:
- React functional components and their reusability
- React file and folder structure
- Fundamental #CSS properties to master flex & grid
- Fundamentals of the CSS BEM Model
- From soft and pleasant animations to complex gradients
- Perfectly placed media queries for satisfactory responsiveness covering almost all devices
- And at the end, you'll learn how to deploy your websites to extremely fast servers and give them a custom domain name.
💻 Master JavaScript: https://www.completepathtojavascriptmastery.com/
Use the special promo code "YOUTUBE" on checkout to save $60!
❤️ Support JavaScript Mastery & Suggest Future Videos:
BuyMeACoffe: https://www.buymeacoffee.com/JSMastery
Patreon: https://www.patreon.com/javascriptmastery
🌎 Find Me Here:
Discord Group: https://discord.gg/n6EdbFJ
Instagram: https://instagram.com/javascriptmastery
Twitter: https://twitter.com/jsmasterypro
💼 Business Inquiries:
E-mail: contact@jsmastery.pro
Time Stamps 👇
00:00:00 Intro
00:10:49 Setup
00:23:43 Navbar
00:50:00 Header
00:59:51 About Us
01:14:22 Special Menu
01:42:06 Chef
01:52:41 Video Player
02:04:26 Awards
02:16:28 Gallery
02:40:42 Find Us
02:46:13 Footer
03:18:35 Deployment
Видео Build and Deploy a Fully Responsive Restaurant Website with Modern UI and UX in ReactJS канала JavaScript Mastery
💻JS Mastery Pro - https://jsmastery.pro?discount=youtube
✅ A special YOUTUBE discount code is automatically applied!
⭐Hostinger - https://www.hostinger.com/javascriptmastery
Use the code JAVASCRIPTMASTERY to save up to 91% on all yearly hosting plans.
📚 Materials/References:
Starter Code - https://downgit.github.io/#/home?url=https://github.com/adrianhajdin/project_modern_ui_ux_restaurant/tree/main/starter_src
GitHub Code (give it a star ⭐) - https://github.com/adrianhajdin/project_modern_ui_ux_restaurant
Figma File - https://www.figma.com/file/yvClSI9AZBRX8UaaGEByF3/Modern-Ui%2FUx%3A-Gericht?node-id=53%3A2
UI8 Gericht - https://ui8.net/iqonicdesign/products/gericht-restaurant-website-ui-in-figma
BEM Educational Link - https://sparkbox.com/foundry/bem_by_example
📧 Mailing List JavaScript Mastery Pro: https://resource.jsmastery.pro/newsletter 🔥
💻 Become a part of our Discord Community - https://discord.gg/n6EdbFJ
By the end of this video, you'll learn:
- React functional components and their reusability
- React file and folder structure
- Fundamental #CSS properties to master flex & grid
- Fundamentals of the CSS BEM Model
- From soft and pleasant animations to complex gradients
- Perfectly placed media queries for satisfactory responsiveness covering almost all devices
- And at the end, you'll learn how to deploy your websites to extremely fast servers and give them a custom domain name.
💻 Master JavaScript: https://www.completepathtojavascriptmastery.com/
Use the special promo code "YOUTUBE" on checkout to save $60!
❤️ Support JavaScript Mastery & Suggest Future Videos:
BuyMeACoffe: https://www.buymeacoffee.com/JSMastery
Patreon: https://www.patreon.com/javascriptmastery
🌎 Find Me Here:
Discord Group: https://discord.gg/n6EdbFJ
Instagram: https://instagram.com/javascriptmastery
Twitter: https://twitter.com/jsmasterypro
💼 Business Inquiries:
E-mail: contact@jsmastery.pro
Time Stamps 👇
00:00:00 Intro
00:10:49 Setup
00:23:43 Navbar
00:50:00 Header
00:59:51 About Us
01:14:22 Special Menu
01:42:06 Chef
01:52:41 Video Player
02:04:26 Awards
02:16:28 Gallery
02:40:42 Find Us
02:46:13 Footer
03:18:35 Deployment
Видео Build and Deploy a Fully Responsive Restaurant Website with Modern UI and UX in ReactJS канала JavaScript Mastery
Показать
Комментарии отсутствуют
Информация о видео
Другие видео канала
![JavaScript ES2020 - The Most Requested Feature Explained in 10 Minutes](https://i.ytimg.com/vi/OvNIIgysD-s/default.jpg)
![MUST USE Websites & Tools for Web Developers](https://i.ytimg.com/vi/9CEW3Tmx2tg/default.jpg)
![React Hooks - Most Used Features](https://i.ytimg.com/vi/-9M9CGSd69I/default.jpg)
![Master the use of APIs and API Testing | Complete Crash Course](https://i.ytimg.com/vi/fvowySuuEIw/default.jpg)
![Full Stack MERN Project - Implement MERN Comments | React + Redux, Node, Express, MongoDB](https://i.ytimg.com/vi/46NRrn4xi5Y/default.jpg)
![Build and Deploy a Banking App with Finance Management Dashboard Using Next.js 14](https://i.ytimg.com/vi/PuOVqP_cjkE/default.jpg)
![10-Hour Masterclass: Develop 4 React Web Apps & Jumpstart Your Dev Career](https://i.ytimg.com/vi/tllZWCQZ9_0/default.jpg)
![Full Stack MERN Project - Pagination & Search | React + Redux, Node, Express, MongoDB](https://i.ytimg.com/vi/LYWgPSbPDfQ/default.jpg)
![Build and Deploy 3 Modern UI/UX Websites and Get Hired as a Frontend Developer | Full 10-Hour Course](https://i.ytimg.com/vi/RbxHZwFtRT4/default.jpg)
![Master Async JavaScript using Async/Await | Quokka JS](https://i.ytimg.com/vi/HXQZfuSMTfM/default.jpg)
![Build and Deploy an ARTIFICIAL INTELLIGENCE React App | Alan AI, JavaScript](https://i.ytimg.com/vi/rqw3OftE5sA/default.jpg)
![Web Scraping Full Course 2024 | Build and Deploy eCommerce Price Tracker](https://i.ytimg.com/vi/lh9XVGv6BHs/default.jpg)
![The Story of JavaScript Mastery](https://i.ytimg.com/vi/i5TAC9OkK-A/default.jpg)
![Build and Deploy a React Admin Dashboard With Real time Data, Charts, Events, Kanban, CRM, and More](https://i.ytimg.com/vi/6a3Dz8gwjdg/default.jpg)
![Build and Deploy a Full Stack AI SaaS Platform with Next js 14, TypeScript, Stripe](https://i.ytimg.com/vi/Ahwoks_dawU/default.jpg)
![Build and Deploy 5 JavaScript & React API Projects in 10 Hours - Full Course | RapidAPI](https://i.ytimg.com/vi/GDa8kZLNhJ4/default.jpg)
![Build and Deploy a Fully Responsive Website with Modern UI/UX in React JS with Tailwind](https://i.ytimg.com/vi/B91wc5dCEBA/default.jpg)
![Build and Deploy an AI-Powered 3D Website Using React | 2024 Three JS Course Tutorial for Beginners](https://i.ytimg.com/vi/ZqEa8fTxypQ/default.jpg)
![Learn how to deploy an NPM Package](https://i.ytimg.com/vi/8FziherTC8M/default.jpg)
![Build and Deploy a Full Stack Next.js 14 Application | React, Next JS 14, TypeScript, Tailwind CSS](https://i.ytimg.com/vi/986hztrfaSQ/default.jpg)
![Exclusive First Look at GitHub Copilot - All you need to know](https://i.ytimg.com/vi/fCjFzplbbs0/default.jpg)