diff --git a/README.md b/README.md index de45d2f..1ee08ae 100644 --- a/README.md +++ b/README.md @@ -4,16 +4,16 @@ Welcome to a custom Copilot workshop prepared by the **GitHub’s Expert Service team**! -This workshop involves several technology stacks, therefore it is essential that you need to meet prerequisites as outlined in the prerequisites getting started if you want to follow along. Otherwise, you can always listen to what GitHub Expert Service team's instructor demo to see how it works in practice. +This workshop involves several technology stacks, therefore it is essential that you need to meet prerequisites as outlined in the prerequisites getting started if you want to follow along. Otherwise, please follow along and listen to what the GitHub Expert Service team's instructor demo to see how it works in practice. ## Objectives and key takeaways ### Objectives - Walk through a real-world use case: - - Building a fitness app from end to end. + - Building a fitness tracker app from end to end. - Create a full stack of technologies for the infrastructure, frontend, and backend. - - Using the latest Copilot features. + - Using the latest GitHub Copilot features. ### Key takeaways diff --git a/docs/1_Story/README.md b/docs/1_Story/README.md index 36b361b..52d9b89 100644 --- a/docs/1_Story/README.md +++ b/docs/1_Story/README.md @@ -1,11 +1,84 @@ -# Story to develop a fitness application with GitHub Copilot now begins! +# Your journey to develop a fitness tracker with GitHub Copilot now begins! -![Story of Fitness application](../../images/octofitapp.png) +![OctoFit Tracker](../../images/octofit-tracker.png) -Fitness app “OctoFit Tracker” tracks the exercise on a personal level, competes with others (rank scoring), and suggests some fitness activities. This app has a beautiful interface that tracks the user’s fitness activities, login interface, and provides personalization options. It has a way to save that data in the backend, which can compete with other fitness buddies. The purpose of this app is to keep everyone motivated to login their activities within their own teams – there are several different teams within the app. +Here's a reworked version of the workshop concept that's more suitable for a conference demo and attendee workshop: -As the chief programmer, you are assigned to design this application in less than a week and show a POC to the CEO of the OctoFit Corporation. You were not sure what to do, but you heard about the great results of launching the applications ASAP through this thing called GitHub Copilot. You start building the application with technology stacks that you are familiar with. You decided to make it as a web application, though extensible later to mobile app, so you will use ReactJS for the front end, Python Django so we can leverage REST API as the backend, and MongoDB as the main database with possible in-memory data storage like Redis or Kafka. You also want to start testing out in a local environment, so Docker container will be good, but it will be later deployed to Microsoft Azure as the container app, and you want to automate the deployment through GitHub Actions in addition to leveraging something like Terraform. +## OctoFit Tracker: Building a Fitness App with GitHub Copilot + +Welcome to the OctoFit Tracker workshop! In this hands-on session, you'll step into the shoes of a lead developer tasked with creating a cutting-edge fitness tracker in record time. We'll leverage the power of GitHub Copilot to rapidly develop a functional prototype of OctoFit Tracker, a social fitness app that encourages users to stay active and compete with their peers. + +### 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 +4. Learn best practices for working with AI-assisted coding tools + +### Application Features + +OctoFit Tracker will include: + +- User authentication and profiles +- Activity logging and tracking +- Team creation and management +- Competitive leaderboards +- Personalized workout suggestions + +### Technology Stack + +We'll be using a modern web application stack: + +- **Frontend**: React.js +- **Backend**: Python with Django REST Framework +- **Database**: MongoDB +- **Development Environment**: GitHub Codespaces + +### Workshop Structure + +1. **Introduction and Setup of prerequisites** + - Overview of OctoFit Tracker concept + - Setting up GitHub Codespaces + +2. **Rapid Prototyping with GitHub Copilot** + - Creating project structure + - Generating boilerplate code + - Implementing basic models and views + +3. **Building Core Features** + - User authentication + - Activity logging API + - Team management + - Leaderboard functionality + +4. **Frontend Development** + - Setting up React components + - Implementing responsive UI + - Connecting to backend APIs + +5. **Advanced Features and Optimization** + - Adding personalized workout suggestions + - Implementing caching with Redis + - Optimizing database queries + +6. **Wrap-up and Q&A** + - Reviewing what we've built + - Discussing best practices and lessons learned + - Q&A session + +### Key Takeaways + +By the end of this workshop, attendees will: + +- Gain hands-on experience with GitHub Copilot in a real-world scenario +- Learn strategies for effective AI-assisted development +- Understand how to leverage Copilot across different languages and frameworks +- Develop a functional prototype of a modern web application + +Join us for this exciting journey into the future of software development, where we'll harness the power of generative AI with GitHub Copilot to build OctoFit Tracker in record time! In this workshop, you are going to assume to be the lead developer. You will be responsible for building the application with GitHub Copilot’s help. Good luck! -[Next: Prerequisites :soon:](../2_Prerequisites) +[Next: Prerequisites, assumptions, and development environment setup](../2_Prerequisites) diff --git a/docs/2_Prerequisites/README.md b/docs/2_Prerequisites/README.md index 4cc5387..3f7736f 100644 --- a/docs/2_Prerequisites/README.md +++ b/docs/2_Prerequisites/README.md @@ -1,22 +1,23 @@ -# Prerequisites, expectations, and assumptions +# Prerequisites, assumptions, and development environment setup -## Prerequisites for attendees +## Prerequisites -- GitHub Copilot license -- Primary IDE: Visual Studio Code -- Plugins installed -- Operating System: Shouldn’t matter -- GitHub Account +- GitHub account +- GitHub Copilot license -## Technology stacks +## OctoFit Tracker technology stack - NodeJS: Version xxx - ReactJS: Version xxx - Python Django: Version xxx -## Expectations +## Developer environment setup -By the end of this guide, you will be expected to build a full stack application. However, due to some technical difficulties, it is likely that you will not be able to build everything in 40 minutes. However, you will still have a guide at the end to try on your own. +### Go to the code tab +![code tab](../../images/code-tab.png) + +### Create a GitHub codespace +![create a GitHub codespace](../../images/codespace-create.png) ## Assumptions diff --git a/images/code-tab.png b/images/code-tab.png new file mode 100644 index 0000000..7a8309d Binary files /dev/null and b/images/code-tab.png differ diff --git a/images/codespace-create.png b/images/codespace-create.png new file mode 100644 index 0000000..40d348b Binary files /dev/null and b/images/codespace-create.png differ diff --git a/images/octofitapp.png b/images/octofit-tracker.png similarity index 100% rename from images/octofitapp.png rename to images/octofit-tracker.png