ReactJS Internship - Group Project Assignment Document
Company: Aarna Tech Consultants Private Limited
Welcome Interns!
This document will guide you through the tools you need to set up and the group projects you
will work on during your 1-month ReactJS internship.
You will be divided into 6 groups, and each group will work collaboratively on one project
Tools to Install (Before Starting)
Please make sure the following tools are installed on your system:
1. Visual Studio Code (VS Code)
● Editor to write your code
● Download: https://code.visualstudio.com
2. Node.js (LTS Version)
● JavaScript runtime for running React apps
● Download: https://nodejs.org
3. Git
● For version control and team collaboration
● Download: https://git-scm.com
4. GitHub Account
● Required to store and share your code repositories
● Sign up: https://github.com
📚 React.js Learning Resources
To get started with React.js, here are some helpful tutorials:
● 🔗 Official React Documentation
https://reactjs.org/docs/getting-started.html
● 🔗 W3Schools React Tutorial
https://www.w3schools.com/react/
Please go through these links to understand the basics of React such as components, props,
state, lifecycle methods, and hooks.
Group Project List
✅ Project 1: To-do List App
● Add / Edit / Delete / Mark Complete functionality
● Use useState, basic form handling, and local storage
● 🔸Group 1 - 2 Members
✅ Project 2: Quiz App
● Fetch questions from API (Open Trivia DB)
🔸
● Show options, timer, and final score
● Group 2 - 3 Members
✅ Project 3: Weather App
● Use OpenWeatherMap API to show weather by city name
🔸
● Display temp, description, humidity, and weather icon
● Group 3 - 2 Members
✅ Project 4: Expense Tracker
● Add income and expenses, display balance and transaction history
🔸
● Optional: use chart.js for data visualization
● Group 4 - 2 Members
✅ Project 5: Movie Search App
● Use OMDB API to search movies and display posters, titles, and year
🔸
● Add loading indicator and basic search feature
● Group 5 - 2 Members
✅ Project 6: Portfolio Website
● Create About, Skills, Projects, and Contact sections
🔸
● Use React Router for navigation
● Group 6 - 2 Members
Weekly Timeline
Week 1
● Setup your development environment (VS Code, Node.js, Git)
● Learn React basics: components, props, and state
● Build a basic "Hello World" app
Week 2
● Begin your assigned project in groups
● Divide tasks among team members
● Implement the core functionality
Week 3
● Complete remaining features
● Add styling and polish UI
● Finalize logic and complete any pending tasks
Week 4
● Deploy your app on Netlify or Vercel
● Push final code to GitHub
● Prepare and present a demo
Technologies You Will Use
● ReactJS
● React Router (for navigation)
● Axios or Fetch API (for API calls)
● Bootstrap / Tailwind CSS (for styling)
● Git & GitHub (for collaboration)
● Netlify / Vercel (for deployment)
Final Notes
● Collaborate daily with your team
● Follow clean code practices
● Don’t copy/paste code blindly; understand it first
● Ask doubts, explore, and enjoy the learning process!
All the best ✨
Documented By :
Tushar Malik
Phone / WhatsApp: +91-8930834126
