This template should be used as the starting point for your individual coursework in the module ECS639U Web Programming (at Queen Mary University of London). Module leader: Paulo Oliva <p.oliva@qmul.ac.uk>

After cloning this repository, create a conda environment for this project and activate the environment:

$ conda create --name cwindividual python=3.11
$ conda activate cwindividual

The backend folder contains a Django project and was created with:

(cwindividual)$ django-admin startproject backend

With the conda environment active, install the backend (Python) dependencies:

(cwindividual)$ cd backend
(cwindividual)$ pip install -r requirements.txt

The main backend dependencies (see requirements.txt) are the Django framework itself (Django) and django-cors-headers which is needed for CORS requests (since the request origin address http://localhost:5713 is different from the address that sent the JavaScript code to the browser http://localhost:8000).

To start the backend server cd into the backend folder where the manage.py file is (if not already there)

(cwindividual)$ cd backend

and run

(cwindividual)$ python manage.py runserver

The server will start on http://localhost:8000

An "api" Django app has already been created with the command

$ python manage.py startapp api

and can be tested by visiting http://localhost:8000/api/test.json

The frontend folder contains a Vue/Vite project and was created with:

(cwindividual)$ npm create vite@latest

To install the frontend (JavaScript) dependencies cd into the frontend folder

(cwindividual)$ cd frontend

and run:

(cwindividual)$ npm install

The main frontend dependencies (see package.json) are vue and bootstrap.

To start the frontend server run

(cwindividual)$ npm run dev

and the server will start on http://localhost:5173