Every brunch is a separate task built on top of previous one using various opportunities of React ecosystem. You may check Pull Requests to see detailed information about tasks, scores and see screenshots and deploys
Goals of the study for each task were to:
- Understand what Class Components are in React.
- Learn how to create Class Components, including defining a class, rendering JSX, and using props.
- Explore how to manage state in Class Components.
- Get familiar with the lifecycle methods in Class Components.
- Grasp the importance of routing in SPAs and how React Router enhances user experiences.
- Understand how to set up and use React Router in a React project.
- Learn to configure routes for displaying different components based on the URL.
- Master navigation between pages using Link, NavLink, and programmatic navigation with Navigate.
- Implement protected routes and authentication flows in a React application.
- Understand how to setup tests in Vite React project.
- Get familiar with testing of the React components.
- Will get theoretical knowledge about testing best practices and will try to apply them on practice.
- Understand the principles of Redux and Redux Toolkit.
- Learn how to integrate Redux into React applications using React Redux bindings.
- Explore the usage of Redux Toolkit for simplified Redux state management.
- Get familiar with advanced Redux concepts like middlewares (e.g. thunks) using Redux Toolkit.
- Learn about Redux Toolkit Query for efficient data fetching and caching.
- Understand principles and goals of server rendering.
- Learn how to migrate from client to server rendering with Next.js.
- Get familiar with React Server Components.
- Understand the basics of working with forms in React.
- Learn how to create basic forms in React.
- Know how to control the state of a form using React state.
- Understand controlled and uncontrolled form elements.
- Learn how to use event handlers to process submitted forms.
- Understand form validation in React.
- Learn about form libraries like React Hook Form or Formik to simplify working with forms in React.
- Understand how to handle file uploads in React forms.
- Know how to create dynamic forms in React
- Learn how to push submitted form data to the server or to state management libraries.