Skip to content

jane-does-coding/NaturePulse

Repository files navigation

NaturePulse

Screenshot 2025-01-02 at 10 36 56 PM

NaturePulse is a modern, interactive web application designed to raise awareness about environmental issues and provide users with real-time data on air quality, water levels, deforestation, climate trends, and waste statistics. The platform combines engaging visuals, interactive mini-games, and educational content to empower individuals and organizations to make a positive impact on the environment.


Technologies Used

Technologies

  • TypeScript: For type-safe and scalable code.
  • Tailwind CSS: For utility-first, responsive styling.
  • Prisma: For database modeling and management.
  • MongoDB: For flexible and scalable data storage.
  • Next.js: For server-side rendering and optimized performance.
  • React: For building interactive user interfaces.
  • Git & GitHub: For version control and collaboration.

Features

1. Real-Time Environmental Data

  • Track air quality, water levels, deforestation, climate trends, and waste statistics in real-time.
  • Interactive charts and visualizations for better understanding.

2. Interactive Mini-Games

  • Engaging games that educate users about environmental issues.
  • Fun and interactive challenges to promote eco-friendly habits.

3. Educational Content

  • Detailed insights into environmental issues and their global impact.
  • Tips and resources for reducing your carbon footprint.

4. Responsive Design

  • Fully responsive design for seamless use on desktops, tablets, and mobile devices.

5. Smooth Animations

  • Framer Motion animations for a modern and engaging user experience.

How It Works

1. Homepage

  • The homepage features a stunning hero section with a gradient background and a bold title.
  • A carousel showcases key features like air quality, water levels, deforestation, climate trends, and waste statistics.
  • Users can navigate through the carousel using buttons or indicators.

2. Global Eco Stats

  • A two-column layout displays real-time environmental data and engaging mini-games.
  • Users can click on "View Live Data" or "Try a Game" to explore further.

3. Why Choose Us

  • Highlights the expertise of the team and the real-world impact of the platform.
  • Uses a two-column layout with images and descriptive text.

4. Testimonials

  • Features user testimonials to build trust and credibility.
  • Displays user avatars, names, and quotes in a clean, two-column layout.

5. Footer

  • Includes links to important pages, social media, and contact information.

Demo

NaturePulse - Live Demo


Run Locally

Follow these steps to set up and run the project on your local machine:

  1. Clone the Repository
    git clone https://github.com/jane-does-coding/NaturePulse

NaturePulse/ ├── app/ │ ├── page.js # Homepage component │ └── layout.js # Root layout ├── components/ │ ├── Carousel.js # Carousel component │ ├── TwoColumnSection.js # Two-column layout component │ ├── Navbar.js # Navigation bar │ └── Footer.js # Footer component ├── public/ # Static assets (images, etc.) ├── prisma/ # Prisma schema and migrations ├── styles/ # Custom styles (if any) ├── .env # Environment variables ├── package.json # Project dependencies └── README.md # Project documentation