Overview
The react-exercises project is a database app built with React and Material-UI using Webpack and Babel. It was completed in late 2018 before React hooks came out. The project is divided into different branches, each focusing on a specific topic or feature. There are also references available including YouTube videos, a Medium article, and CodeSandbox links.
Features
- Grid Layout: Includes an intro to grid layout in the first two episodes.
- Data Store: Covers lists, tabs, and typography in episodes three and four.
- Dialogs and Icons: Explores dialogs and icons in episodes five and six.
- Forms, Inputs, and Styling: Covers forms, inputs, and styling in episode six.
- Lists and IconButtons: Explores lists and icon buttons in episodes seven and nine.
- CSS-in-JS: Covers CSS-in-JS and styling with JSS in episode ten and eleven.
- Theming: Covers theming in episodes twelve, thirteen, and fourteen.
- Context API: Explores the use of Context API in episode fifteen.
Installation
To install and set up the project, follow these steps:
- Clone the repository.
- Navigate to the project directory.
- Run the command
yarn startornpm startto serve the app at localhost:4000 and watch files for re-building the bundle. - Run the command
yarn buildornpm run buildto build a production bundle in the dist folder. - Run the command
yarn statsornpm run statsto generate a Webpack stats JSON file and render a dependency treemap. - Run the command
yarn serveornpm run serveto statically serve the contents of the dist folder.
Summary
The react-exercises project is a database app built with React and Material-UI. It covers various features and topics such as grid layout, data store, dialogs, forms, theming, and more. The project provides different branches for specific topics and includes references such as YouTube videos, a Medium article, and CodeSandbox links. Installation and setup instructions are also provided.