/morden-gym-website

https://morden-gym-website-sathish-kumar-t.vercel.app/

Primary LanguageTypeScript

Gym Website

This repository contains the codebase for a modern, fully responsive gym website. The website is designed to provide a seamless user experience across devices and includes essential features for promoting gym services and managing class schedules, trainer profiles, and membership plans.

Table of Contents

Features

  • Responsive Design: Fully optimized for mobile, tablet, and desktop.
  • Hero Section: Visually appealing landing section with a CTA.
  • Class Schedule: Dynamic calendar for classes with filtering options.
  • Trainer Profiles: Detailed bios and booking options.
  • Membership Plans: Clear and concise membership plans with pricing.
  • Testimonials: Customer reviews and success stories.
  • Facilities Section: Showcasing the gym's facilities.
  • Contact Form: A form for inquiries, along with a map of the location.
  • Blog Section: Articles on fitness, nutrition, and health.
  • Shop Section: Optional section for gym merchandise.
  • Login/Member Portal: Secure login for members to access personal details.
  • SEO Optimized: Optimized for search engines with fast load times.

Technologies

  • HTML5
  • CSS3 (with Flexbox/Grid)
  • JavaScript (ES6+)
  • React.js (Frontend)
  • Next.js (Framework)
  • Node.js (Backend if applicable)
  • SQL (for database management)
  • Google OAuth (for user authentication)
  • RESTful API (for backend communication)
  • Git/GitHub for version control

Installation

To set up this project locally, follow these steps:

  1. Clone the repository:

    git clone https://github.com/sathish2905/morden-gym-website.git

  2. Navigate to the project directory:

    cd morden-gym-website

  3. Install the required dependencies:

    npm install

  4. Set up your environment variables (if applicable), especially for APIs like Google OAuth.

  5. Start the development server:

    npm run dev

  6. Open your browser and navigate to:

    http://localhost:3000

Usage

  • Homepage: Showcases the gym with a hero section, call to action, and key features.
  • Class Schedule: Browse available classes with details and timing.
  • Trainer Profiles: View and book sessions with different trainers.
  • Memberships: See membership plans and enroll.
  • Contact Us: Send inquiries directly via the contact form.
  • Shop: Browse and purchase gym merchandise (optional).

Folder Structure

morden-gym-website/
├── public/
│   ├── images/         # Static images used on the website
├── src/
│   ├── components/     # React components for the website
│   ├── pages/          # Next.js pages (e.g., index.js for the homepage)
│   ├── styles/         # CSS or styled-components
├── .env                # Environment variables (not shared in repo)
├── package.json        # Dependencies and scripts
├── README.md           # Project documentation
└── next.config.js      # Next.js configuration

Contributing

Contributions are welcome! To contribute:

  1. Fork the repository.
  2. Create a new branch (git checkout -b feature-branch).
  3. Commit your changes (git commit -m 'Add some feature').
  4. Push to the branch (git push origin feature-branch).
  5. Open a pull request.

License

This project is licensed under the MIT License. See the LICENSE file for details.