Udemy
    •  
    •  
    •  
    •  
    •  
    •  
    •  
    •  
Turn what you know into an opportunity and reach millions around the world.
Learn More
Your cart is empty.
Keep shopping
React Pizza Shop - Ordering Food with Hooks and Firebase
Rating: 4.5 out of 5(246 ratings)
1,341 students
Created byreact.school _
Last updated 1/2021
English

What you'll learn

  • Cutting-edge React Development with React Hooks : useState, useEffect and your own custom hooks
  • Build a Complete Pizza Ordering Application for Customizing Restaurant Orders and Emailing Users
  • Beautiful UI Development from Scratch with Food Grids, Popup Dialogs, Buttons, Input Controls and more
  • Styled-components : The hottest CSS-in-JS library featuring CSS animations and extendable component styling
  • Authenticate Users with Google to Login and Logout
  • Firebase Realtime Database : Save pizza orders on Google's Serverless Data Platform
  • Firebase Functions and Nodemailer: Respond to order generation by emailing users their order
  • Ecommerce Patterns : Adding, Removing and Editing Orders, Calculating Tax and Totals for Dynamic Food Items
  • Hosting : Deploy your app on the web with Firebase Hosting

Course content

8 sections43 lectures4h 48m total length
  • Beginner Setup1:45
  • create-react-app4:15
  • Welcome to Sliceline1:41
  • Source Code0:10
  • React Hooks Examples0:09

Requirements

  • This course is at a professional level, basic familiarity with React and web development are recommended, however the entire project is created from scratch so beginners are encouraged to try it out.

Description

Welcome to React Pizza Shop. Here’s what we’ll be building: A pizza ordering system with multiple types of foods and editable popup dialogs to customize your order with delicious items from a menu. We'll add interactivity with a variety of custom React Hooks. After authenticating with a Google account, we’ll send this order to Firebase Realtime database and a serverless Firebase function will send your user an email confirmation of their order.

This course is intended for intermediate React developers looking for a fun project to practice React Hooks and/or learn Firebase. The full source code is provided. If you have any questions throughout the course, do not hesitate to reach out.

Here's just some of the features included in this 5+ hour course:

  • React with Hooks

    • useState, useEffect

    • Build custom hooks to control input elements, authentication, dialogs and more

  • Beautiful UI Development

    • Styled-components

    • Popup Dialogs

    • Buttons, Inputs, Checkboxes

    • Adding Stock Photos

  • Flexbox and CSS grids

  • CSS animations

  • Google Fonts

  • create-react-app boilerplate

    • Starting from scratch

    • Building for production

  • Firebase

    • Deploying your site with Hosting

    • Authenticating users with Google, logging them in and out

    • Realtime Database to track food orders

    • Functions to respond to orders

  • Ecommerce Ordering

    • Adding, Removing Editing orders

    • Calculating tax and totals of orders

    • Dynamic food items

  • Emailing orders with Node.js and Nodemailer

  • Favicon app icon

Who this course is for:

  • Students learning React and Web Development looking for a professional course at an intermediate to advanced level.