FoxyFit: Community Fitness Tracker

FoxFit revolutionizes your fitness journey by providing a vibrant community platform where users can effortlessly track their progress, engage with friends, and find inspiration in each other's achievements. With a dedicated page showcasing the progress of users over the last three months, FoxFit keeps you motivated and connected like never before. Powered by TypeScript, Angular, Angular Material, Firebase Authentication, and Vercel, FoxFit delivers a dynamic, social, and inclusive fitness experience.

Features

• Progress Tracking: Seamlessly track your fitness journey, including workouts, achievements, and milestones, to stay accountable and motivated.
• Social Check-Ins: Connect with friends, share updates, and celebrate each other's successes through interactive check-ins and encouragement.
• Inspiration Page: Explore a curated page highlighting the progress of users over the past three months, providing a source of inspiration and motivation for your own fitness goals.

Learnings

• Angular Material reactive forms
• Angular GET-, PUT-, POST-requests with realtime Firebase
• Email/Password registration and login via Firebase authentication
• Protect routs with authentication guards
• Interceptors for checking authentication automatically for each request
• Deployment with Vercel

Technology

• Frontend: built with Angular and Angular Material for a robust and up-to-date development foundation.

• Routing with Authentication Guards: Restricts access based on user login status.

• Mobile-First Design: for seamless use across various platforms.

• Authentication: Secure user access through Firebase's built-in authentication features.

• Data Storing: Retrieves and stores data efficiently using Firebase's services.

• Vercel Deployment: Leverages Vercel's serverless platform for scalability and reliability.

• Development and Deployment

• Development Server: Run ng serve for a local development server accessible at http://localhost:4040/. Changes to source files trigger automatic reloading.

• Build: Run ng build to create production-ready build artifacts stored in the dist/ directory. Use the --prod flag for optimized production builds.

• Production Deployment: After building, run node server.js to start the production server. Deployment can be automated using Vercel's continuous integration features.