A full-stack Todo List app with an Astro frontend and Express.js API — built as a demo playground for GitHub Copilot customization features.
- 🆕 Create new todos
- 📋 View todo list
- ✅ Mark todos as completed
- 🗑️ Delete todos
- 📱 Responsive interface with Bootstrap 5
- 💾 Persistent storage with SQLite
# Clone the repository
git clone https://github.com/g-mercuri/gh-copilot-demo.git
cd gh-copilot-demo
# Install dependencies
npm install
# Start both servers
npm run dev
This starts:
| Service | URL | Port |
|---|---|---|
| Frontend (Astro) | http://localhost:4321 | 4321 |
| Backend (Express) | http://localhost:3000 | 3000 |
Note
The SQLite database (todos.db) is created automatically on first startup inside the backend/ folder.
| Method | Endpoint | Description |
|---|---|---|
GET |
/todos |
Retrieve all todos |
POST |
/todos |
Create a new todo |
PUT |
/todos/:id |
Update a todo's status |
DELETE |
/todos/:id |
Delete a todo |
📂 Repository layout
.
├── backend/ # Express server
│ ├── index.js # Server entry point with all API routes
│ └── package.json # Backend dependencies
├── frontend/ # Astro frontend
│ ├── src/
│ │ ├── components/ # Reusable Astro components
│ │ ├── layouts/ # Shared layouts
│ │ └── pages/ # Application pages
│ └── package.json # Frontend dependencies
├── .github/
│ ├── copilot-instructions.md # Repository-wide Copilot conventions
│ ├── instructions/ # Path-specific instruction files
│ ├── agents/ # Custom Copilot agents
│ ├── skills/ # Agent skills
│ └── prompts/ # Reusable prompt files
└── package.json # Root project scripts and dependencies
| Command | Description |
|---|---|
npm run dev |
Start the full application stack |
npm run install-all |
Install all dependencies |
cd frontend && npm run dev |
Start frontend only |
cd backend && npm run dev |
Start backend only |
This repository is a showcase for all the ways you can customize GitHub Copilot's behavior — custom instructions, prompt files, agents, skills, and more.
👉 See the Hands-on Workshop Guide for a comprehensive walkthrough with theory, commands, and demos for both VS Code and CLI. Also available in Italian.
📂 Copilot configuration files in this repo
.github/
├── copilot-instructions.md # Repository-wide conventions
├── instructions/ # Path-specific instructions
│ ├── astro-frontend.instructions.md # Astro + Bootstrap patterns
│ ├── express-backend.instructions.md # Express.js + SQLite patterns
│ ├── accessibility.instructions.md # WCAG 2.2 AA
│ ├── code-review.instructions.md # Review priorities
│ ├── security.instructions.md # OWASP Top 10
│ ├── code-comments.instructions.md # Commenting rules
│ └── github-actions.instructions.md # CI/CD best practices
├── agents/ # Custom agents
│ ├── todo-backend.agent.md # Express.js specialist
│ ├── todo-frontend.agent.md # Astro specialist
│ ├── todo-testing.agent.md # Jest + Playwright specialist
│ └── todo-database.agent.md # SQLite specialist
├── prompts/ # Reusable prompt files
│ ├── add-rest-endpoint.prompt.md
│ ├── create-astro-component.prompt.md
│ ├── generate-backend-tests.prompt.md
│ ├── generate-frontend-tests.prompt.md
│ ├── add-todo-filtering.prompt.md
│ ├── add-dark-mode.prompt.md
│ └── refactor-routes.prompt.md
└── skills/ # Agent skills
├── create-rest-endpoint/
├── create-astro-component/
├── add-database-migration/
├── generate-jest-tests/
├── generate-playwright-tests/
└── frontend-error-handling/
Feature prompts
| # | Prompt |
|---|---|
| 1 | "Write a function that sorts todos by status (completed first or incomplete first)." |
| 2 | "Write a function that filters todos based on a keyword entered by the user." |
| 3 | "Write a function that allows assigning a priority (high, medium, low) to each todo." |
| 4 | "Write a function that sends a notification if a todo is due within 24 hours." |
| 5 | "Add a feature to toggle between dark and light mode in the TodoItem component." |
| 6 | "Write a function that calculates and displays the total number of todos, completed, and incomplete." |
| 7 | "Implement a drag-and-drop feature to reorder todos in the list." |
| 8 | "Write a function that generates a shareable link for a specific todo." |
| 9 | "Write a function that allows exporting and importing todos in JSON format." |
| 10 | "Implement a feature that tracks changes made to a todo (text, status, etc.)." |
Azure deployment prompts
| Tool | Prompt |
|---|---|
| Azure CLI | "Generate an Azure CLI script to create an App Service and a PostgreSQL database to host the backend." |
| Azure CLI | "Write Azure CLI commands to deploy the backend to an existing App Service." |
| Azure CLI | "Generate a YAML configuration file for deploying the frontend to Azure Static Web Apps." |
| Azure CLI | "Write an Azure CLI script to configure the required environment variables for the backend." |
| Azure CLI | "Generate an Azure CLI script to enable resource monitoring and configure alerts." |
| azd | "Generate an azd command to create an App Service and a PostgreSQL database." |
| azd | "Write azd commands to deploy both the backend and frontend to Azure." |
| Terraform | "Generate a main.tf file to create an App Service, a PostgreSQL database, and a Static Web App on Azure." |
| Terraform | "Write Terraform commands to initialize, plan, and apply the configuration." |
| Terraform | "Configure a remote backend for Terraform to save state to Azure Storage." |
This repository was created and customized with GitHub Copilot.
This project is licensed under the MIT License.