This project was bootstrapped with Create React App, and uses React Bootstrap for a quick base set of styles and components.
This project is intended to help newcomers to React in learning how to implement some of the more common patterns used with component-based development. It's also intended to help those that have been working with the library for a while, but have perhaps never gotten deeper than basic components. It will teach you strategies for wrapping general imperative-style APIs as declarative components, applying transformations to existing components, certain optimizations to help improve application performance, the basics of hooking an application up to Redux for global state management, and some of the basics of testing React applications with Jest, Enzyme, and Cypress.
To get up and running quickly, simply follow these steps:
Login to GitHub and visit https://github.com/Velveeta/intro-to-react-workshop, then click the Fork
button in the upper-right corner.
Visit your own copy of this repository and click the green Clone or download
button to display the clone path. Copy this to your clipboard, then use your utility of choice (terminal, Sourcetree, etc.) to clone the repository to your desired location on disk.
From within the root of the project directory, run yarn
or npm install
to install the project dependencies.
From within the root of the project directory, run yarn start
or npm start
to run the application. It should automatically launch your browser to the right location, but if it doesn't, you can just open a page to http://localhost:3000.
In the project directory, you can run:
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.
Launches the Jest test runner in the interactive watch mode. See the section about running tests for more information.
Launches the Cypress test runner in headless/CI mode. See the section about the Cypress run command for more information.
Launches the Cypress test runner in the interactive mode. See the section about the Cypress open command for more information.