Passa al contenuto principale

Gradebook App

Anteprima Gradebook App Project

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​

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 if per 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!