Welcome to the React Projects Repository! 🚀 This repository contains a series of 40 React projects aimed at mastering React development. Each project is organized within its respective folder under the rec
directory. 🌟
This repository serves as a comprehensive learning and practice space to become proficient in React.js. Each project focuses on different aspects of React development, ranging from fundamental concepts to advanced features. 🧑💻✨
rec/Components
├── project-01/
├── project-02/
├── project-03/
├── ...
└── project-40/
Each folder contains the project code with its own README file explaining the objectives and steps to run the project.
I have utilized a variety of powerful tools and libraries to build these projects, including:
- React ⚛️ for building user interfaces
- React Router DOM 🌐 for implementing dynamic routing
- Zustand 🐻 for state management
- TailwindCSS 🎨 for styling with utility-first CSS classes
Throughout these projects, I have explored and implemented the following React concepts:
- JSX Syntax 📝
- Components and Props 📦
- State and Lifecycle Methods 🔄
- Event Handling 🖱️
- Conditional Rendering ❓
- Lists and Keys 📋
- React Context API 🌐
- Custom Hooks 🪝
- Performance Optimization (Memoization) ⚡
- Lazy Loading and Suspense 🕒
- Error Boundaries 🚧
- Controlled vs. Uncontrolled Components 🎛️
- Portals 🚪
useState
🗃️useEffect
🌍useContext
🛠️useRef
🔗useReducer
🔄useCallback
📞useMemo
🧠useLayoutEffect
🏗️useImperativeHandle
✋
- Node.js installed
- Basic understanding of JavaScript and React
-
Clone the repository:
git clone https://github.com/susisarvesh/React.git cd React
-
Navigate to a project folder:
cd rec/Components/project-01
-
Install dependencies:
npm install
-
Start the project:
npm start
Project | Description | Status |
---|---|---|
1 | Basic React Setup and Hello World | ✅ Completed |
2 | To-Do List with CRUD Operations | 🔄 In Progress |
3 | Weather App with API Integration | ⏳ Pending |
... | ... | ... |
40 | Final Capstone Project | ⏳ Pending |
This repository is licensed under the MIT License. See the LICENSE file for more details.