Gym-Fit

Key Features:

  1. User Authentication:

    • The application supports user sign-up and login functionalities.

  2. Responsive Design:

    • Responsive and Progressive Web App (PWA): The site is optimized for mobile and desktop views with PWA support, enhancing performance and offline usage.

  3. Membership Sign-Up Form: Integrated forms allow users to register for gym memberships, with easy navigation and input validation.

  4. Class Schedule Display: A dynamic section that lists the available gym classes and events, offering real-time updates.

  5. Contact Form: Users can easily get in touch for inquiries, contributing to seamless customer engagement.



Technologies Used:

  • Quasar Framework: A powerful Vue.js-based framework that allows for the development of responsive web apps, with a focus on material design and rich components.

  • Vue.js: Forms the core of the application, providing a reactive and component-based architecture.

  • Vue Router: Manages navigation within the app, allowing users to move seamlessly between different sections.

  • SCSS: For advanced styling and layout control

     

Project Structure:

  • src/:

    • assets/: Gym-related images (e.g., fitness classes, equipment).

    • components/: Reusable Vue components for headers, footers, and forms.

    • layouts/: Main page layouts (e.g., Home, Class Schedule).

    • pages/: Full-page components, like Classes, Membership, and Contact Us.

    • store/: Vuex store to manage the app’s state for features like user authentication.

    • router/: Manages URL routing and navigation.

  • public/: Holds the index.html and static files.

  • Quasar Configuration: Defined in quasar.conf.js, managing settings for build processes and plugins.