Overview

This project is a web application called Burger Builder, where the users can build their own burgers and place order for it. It is from a React course in udemy by German instructor Maximilian Schwarzmüller.

See link: https://www.udemy.com/react-the-complete-guide-incl-redux/

The course is very comprehensive on React and Max's knowledge on frontend is very impressive. The content of the course is no less than a usual course in collage and the final project in course is little bit more than what is shown here cause I fast forward and skip some sections to save time, but the project gives me basic understanding about how to use React and related technology to build a Single Page Application (SPA), which requires a lot of different technology than that used in Multiple Page Application(MPA).

Tech Stack

React Core

including JSX, props, state, functional(stateless) component, class(stateful) component, component lifecycle.

webpack

module to compile and build the project and in this project CSS file is also compiled

react-router

module to simulate the page changes in a SPA.

redux

module for state management in complex environment.

axios

module to contact database server for data saving and retrieving.

firebase

a no-sql database in cloud by Google. To simplify the situation, the writing privilege is off on my firebase, so the order submission would fail, but the application can retrieve the orders from firebase.

Environments

Dev

Windows + VS code + node/npm + firebase

Deployment

Linux/EC2@AWS + node/npm + firebase

React Vs Vue

I believe React and Vue can be used to build the web application with the same user experience, and they might have more in common than differences. For example, they have similar concept of component, router and state management,

For me, React has a little higher learning curve than Vue and it requires more understanding of javascript and it has broader usage of component. On the other hand, Vue is a little closer to traditional web application like JSP/PHP approach with the usage of template and it is little easier for me to pick up.

At the end of the day, I would probably say that if React is C, Vue is like C++.

This is live, try it.