# Building a Fitness App with GitHub Copilot agent mode for Mergington High School ## OctoFit Tracker application story for Mergington High School Paul Octo has been a physical education teacher at Mergington High School for over 8 years. Despite his enthusiasm and creative approach to gym class, he's been increasingly concerned about students' physical activity declining once they leave school grounds. Many students admitted they rarely exercised outside of the required PE classes. After attending a professional development conference on "Technology Integration in Physical Education," Paul became inspired to create a solution. He wanted something that would: 1. Make fitness tracking fun and engaging 2. Create positive peer pressure through friendly competition 3. Allow him to monitor student progress remotely 4. Provide personalized guidance based on individual fitness levels ## The Birth of OctoFit Tracker Paul initially sketched his idea on a notepad during lunch breaks. He envisioned an app where students could log workouts, earn achievement badges, and compete in monthly fitness challenges. However, as a PE teacher with only basic coding knowledge, the technical aspects seemed daunting. That's when he approached Jessica Cat, the head of Mergington High's IT department. Jessica recommended using our repository instructions and prompts. ### Technical Planning Phase Before starting development, Paul and Jessica carefully reviewed the OctoFit Tracker's instructions and prompts. This provided a solid foundation for OctoFit Tracker, ensuring compliance with technical standards and leveraging proven design patterns. Together, Paul and the IT team identified key requirements for OctoFit Tracker: ### User Experience Goals - Simple, intuitive interface designed specifically for teenagers - Quick activity logging to minimize friction - Social features that respect student privacy - Gamification elements to maintain engagement ## Current Development Status Paul and Jessica have set up a GitHub Codespace environment and are making remarkable progress with GitHub Copilot agent mode. The OctoFit Tracker prototype will include: - A functional user registration system - Basic activity logging for running, walking, and strength training - The beginning framework for team competitions - A simple dashboard showing student progress ## Next Steps for Paul With the basic infrastructure in place, Paul is now focused on: 1. Developing an engaging point system that fairly compares different types of activities 2. Creating motivational challenges that appeal to different student interests 3. Building a notification system that encourages consistency without being intrusive 4. Designing reports that help him identify students who might need additional support or motivation The IT department has been impressed with how GitHub Copilot agent mode has accelerated development, allowing Paul to focus on the educational aspects while the AI handles much of the technical implementation. Jessica Cat has been particularly pleased with how OctoFit Tracker leverages the custom instructions and prompt files. ### Workshop Overview In this workshop, you'll: 1. Set up a development environment using **GitHub Codespaces** 2. Use **GitHub Copilot** to accelerate development across multiple technologies 3. Build key components of the **OctoFit Tracker** app with the help of Copilot agent mode 4. Learn best practices and prompting techniques for working with **GitHub Copilot agent mode** ### Application Features **OctoFit Tracker** will include: - User profiles - Activity logging and tracking - Team creation and management - A competitive leaderboard - Personalized workout suggestions ### GitHub Copilot Chat - [Getting started with GitHub Copilot Chat](https://docs.github.com/en/copilot/how-tos/use-chat/get-started-with-chat?tool=vscode) - [Use Chat in the IDE](https://docs.github.com/en/copilot/how-tos/use-chat/use-chat-in-ide?tool=vscode) #### LLM models references - [Supported AI models in GitHub Copilot](https://docs.github.com/en/copilot/reference/ai-models/supported-models) - [AI model comparison](https://docs.github.com/en/copilot/reference/ai-models/model-comparison) - [Changing the AI model for GitHub Copilot Chat](https://docs.github.com/en/copilot/how-tos/use-ai-models/change-the-chat-model?tool=vscode) - [Changing the AI model for GitHub Copilot code completion](https://docs.github.com/en/copilot/how-tos/use-ai-models/change-the-completion-model?tool=vscode) #### Prompt engineering - [Prompt engineering for GitHub Copilot Chat](https://docs.github.com/en/copilot/concepts/prompt-engineering) - [How to use GitHub Copilot: Prompts, tips, and use cases](https://github.blog/2023-06-20-how-to-write-better-prompts-for-github-copilot/) - [Using GitHub Copilot in your IDE: Tips, tricks, and best practices](https://github.blog/2024-03-25-how-to-use-github-copilot-in-your-ide-tips-tricks-and-best-practices/) ### OctoFit tracker fitness application technology stack We'll be using a modern web application stack: - **Frontend**: React.js - **Backend**: Python with Django REST API Framework - **Database**: MongoDB - **Development Environment**: GitHub Codespaces ### Workshop Structure 1. **Introduction** - Overview of OctoFit Tracker app concept - GitHub Copilot Chat models 2. **Setup of Prerequisites** - Setting up GitHub Codespaces - Ensure GitHub Copilot and Copilot Chat extensions are up to date 3. **Rapid Prototyping with GitHub Copilot agent mode** - Creating project structure - Generating boilerplate code - Implementing basic models, serializers, urls, and views 4. **Building Core Features** - Activity logging and tracking - User profiles - Team management - Leaderboard functionality 5. **Frontend and Backend Development** - Setting up React components - Implementing responsive UI - Connecting to backend APIs - Python Django business logic - MongoDB data layer