This training is designed to help students build a To-Do application with AI features that will be deployed to Azure. The application will start as a simple console/terminal application and then evolve into a web application taking advantage of generative AI to help with task recommendations. The application will be broken down into a series of sprints that will build on top of each other. Each sprint will have a set of features and user stories that the students will implement. The goal is to give students a hands-on experience building a real-world application that they can continue to evolve after the hackathon.
-
Everyone can code – and coding can come in all shapes and sizes; from a simple script/console application, to a website, to a fully commercial solution that scales to millions of users. You do not have to build the next Facebook or YouTube to be a developer.
-
Start Small and iterate – some problems can be daunting if you try to solve them all at once. Break down a problem into smaller chunks that you can iterate over and incrementally make improvements to your application over time. We have purposely broken down the problem into a series of sprints and user stories to help show how an application can evolve over many iterations.
-
Understand the tools that can help you on the journey: such as IDE’s (i.e., Visual Studio Code) and how AI can both help you build your application (i.e., GitHub Copilot) as well as help you create applications with amazing capabilities
- Students will be broken up into teams based on skill level and each team will be assigned a coach (i.e., CSA) to guide them through two days of learning.
- The training will be centered around building a To-Do Application. Taking the students from the most basic console/terminal application, to a web application, adding AI features along the way, and then eventually hosting in Azure.
- The application will be broken down into a small set of manageable tasks (i.e., sprints and user stories) building up to the final application. Each sprint will have some learning activities through recorded presentations to get the students up to speed on a topic, and then exercises broken up into features/user stories that they will implement.
- Each sprint will build on top of the previous sprint and students will be very hands on with the code.
- Since each sprint builds on the previous sprint a student can join at any point in the track and start coding as each user story has a fully functional code base that the user can start from.
- The students will be able to work at their own pace and will have the ability to ask questions of their coach as they work through the exercises.
The outline below documents the sprints and user stories that you will be implementing on your journey. If you want to go through the entire experience, please follow them in order. However, all user stories have fully functioning code base, so they are designed to pick up from whatever sprint / user story you want to start with.
⏲️ Est. time to complete: 45 min. ⏲️
This sprint is designed to help students get their environment setup and ready to start coding. The sprint will walk students through setting up their development environment, installing the necessary tools, and getting the code base for the To-Do application.
-
click here if you would prefer to setup a local development environment
⏲️ Est. time to complete: 45-60 min. ⏲️
This sprint is designed to help students build a basic To-Do application that can be used to store a local to-do list on your computer. The sprint will walk students through building a simple console application that will allow users to add, delete, and list tasks.
Note
🎓 Know before you start
click here for some videos to help get you started
- Development 101
- What is Python? (3:10 min)
- Python Extention for Visual Studio Code (2:49 min)
📕Feature: Manage To-Do List
📕Feature: Save To-Do List
Note
This sprint is a reminder that not all code needs to be complex. Not every problem requires a web application or a mobile app. Sometimes a simple script will get the job done!
⏲️ Est. time to complete: 80 min. ⏲️
This sprint is designed to help students build a web application by evolving the to-do application from sprint 1. The sprint will walk students through building a simple web application that will allow users to add, delete, and list tasks.
Note
🎓 Know before you start
click here for some videos to help get you started
- [Introduction to Web Apps](https://youtu.be/DE3OQyzPeEw)📕Feature: Web App Conversion
📕Feature: Basic Styling
⏲️ Est. time to complete: 25 min. ⏲️
In this sprint we will be taking the web application from Sprint 2 and adding in the ability to store tasks in a database to persist any changes that are made. This will allow users to access their tasks from any device with internet connectivity and not have to worry about concurrent users competing to write to a local file.
📕Feature: Shift task storage to database
⏲️ Est. time to complete: 30 min. ⏲️
This sprint is designed to help students add voice to text functionality to the To-Do application. The sprint will walk students through adding voice to text functionality to the To-Do application.
Note
💻 Note for Mac M1 Users - If you are using a Mac M1 device, please note that you will need to use Chrome or Safari as the voice-to-text mechanism used here is not supported in Edge on Mac M1 devices.
📕Feature: Voice to Text
⏲️ Est. time to complete: 1 hour 10 min. ⏲️
In this sprint you will be taking the application that you built in Sprint 4 and adding in AI recommendations to help users complete their tasks. This will be done by leveraging the Azure OpenAI API to generate recommendations based on the task name.
📕Feature: Advanced AI Recommendations
- 📖 Get Recommendations from Generative AI based on To-Do name
- 📖 Store the recommendations in the DB for a task
- 📖 Allow the user to refresh the recommendations
⏲️ Est. time to complete: 45 min. ⏲️
This sprint is designed to help students add additional details to the To-Do application. The sprint will walk students through adding details about the task such as Due Date, Priority, additional Notes, and whether or not the to-do item has been completed.
📕Feature: Add additional about to-do item
⏲️ Est. time to complete: 1 hour 35 min. ⏲️
This sprint is designed to help students add advanced styling to the To-Do application. The sprint will walk students through adding advanced styling features such as a tabbed interface, modal dialog, and advanced rules to ensure that a blank to-do is not added.
📕Feature: Advanced Web App Styling
- 📖 Add completed checkbox and due date details to main list
- 📖 Add a tabbed interface to show different views
- 📖 Prevent User from adding blank task and limit characters
- 📖 Confirm before deleting a task
- 📖 Show spinner when loading recommendations
⏲️ Est. time to complete: 60 min. ⏲️
This sprint is designed to help students deploy the To-Do application to the cloud. The sprint will walk students through deploying the To-Do application to the Microsoft Azure cloud.
📕Feature: Deploy to Azure
-
If you are in the "Everyone Can Code Event" then please follow this user story:
If you are doing this exercise with your own subscription then please follow this user story:
Caution
Please note that once your to-do application is deployed to the cloud it is running on the public internet and is accessible by anyone that has the URL to view and/or edit the information. So, please do not put personal items in your to-do list. We would also highly recommend that you setup security on the website. You can enable this through the next user story.
🎉 Congratulations! You have completed the Everyone Can Code To-Do application track!!! We hope that we "Lit Your Fire for Coding" and that you are excited to continue on your coding journey!
Are you still looking for additional ideas on how you could continue to learn? We have defined some "homework" scenarios that you can work on after this training. These are just suggestions and would definitely encourage you to come up with your own ideas as well
- Multiple lists per user - Update the application to allow a user to store multiple lists underneath their account.
- Mulit-tenant - Update the application to allow different users to log in and see their "own" lists.
- Different Authentication Provider - You can experiment with setting up different authentication providers for the website. At the time of this repo being created there are providers for Facebook, Google, Twitter, GitHub, Apple, and OpenID Connect.
- Migrate to a NoSQL database - Migrate your backend storage from SQL to a NoSQL database like CosmosDB.
- Create an API layer - Create an API layer between the Web App and the database so that your to-do list can be automated by other scripts and/or programs beyond just the user interface.
Want to continue using Azure after this event. You can sign up here to get started with a free Azure account.
Still interesting in learning more about coding? Check out the Where to Learn More section for more resources on coding and building applications.