This is a code repository for the corresponding video tutorial. In this video, we're going to build a Modern UI/UX Restaurant Landing Page Website

Related tags

React react ui modern reactjs ux
Overview

Restaurant Landing Page

Live Site

Restaurant Landing Page

Stay up to date with new projects

New major projects coming soon, subscribe to the mailing list to stay up to date https://resource.jsmasterypro.com/newsletter

Introduction

This is a code repository for the corresponding video tutorial. In this video, we're going to build a Modern UI/UX Restaurant Landing Page Website

You might be wondering, what are the prerequisites for building such an amazing website? Don't worry, this course is completely beginner-friendly! We're going to start easy and them move to more complex topics. Every step of the way will be explained. Alongside building the website, 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 devices
  • And at the end you'll learn how to deploy your websites to extremely fast servers and give them a custom domain name.
You might also like...

Build blazing fast, modern apps and websites with React

Gatsby v3 ⚛️ 📄 🚀 Fast in every way that matters Gatsby is a free and open source framework based on React that helps developers build blazing fast w

Jan 9, 2023

Hello, world! :) Welcome to this project. This is a free web repository that you can use as a blog for your website. This project is dedicated to "Sina Sattari" as an honorary title.

QURNO News/Technology Web Application Greetings and courtesy to all of you dear colleagues and friends of the DarkDragons team. We came back with anot

Sep 8, 2022

This repository store the source code of a chat application built in NextJS.

This repository store the source code of a chat application built in NextJS.

This repository store the source code of a chat application built in NextJS. The code was built in alura's React event, and here I styled the code to make it unique and creative!

Mar 31, 2022

This is not my code, just trained with "From Scratch - Développement Web" youtube video

React-Countries-API DISCLAIMER FR : Ceci n'est pas mon code, je me suis juste entraîné à partir de la vidéo de From Scratch - Développement Web ! EN :

Jan 4, 2022

Math Magicians! This is a website for all fans of mathematics. It is a Single Page App (SPA) that allows users to make basic calculations and read a random math-related quote.

Math Magicians! This is a website for all fans of mathematics. It is a Single Page App (SPA) that allows users to make basic calculations and read a random math-related quote.

Math Magicians Math Magicians is the first React Project I'm building. The main objective of this is to understand React features with a project-based

Feb 26, 2022

"Math magician is a website for all fans of mathematics. It is a Single Page Application(SPA) that allows users to make simple math calculations and read some math related quotes."

Math Magicians "Math magicians" is a website for all fans of mathematics. It is a Single Page App (SPA) that allows users to make simple calculations

Mar 29, 2022

Math magicians is a website for all fans of mathematics. It is a Single Page App (SPA) that allows users to: Make simple calculations. Read a random math-related quote.

Math magicians is a website for all fans of mathematics. It is a Single Page App (SPA) that allows users to: Make simple calculations. Read a random math-related quote.

Math Magicians Math magicians is a website for all fans of mathematics. It is a Single Page App (SPA) that allows users to: Make simple calculations.

Mar 23, 2022

This is my portfolio GitHub clone website. The frontend is build using NextJS and TailwindCSS.

This is my portfolio GitHub clone website. The frontend is build using NextJS and TailwindCSS.

Github Clone Portfolio Website Tech Stack used: NextJS Tailwind CSS The contact form in this website is connected to Notion. If you want to integrate

Oct 5, 2022

Further split the React Native code based on Metro build to improve performance, providing `Dll` and `Dynamic Imports` features

Further split the React Native code based on Metro build to improve performance, providing `Dll` and `Dynamic Imports` features

React-Native Code Splitting Further split the React Native code based on Metro build to improve performance, providing Dll and Dynamic Imports feature

Dec 29, 2022
Comments
  • Small typo within folder structure, namely Findus > FindUs.jsx

    Small typo within folder structure, namely Findus > FindUs.jsx

    Hey Adrian,

    The folder Src>Container>Findus>FindUs.jsx will return a module export error when attempting to run locally. Should be >>FindUs>FindUs.jsx with a small capitalization fix.

    Thanks again for all that you do. You're an amazing teacher and I cherish the knowledge.

    opened by pnwdevzac 0
  • Unable to Start Development Server after Cloning the project.

    Unable to Start Development Server after Cloning the project.

    There are two errors

    Solutions

    • Change the files in ./src/components/index.js.
    • from import MenuItem from './MenuItem/MenuItem';
    • to import MenuItem from './Menuitem/MenuItem';
    • Change the files in ./src/container/index.js.
    • from import FindUs from './FindUs/FindUs';
    • to import FindUs from './Findus/FindUs';
    opened by ganeshmajhi 0
Owner
Adrian Hajdin - JavaScript Mastery
JavaScript Enthusiast & Educator
Adrian Hajdin - JavaScript Mastery
GitHub
React-tutorial - A React tutorial from Udemy (Academind)

Getting Started with Create React App This project was bootstrapped with Create React App. Available Scripts In the project directory, you can run: np

Patrick James Nengasca 2 Mar 31, 2022
An on going project to learn ELF format.

elf.js An on going project to learn ELF format. The end goal is to be able to generate simple but actually working executables. Quick Start Supports o

Tsoding 37 Oct 29, 2022
Source code for my tutorial on how to build customizable table component with React Table and Tailwind CSS.

React Table + Tailwind CSS = ❤️ Source code for my tutorial on how to build customizable table component with React Table and Tailwind CSS. Both parts

Samuel Liedtke 147 Jan 7, 2023
Next / React / TS demo to quickly create a landing page

Next / React / TS demo to quickly create a landing page

null 1 Jun 27, 2022
OpenMaze landing page front-end

Getting Started with Create React App This project was bootstrapped with Create React App. Available Scripts In the project directory, you can run: np

OpenMaze 6 Dec 15, 2022
Landing page for any SaaS company, using Nextjs and NextUI

NextJS and NextUI Landing Page Template You can deploy here directly to vercel This is a template for NextJS and NextUI. NextJS NextUI You can see the

Mauricio Siu 31 Dec 23, 2022
Tutorial created in collaboration with Enyel Sequeira, taught by JavaScript Mastery.

Travel Advisor Live Site Introduction Build and Deploy an advanced Travel Companion Application using Google Maps. With Geolocation, Google Maps API,

Adrian Hajdin - JavaScript Mastery 1.6k Jan 3, 2023
React tutorial

Getting Started with Create React App This project was bootstrapped with Create React App. Available Scripts In the project directory, you can run: ya

Safa ABALLAGH 6 Sep 25, 2021
React Hooks tutorial for beginners.

React Hooks for Beginners git clone <url> Clone into the repo code react-hooks Open the folder in VS Code npm install Install the dependencies npm sta

Mohammad Muazam 2 Oct 10, 2022
Example "Mushroom App" used as a p2panda tutorial

mushroom-app-tutorial This is an example app accompanying the p2panda tutorial "Let's build a mushroom app!" with TypeScript, Webpack and React. Usage

null 3 Nov 4, 2022