# To run the Repo on localhost
npm run start
# To build repo files
npm run build
# Deploys directly to github pages (Redundant)
npm run deploy
NOTE: In webpack.config.js, change mode to development for faster changes in code, and change mode to production to build minified and optimized JS code
(P.S. Deployment is a pain in the butt, period. -_-)
SPAs, to put it simply, are websites that can be loaded in a single go on your browser. It is like using an App on your mobile, where you need not download a new Acitivy/Page every time you click something. The app has already been loaded once. When you loaded this site, behind the scenes, both the Home page and the About page loaded together. So the browser does not need to load the pages again. Heck, you can now view this site offline as well!!!(as long as you keep the tab open ;p)
The React project consists of various 'Components'. Each component has it's own states and properties. The way React works is that based on these properties(props) and states, it renders a virtual DOM (Document Objec Model) which in term determines what should be shown on the real DOM.
Components can be anything from HTML elements like divs, headers, etc.. to custom wrapper components that control other components. For example, the website has 2 components, and are the two components. The component has another component called within it. There are a tonne of possibilities of components here. You can create components for individual tag if you want ;p
The History API enables Javscript to consider routes or pages as states, and you can change from one state to another. Basically it means I can manipulate the browser history to put in pages using Javscript rather than actually loading pages from the server. So I need not connect to the internet to open About page or Home page again since Javascript is loading those pages.
You should definitely check out the React Tutorial. It has a great starter code and an amazing step by step tutorial to give you a clear understanding of the basic concepts.
Once you are comfortable with React, you can move onto React Routing. This is bit tricky to understand at first especially with JS examples rather than JSX on the site. Check out Advance JS Tutorial in case you don't understand stuff like arrow functions, or 'let', etc. Additional Resources if you feel quite confident, and want to explore more: Building React Project from Scratch(no create-react-app) Redux : State Management Libarary that goes hand in hand with React