Gradebook App
Il Progetto
Applicazione per la gestione dei voti sviluppata con JavaScript, che calcola le medie di una classe, assegna voti in lettere e determina automaticamente la promozione o la bocciatura degli studenti.
Codice Sorgente
- script.js
function getAverage(scores) {
let sum = 0;
for (const score of scores) {
sum += score;
}
return sum / scores.length;
}
function getGrade(score) {
if (score === 100) {
return "A++";
} else if (score >= 90) {
return "A";
} else if (score >= 80) {
return "B";
} else if (score >= 70) {
return "C";
} else if (score >= 60) {
return "D";
} else {
return "F";
}
}
function hasPassingGrade(score) {
return getGrade(score) !== "F";
}
function studentMsg(totalScores, studentScore) {
let classAverage = getAverage(totalScores);
let studentVote = getGrade(studentScore);
let passed = hasPassingGrade(studentScore);
if (passed) {
return "Class average: " + classAverage + ". Your grade: " + studentVote + ". You passed the course.";
}
else {
return "Class average: " + classAverage + ". Your grade: " + studentVote + ". You failed the course.";
}
}
console.log(studentMsg([92, 88, 12, 77, 57, 100, 67, 38, 97, 89], 37));
La Rivelazione dell’Utilità Pratica
In questo breve progetto ho capito quanto JavaScript possa essere utile e quanto possa semplificare la vita, in questo caso a un insegnante che deve capire rapidamente la media e avere un feedback immediato su promozione o bocciatura.
La Consapevolezza della Necessità di una UI
Mi sono reso conto di quanto sia necessaria una UI che accompagni uno strumento di questo tipo. Un insegnante non può mettersi a digitare voti dentro console.log — ha bisogno di un’interfaccia dedicata, piacevole e immediatamente comprensibile.
Come afferma Steve Krug in “Don’t Make Me Think”: l’interfaccia deve essere auto-esplicativa, senza bisogno di spiegazioni su come funzioni. L’interfaccia deve parlare da sola.
Cosa Ho Imparato
Funzioni Modulari:
- getAverage() – calcolo della media con loop
for...of - getGrade() – conversione da punteggio numerico a letter grade
- hasPassingGrade() – controllo booleano della promozione
- studentMsg() – funzione compositiva che unisce tutte le altre
Pattern di Programmazione:
- Separation of concerns – ogni funzione ha un compito specifico
- Code reusability – funzioni che chiamano altre funzioni
- String concatenation per output formattato
- Condizioni multiple con
else ifper la classificazione
Riflessione
Questo progetto ha consolidato una cosa fondamentale: JavaScript è potente, ma ha bisogno di un’interfaccia. La logica funziona perfettamente, ma senza una UI intuitiva rimane inaccessibile agli utenti finali.
È stata la prima volta in cui ho visto chiaramente il divario tra funzionalità e usabilità, un divario che come futuro UX Engineer dovrò sempre tenere a mente.
Prossimo progetto: Imparare il JavaScript di base costruendo un Role Playing Game Finalmente iniziamo a integrare HTML e CSS!