/eco-echo-ui

Primary LanguageTypeScript

EcoEcho UI

This ui project serves as the frontend for the EcoEcho platform, a social media platform designed for US National Park enthusiasts. Built with TypeScript, React, and utilizing various libraries for enhanced functionality and styling, this UI provides a seamless and responsive experience for users to explore, document, and engage with national parks.

Setup

To run the EcoEcho UI locally, follow these steps:

  1. Clone the Repository:
git clone https://github.com/your/repository.git
cd eco-echo-ui
  1. Install Dependencies:
npm install
  1. Run the Application:
npm run dev

Libraries Used

The EcoEcho UI utilizes the following libraries:

  • Vite: A next-generation frontend build tool that provides lightning-fast development server and builds.

  • Tailwind CSS: A utility-first CSS framework for quickly building custom designs without having to leave your HTML.

  • Shad CN: A library for creating and managing shadows in CSS with ease.

  • Zod: A TypeScript-first schema declaration and validation library. Used for form validation to ensure data integrity.

  • Axios: A promise-based HTTP client for making requests to the EcoEcho API and querying data.

Development

The EcoEcho UI is structured with modularity and scalability in mind. Feel free to explore the codebase, make enhancements, or add new features. Contributions are welcome!

Folder Structure

The folder structure of the EcoEcho UI is organized as follows:

  • src/: Contains the source code of the React components, stylesheets, and utility functions.
  • public/: Contains static assets such as images and fonts.
  • components/: Contains reusable React components used throughout the application.
  • styles/: Contains custom stylesheets and Tailwind CSS configuration files.

Usage

The EcoEcho UI provides a user-friendly interface for interacting with the EcoEcho platform. Users can navigate through various pages, including park listings, activity documentation, user profiles, and more. The UI seamlessly integrates with the EcoEcho API to fetch and display data, ensuring a smooth and engaging user experience.

Contributing

Contributions to the EcoEcho UI are welcome! If you find any issues or have suggestions for improvements, please open an issue or submit a pull request on GitHub.

Thank you for using the EcoEcho UI! Happy exploring and happy coding! 🌲🏞️