react-js-starter-app

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.

This site is open source. Improve this page.