re: What would you teach a frontend beginner in 2020? VIEW POST

  • HTML: Elements, DOM
  • CSS: box model, specificity, cascading, variables, SCSS
  • JavaScript: let, const, prototype, function, object, array, class, Promise
  • Debugging with Dev Tools
  • Using a Linter
  • Git
  • Web Components: Shadow DOM, Custom Elements, template
  • XMLHttpRequest, fetch
  • Node.js: Express, REST API

Sounds good.

I wasn't sure if I should teach Git, these people should only be able to do some basic interaction work in the end, but using Git on your own (and not in a team) should be rather simple.


I think you could follow your instincts and probably forgo Git and use CodePen instead. You can still review the code for grading, there's immediate results for code, and the students don't have to try and learn one more thing on top of navigating the DOM for the first time. It'd be a different story if they might need Git later on, but I haven't met many designers who use Git daily.

I heard the same thing when I taught Front End Web Development at General Assembly. Beginners don’t need this, noobs don’t need that. Teach them jQuery they said. I’ve implemented a similar curriculum before and by the end of the class Designers were querying APIs. Don’t limit beginners. Everyone deserves to learn in a way that treats them like a professional engineer from Day 1. Giving students that level of respect goes a long way. It can make the difference in someone believing they can code or not.

Valid points, Steve. I agree that all beginners should be treated with a level of respect. My comment was only in the context of a single project that deals with an interactive prototype of a design within a larger course as a whole. I don't know what the rest of the curriculum will be, and I hope it does include Git because it is important to learn. However, if we're talking only about creating a prototype, it sounds like time would be better spent showing the students how they could utilize more sophisticated interactions through fun CSS tricks or a cool JS library like Three.js within their designs rather than showing them version control. It didn't seem necessary to me for a prototype project, but then I have never taught a web development nor a web design class ¯_(ツ)_/¯ Someday hopefully I will!

Oh it’s absolutely necessary. How is the designer supposed to later apply the knowledge they learned in the class to the task of developing a component library? A library they want to see proliferated across the org? Having them setup a dev environment, commit to Git and learn the basics of version control is critical to one of the main use cases a designer would want to learn how to code.

I think, I'll look deeper into codesandbox, they seem to have Git support.

Also, the idea of creating a component for others to use, seems like a good practice. I'll add this to the curriculum.

Thank you both very much for your insights.


to many things. Learn the theory is not usefull and they will forgot all of that.


This curriculum is not based in theory. If you want theory, go learn physics.

Dude is what I'm telling you. You can't learn all this stuff together, instead focus on building.

Yes, these concepts must be tied to practical lessons and in my courses they always are. I taught all of these concepts to complete noobs. They would learn the theory, I would demo the practical, they would follow up with a practical exercise that demonstrated their knowledge of the topic. By the end of the class students were building some sophisticated web apps. So you were saying?

Yea.. Sorry, I should have missed some posts in the discussion.
It seems very good man and I'm curious how long is the class?

12 weeks, met twice a week. I want to start it up again soon.


This is a very helpful outline, as I am going the self-taught route for web development. I appreciate all the help that I can discover.

code of conduct - report abuse