Mini Support Desk

Mini Support Desk is a simple full‑stack example showing how to build a lightweight ticketing system with a Vue 3 frontend and a Django REST backend. It lets users create support tickets, assign priorities and statuses, and add comments. The project is containerised with Docker, so you can run both services with a single command.

Contents

• support-desk-api/ – Django API implementing ticket and comment models and REST endpoints.
• support-desk-web/ – Vue 3/Vite app using TypeScript and Pinia to consume the API.
• docker-compose.yml – Orchestrates the backend and frontend containers.

Getting Started

1. Clone the repository (this project lives in mini-support-desk in the shared folder).

2. Build and run with Docker Compose. From the root of the project run:

   docker-compose up --build

   This command builds the backend and frontend images, applies database migrations, and starts both servers. The backend will be available on port 8000 and the frontend on port 5173. When running in Docker the frontend proxies API requests to the backend automatically.

3. Visit the application. Open your browser to http://localhost:5173 to view the Vue app. The API lives under http://localhost:8000/api/.

Development tips

• The Vue app is scaffolded manually using Vite and uses the Composition API with TypeScript. The store lives in src/stores, routes in src/router, and views in src/views.
• The Django API uses the Django REST Framework (DRF). Models are in tickets/models.py, serializers in tickets/serializers.py and viewsets in tickets/views.py. The API is routed under /api/.
• Hot reloading works inside Docker because the project folder is mounted into the containers. When you change code in either service, the server automatically reloads.

License

This project is provided as a sample for learning purposes. Feel free to adapt it for your own projects.