Data emissione : 31 marzo 2021
- Indice
- Gruppo di lavoro
- Scopo del progetto
- Richieste implementative
- Modello Entità Relazione
- Implementazione
- Frontend
- Backend
- Esecuzione usando docker
- PlanSoft (Cliente e PM)
- Leonardo Morganti (Sviluppatore)
- Leonardo Scrivere (Sviluppatore)
- Lorenzo Merlini (Sviluppatore)
Viene richiesta la creazione della parte di backend per la gestione degli studenti all'interno delle proprie classi. Le funzionalità che saranno implementate sono le seguenti:
- Visualizzazione di tutti o di un singolo studente.
- Inserimento, modifica e cancellazione di un determinato studente.
- Visualizzazione di tutte o di una singola classe.
Ad ogni dipendente è associato: un id identificativo, nome, cognome, codice fiscale, SIDI_CODE e l’id identificativa della propria classe di appartenenza.
Gli oggetti che dobbiamo trattare sono:
- Studente(id, nome, cognome, codice fiscale, SIDI_CODE)
- Classe(id, sezione, grado)
Inoltre gli oggetti sono collegati in questo modo:
- Una classe è composta da più studenti.
Studente(id, nome, cognome, codice fiscale, SIDI_CODE, classroom)
Classe(id, nome, grado)
Backend
- Java
- Linguaggio di programmazione utilizzato per lo sviluppo dell’applicazione tramite il framework Spring.
- Spring
- Framework utilizzato per lo sviluppo di web application, quindi collegamento al database(MySql) ed esposizione delle API.
- Maven
- Strumento utilizzato per facilitare la gestione delle dipendenze utilizzando il file pom.xml.
- Postman
- Strumento utilizzato per verificare il corretto funzionamento delle API realizzate.
Per eseguire l'applicazione frontend spostarsi nella direcotry src/main/webapp/
ed eseguire il comando npm run dev
.
L'applicazione è accessibile sulla porta 3000
all'indirizzo http://localhost:3000/
.
📦webapp
┣ 📂pages
┃ ┣ 📂api
┃ ┃ ┗ 📜hello.js
┃ ┣ 📂classrooms
┃ ┃ ┗ 📜modalClass.js
┃ ┣ 📂students
┃ ┃ ┣ 📜deleteAllert.js
┃ ┃ ┣ 📜modelForm.js
┃ ┃ ┣ 📜modelStudent.js
┃ ┃ ┣ 📜studenstList.js
┃ ┃ ┗ 📜studentForm.js
┃ ┣ 📜_app.js
┃ ┣ 📜classrooms.js
┃ ┣ 📜index.js
┃ ┣ 📜istruzioni.txt
┃ ┗ 📜students.js
┣ 📂public
┃ ┣ 📜favicon.ico
┃ ┗ 📜vercel.svg
┣ 📂styles
┃ ┣ 📜Home.module.css
┃ ┗ 📜globals.css
┣ 📜package-lock.json
┗ 📜package.json
Home page dell'aplicazione, permette la navigazione attrvaerso due pulsanti: il primo, etichettato Classi, conduce ad una pagina in cui è possibile consultare la lista di classi. il secondo, etichettato Studenti, conduce ad una pagina in cui è possibile consultare la lista di studenti.
La pagina mette a disposizione la lista degli studenti; per ogni elemento della lista è possibile visualizzare i suoi dettagli, aggiornare i suoi dati oppure rimuoverlo dalla lista.
È presente inoltre un pulsante per l'aggiunta di un nuovo studente alla lista.
La pagina permette la visualizzazione della lista delle classi. Per ogni classe è possibile visualizzare la sua lista dei suoi studenti ed apportare modifiche.
Mostra i dettagli di un singolo studente:
- nome
- cognome
- codice sidi
- codice fiscale
- anno scolastico
- sezione
Offre la possibilità di modificare i dettagli di uno studente.
Prima dell'eliminazione effettiva di uno studente vieni fatta una ichiesta di conferma la rimozione.
- Get Lista studenti=
/classmanager/students
[
{
id: 1,
name: "Lorenzo",
surname: "Merlini",
taxCode: "AAAAAA99A99A999A",
sidiCode: "99999999",
classroom: 1
},
{
id: 2,
name: "Mario",
surname: "Rossi",
taxCode: "BBBBBB77B77B777B",
sidiCode: "77777777",
classroom: 2
}
]
- Get Studente =
/classmanager/students/{id}
{
id: 1,
name: "Lorenzo",
surname: "Merlini",
taxCode: "AAAAAA99A99A999A",
sidiCode: "99999999",
classroom: 1
}
- POST Studente =
/classmanager/students/
{
id: 1,
name: "Lorenzo",
surname: "Merlini",
taxCode: "AAAAAA99A99A999A",
sidiCode: "99999999",
classroom: 1
}
- PUT Studente =
/classmanager/students/{id}
{
name: "Lorenzo",
surname: "Merlini",
taxCode: "AAAAAA99A99A999A",
sidiCode: "99999999",
classroom: 1
}
- DELETE Studente =
/classmanager/students/{id}
- GET Lista classi =
/classmanager/classroom/
[
{
id: 1,
grade: 1,
name: "NEE"
},
{
id: 2,
grade: 1,
name: "DMME"
}
]
- GET classe =
/classmanager/classroom/{id}
{
id: 1,
grade: 1,
name: "NEE"
}
- Esecuzione del container mysql, sostituire con il percorso assoluto al progetto:
docker run -d --name classmanager_database -p 3306:3306 -e MYSQL_ROOT_PASSWORD=root -v <root>/src/main/docker/database:/docker-entrypoint-initdb.d -v <root>/data:/var/lib/mysql mysql
- Appena il container db_classmanager è in stato di run possiamo eseguire la build del backend usando maven:
mvn clean package
- La build genera un file jar all'interno della directory target con il quale possiamo generare l'immagine del backend di classmanager:
docker build -t classmanager/backend . -f src/main/docker/backend/Dockerfile
- Generata l'immagine è possibile eseguirla generando la connessione con il database:
docker run -d --name classmanager_backend -p 8080:8080 --link=classmanager_database:localhost classmanager/backend
- Creazione dell'immagine del frontend:
docker build -t classmanager/frontend . -f src/main/docker/frontend/Dockerfile
- Esecuzione del container frontend:
docker run -d --name classmanager_frontend -p 3000:3000 --link=classmanager_backend:localhost classmanager/frontend
A questo punto tutti i servizi sono collegati e accessibili.