EcoNova 🌿

EcoNova is a full-featured, responsive React website built with a focus on sustainability, clean UI, and modern design practices. This is my first complete React project and it reflects my journey into professional web development using React, React Router, and Bootstrap.

---

🚀 Features

• 🌱 Modern Design: Built with Bootstrap and React-Bootstrap for responsive layouts and clean components
• 🔁 Routing: Dynamic routing with react-router-dom for seamless page navigation
• 🌙 Dark Mode (optional): Toggle-ready layout (expandable feature)
• 🧑‍💻 Profile & Dashboard: Personalized routes with user-based dynamic content
• 💼 Careers Page: Displays job openings dynamically
• 💸 Pricing Page: Clear, tiered pricing layout with plan features
• 🧑‍🤝‍🧑 Team Section: Introduces team members with styled cards
• 🔐 Login/Signup: Integrated user authentication UI with redirect support
• 💚 Eco Theme: Sustainability-focused content and branding

---

📁 Folder Structure

src/ ├── components/ │ ├── Navbar.jsx │ ├── NotFound.jsx ├── pages/ │ ├── About.jsx │ ├── Career.jsx │ ├── Contact.jsx │ ├── Dashboard.jsx │ ├── Home.jsx │ ├── Login.jsx │ ├── Pricing.jsx │ ├── Profile.jsx │ ├── Signup.jsx │ └── Team.jsx ├── App.js ├── index.js

---

🛠️ Tech Stack

• React (v18+)
• React Router DOM
• Bootstrap 5 + React-Bootstrap
• Custom CSS Modules (optional)
• Vite/CRA (depending on setup)

---

🧪 Getting Started

To run this project locally:

1. Clone the repository:

git clone https://github.com/RukhsarAhmed77/React-Assignment-05
cd React-Assignment-05

2. Install dependencies:

npm install

3. Run the development server:

npm start

---

📌 Pages Overview

• Home: EcoNova mission and intro section

• About: Story, values, and what we stand for

• Pricing: Pricing tiers and features

• Career: Job openings and application CTA

• Profile: Dynamic route: /profile/:name

• Dashboard: Dynamic route: /dashboard/:email

• Team: Meet the people behind EcoNova

• Login/Signup: Combined component for user auth

---

🎯 Goals

• This project was created to:
• Learn React and React Router deeply
• Build reusable components and layouts
• Practice working with dynamic routes and props
• Gain experience structuring a real-world frontend project

---

🙌 Acknowledgements

• Bootstrap
• React-Bootstrap
• React Router
• Looka for branding inspiration

---

📬 Contact

GitHub: @RukhsarAhmed77

Email: rukhsarnaich77@gmail.com

---

📌 License

This project is for educational and portfolio use. You may adapt it freely with attribution.

Made with ❤️ and React — by Rukhsar Ahmed