Initiative
Brighter Centers Initiative
Equipping community learning centers with solar power, clean water, and trained mentors across underserved regions.
Learn moreReactProject
by
Pulicheri Srinandini
Pulicheri SrinandiniProject Title: LiGHT Website Clone – Multi-Page React Application (Task 3) 🧩 Objective: Build a fully responsive multi-page React application using Vite that replicates the official LiGHT website. Reference Website: 👉 https://www.light.gyws.org/members ⚙️ Tech Stack Requirements: React (Vite setup) React Router DOM (for navigation) useState, useEffect, useRef (where needed) CSS / Tailwind CSS (no Bootstrap allowed) Data-driven components using .map() 📄 Pages to Build (Minimum 5) 1. 🏠 Home (/) Hero section / slider Animated counters (centers, states, members) Featured sections / cards Call-to-action buttons 2. 👥 Members (/members) 👉 Data must be fetched from: https://www.light.gyws.org/members Hierarchical member card layout Image + name + designation Senior Executive Members section Dynamic rendering using .map() Responsive grid layout 3. 💡 Initiatives (/initiatives) Horizontal scroll carousels Featured initiatives section Card hover effects (scale + shadow) Clean UI similar to LiGHT website 4. 📞 Contact (/contact) Contact form (Name, Email, Message) Form validation (React state-based) Toast / success notification Loading state on submit button 5. 🙋 Join Us (/join) CTA-based layout Info cards (why join, benefits) Simple and clean UI 6. ℹ️ About (/about) Organization overview Timeline / story section Mission & vision blocks 🧱 Project Requirements Reusable components: Navbar (active route highlight using useLocation) Footer Card components Button components Routing using React Router DOM Fully responsive design (mobile-first) Clean folder structure: src/ ├── components/ ├── pages/ ├── data/ ├── assets/ 📊 Data Handling Rule (IMPORTANT) Store data in /data folder Fetch and map dynamically using .map() Example: members.map(member => <MemberCard ... />) ✨ Bonus Features (Optional but HIGH SCORE) Scroll animations (AOS / Framer Motion) Dark mode toggle (localStorage) Carousel swipe support (mobile) Page transitions Scroll-to-top button 🚀 Deployment Deploy using Vercel or GitHub Pages Push code to GitHub repository 📌 Final Note: Focus on: UI structure similar to LiGHT website Clean component-based architecture No Bootstrap allowed
Home
Comments (0)
Sign in to leave a comment
Architecture
No Services Diagrams Yet
ReactProject · Building Brighter Communities
A Network of Changemakers
Thousands of dedicated members across every center and state, united by a shared vision for brighter, stronger communities.
Drag to rotate · click a card to focus
Our Reach
Impact that grows with every community
From local centers to a nationwide movement, ReactProject brings members together to build brighter futures, state by state.
0+
Centers
Active community centers delivering programs across the network.
0
States
States reached with on-the-ground initiatives and local teams.
0.0K
Members
Dedicated members powering volunteering and shared impact.
Why ReactProject
Building brighter futures, together
Explore the pillars that power our mission — a thriving community, a wide-reaching presence, and initiatives that create real impact.
Growing Community
A nationwide network of dedicated members working together to drive meaningful, lasting change across every region we serve.
Meet our membersCenters & States
Operating across multiple centers and states, we bring localized programs and support directly to the communities that need them most.
Explore our reachImpactful Initiatives
From education to healthcare and relief efforts, our initiatives turn shared vision into tangible outcomes for thousands of lives.
View initiativesGet Involved
Join a movement built on compassion and purpose. Volunteer, contribute, or lead — every contribution lights the way forward.
Join the causeFeatured
Initiatives & member highlights shaping every center
Swipe, drag, or use the arrows to explore the people and programs carrying ReactProject's mission across states and communities.
Members
Youth Leadership Program
Mentoring the next generation of changemakers through workshops, fieldwork, and hands-on community projects.
Learn moreInitiative
Clean Water Access
Building wells and filtration systems that deliver safe drinking water to thousands of families every month.
Learn moreMember Story
Volunteer Spotlight: Aanya
From a single weekend drive to leading 12 centers — meet the volunteers powering LiGHT across every state.
Learn moreInitiative
Education for Every Child
Free learning kits, libraries, and after-school programs reaching remote villages and growing communities.
Learn moreInitiative
Community Health Drives
Mobile clinics and wellness camps bringing checkups, vaccines, and care to those who need it most.
Learn moreBe Part of the Movement
Join LiGHT and help build brighter futures across every community.
From dedicated members to high-impact initiatives, your support powers real change. Become a member today or reach out to learn how you can make a difference.
12,000+ active members28 states reached150+ community centers
No comments yet. Be the first!