Key Features:
User Authentication:
The application supports user sign-up and login functionalities.
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.
Membership Sign-Up Form: Integrated forms allow users to register for gym memberships, with easy navigation and input validation.
Class Schedule Display: A dynamic section that lists the available gym classes and events, offering real-time updates.
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.