React.js Starter App

Concept

This project shows some basic usage of React.js features, including:

• components written as Javascript functions and JSX
• passing arguments (a.k.a props) to components
• maintaing state (i.e. internal data fields) within a component
• fetching data from an API and injecting it into a component
• creating shared global navigation links across all screens
• linking from one component to another using react-router-dom
• passing params to components in the URL
• simple login functionality where a protected page that is only shown to logged-in users
• use of a .gitignore file to exclude 3rd-party code and autogenerated files from version control tracking
• use of a package.json with npm to track dependencies and streamline installation.

Many of the features of React exhibited in this project are explained at a high level in this prepared lecture presentation.

Intentional exclusions

There are some common practices that we have not included here, since we believe they are distraction's from a beginner's ability to master React's code patterns.

• use of a state manager, such as Redux or Mobx
• use of a front-end framework, such as Bootstrap or Material Design
• use of a rendering engine, such as Handlebars or Pug
• use of a custom back-end API

Available Scripts

In the project directory, you can run:

npm install

Installs all the dependencies listed in the package.json configuration file. This is necessary before running the app, since the 3rd-party dependency code is excluded from version control by the .gitignore git settings file.

npm start

Runs the app in the development mode.
Open http://localhost:3000 to view it in the browser.

The page will reload if you make edits.
You will also see any lint errors in the console.