Module01 – Class components
- Used Typescript
- Set up eslint and prettier
- Added React-Router version 6.
- Added header which shows the current page name.
- Added Search Bar
- Input value saved to LocalStorage during component’s unmount.
- Added Cards.
- Had used class components to get access to lifecycle events or state.
- Used Jest tests for components.
Module02 – Forms
- Created a separate route for forms using uncontrolled components (with refs)
- After the Submit button is clicked, all data from the form displayed as Card in the cards list below the form.
- Added Form validation
- Added more tests
Module03 – Hooks
- Rewrote the main page with the hooks retain the functionality
- Rewrote the form with React Hook Form retain the functionality
Module04 – API
- Rewrote the search page with used API
- Added modal window with API-request
- Created a progress indicator
Module05 – Redux
- Implemented state management using Redux Toolkit
Module06 – SSR/SSG
- Moved application to the server and enabled server side rendering.
- Adopted Redux for SSR.
- Added e2e tests for your application via cypress.
- React (class components and hooks) and React-Router
- Typescript
- Eslint and prettier
- Jest tests and e2e tests
- Form validation
- API-request
- Redux, Redux Toolkit
- SSR
- Clone or download the repository(branches module01 – 06)
- Navigate to the repository's directory
- Run
npm install
to install all the required packages - Run
npm start
to start the local development server - Go to
http://localhost:3000/
to use the application