How we teach front-end development using vanilla JS
During my time as a PhD student, I had to take on some teaching duties. I ended up teaching the two introductory courses to information systems, which essentially map to back-end and front-end development. They were both very fun and rewarding to teach, but also very important to teach well since the local market in Spain focuses very heavily on web development, so most of our students will work on a web information system as their first job after graduating.
At the time when I joined, they were undergoing some changes as they were pretty outdated. The back-end course focused mostly on introducing students to requirements, relational databases and SQL, which never go out of fashion. We added a few units introducing REST and we built a tool to help them quickly deploy CRUD APIs on top of their existing databases. It resulted in a nicely cohesive course where students go through the whole process of turning requirements into a conceptual model, then into a relational model and a database, and finally building a REST back-end served by that database.
However, the front-end course was a completely different beast. The legacy one consisted of implementing the web application using vanilla PHP, with design patterns (and especially a lack thereof) that left a lot to be desired in terms of quality. So, without any useful guidance about how to organize their code, our students were doing the only thing they could: some delicious spaghetti intertwining everything —database access logic, business logic and presentation logic— everywhere.
