Objective
Learn modern React.js development including components, props, state, hooks, API integration, routing and project structuring. These tasks help interns move from beginner to real-world React developer.
Features
- React functional components & JSX
- Props, State & Hooks
- React Router & Navigation
- API fetching with Fetch/Axios
- Reusable UI components
Technologies
React.js
JavaScript ES6+
React Router
Axios / Fetch
Bootstrap / Tailwind
GitHub
Beginner Level Tasks
- Create a simple React app using Create React App or Vite.
- Build a component showing your name, skills, and profile image.
- Create a button that updates text using useState.
- Build a list rendering component (students, products, etc.).
- Create a form component and print form data on submit.
Note: Out of the 4 main tasks given below, you are required to complete any 3 tasks.
Tasks (4)
Goal
Create a personal portfolio using React components.
Requirements
- Home, About, Skills, Projects & Contact sections
- Reusable components for cards, buttons, sections
Deliverables
- GitHub repository
- Live hosted link (Netlify/Vercel)
Goal
Fetch API data and display it using reusable components.
Requirements
- Use Axios or Fetch
- Show loading & error states
- Search/filter optional
Deliverables
- GitHub code + live link
- API documentation notes
Goal
Create a full-featured todo app with CRUD operations.
Requirements
- Add, edit, delete tasks
- Store data in local storage
- Use components + hooks
Deliverables
- GitHub repo
- Demo video or screenshots
Goal
Create a multi-page React app using React Router.
Requirements
- Minimum 3 pages: Home, About, Products/Blog
- Dynamic route for product/blog details
Deliverables
- GitHub repository
- Live hosted version
How to Submit Your Tasks
-
For each task:
- Create a separate document (DOC, DOCX, or PDF).
- Add screenshots, code snippets, hosted links, and GitHub repo link.
-
Upload your documents:
- Upload to Google Drive or GitHub.
- Ensure public viewing permissions.
-
Submit your links:
- Copy the public links.
- Go to the Task Submission page.
- Paste links clearly mentioning Task numbers.
Tip: Clear documentation = faster approval!