Skip to content
loading...
Cover image for What languages, frameworks, and libraries would you put on a front-end developer's 2020 "must learn" list?

What languages, frameworks, and libraries would you put on a front-end developer's 2020 "must learn" list?

nas5w profile image Nick Scialli (he/him) twitter logo github logo ・1 min read  

If you were advising someone getting into front-end development in 2020, what languages, frameworks, and libraries would you put on their "must learn" list?

twitter logo DISCUSS (21)
Discussion
markdown guide
 

Every developer working on the frontend should have the fundamentals of all these topics in some form or another by the time they hit the mid-level generally speaking.

Developers who come from a wholly JS or perhaps a backend role who complain about HTML, CSS and JS kind of irk me because usually it is a misunderstanding of how they work and the developers fault, not the language, which is fine since we all make mistakes but the fact that these languages are and for a long time have been ridiculed in many cases as "not real languages", etc gives an eminence of superiority to those who do the ridiculing and perpetuates a cycle of bad coding practices and repeated complaints over things that aren't that hard if you have the foundations in place using well defined best practices on the frontend.

Here is a highly recommended article on a related topic about the great divide among frontend developers.

Accessibility is a basic requirement by law in most countries and yet is fundamentally ignored by so many developers I have come across in almost 8 years of being a developer. Lately awareness, etc, is bringing attention to why that is a fallacy but for now it is a hugely prevalent issue in companies and projects large and small. Take the Web AIM 1,000,000 survey for example which shows the scale of problems, even topics like aria which are meant to make things better by giving developers a way to provide correct semantics to users with access needs are actually being misused and misunderstood so much that actually the results show that more errors are being made, not less! This is a travesty.

Laws, guidelines, standards, best-practices and frontend basics are all being regularly ignored and people are being left out and left behind because of it.

Are we not professionals? Should we not be learning the basics and building upon them instead of making arbitrary skill-maps? sure, use react but what benefit does it have? angular, sure but the same question... all of these ideas and comments are arbitrary and so opinionated even if not intended to be. Validation, value creation and reasoned steps are how technologies should be chosen on a context by context basis. Not personal non-objective ideation. Here is an interesting set of points and a talk about demanding professionalism in tech.

Learn HTML, CSS, JS, A11Y, testing and design fundamentals before anything else. Frameworks are irrelevant if you don't understand what they are built upon.

Sorry for the rant, I just feel it is so, so important to advocate for the fundamentals because they are often missing from many companies, people and places I have seen and known to date. We need to take things a bit more seriously and like any other profession, take a step back, get the fundamentals right and then use the frameworks and so on that abstract for us. If a mid-level to senior-level frontend developer (and this as happened before) tells me that they are very experienced with Angular and when I see the markup output being wholly against best practice and semantics totally ignored... I wonder how they can be a self-respecting frontend-developer, I really do. Same with CSS, something as simple as vertical alignment or some layout thing will eventually end in the ever-hilarious:

peter griffin css gif

But should that be the case? Layout is a css fundamental and just isn't that hard once you get the fundamentals down. As peter himself would say, professionals lacking fundamentals are what really grind my gears and naturally all of this is aimed at non-beginner devs.

peter griffin grinds my gears meme

Some notes on other peoples comments though since the post was advising for "someone getting into front-end development in 2020":

  • WASM is barely used so why learn it when getting into frontend?
  • TypeScript for frontend without advising to learn NPM/Node/Babel/etc first?
  • Rust? I mean sure you can do it and convert to WASM or use something like rocket but the community is small and the language is not built for the job, rust doesn't even have a native http module... you can build something akin to that as the docs show but can you imagine anyone doing that?
  • etc

Let's be sane about our recommendations and expand more than just a few points, not meaning to offend anyone, honestly, but hopefully those points make sense.

 

Can I bookmark your comment? Make it post 😅

 

Yes you can and I plan to turn this into a post in the coming days actually so watch this space!

 
  • React/Gatsby or Vue/Nuxt
  • GraphQL
  • TypeScript
  • WASM
  • Sass + Tailwind
  • Redux
 

Get back at the fundamentals, basically I wrote a blog post on this here: dev.to/alexandrudanpop/becoming-a-...

After fundamentals are solid try Typescript and maybe a JAMStack framework.

I personally would also look at Svelte because it's a different paradigm then what we have with React, Vue and Angular right now.

 
 
  • Before diving into frameworks, get comfortable with JavaScript.
  • React and Vue are a must for front-end frameworks. If you can learn TypeScript, it's nice too.
  • Gatsby is on the rise but I'm not sure you can find lots of opportunities are on the market with it as of today.
  • CSS-wise, Tailwind's also on the rise and is really good.
 

Must learn

  • CSS3/HTML5/ES6, obviously.
    • Particularly including AJAX and responsive design
  • Git, also obviously
  • At least one of React/Vue/Angular
  • TDD, or at least how to do testing in front-end.
  • Accessibility, including ARIA and semantic HTML
  • At least one state management library, such as Redux/MobX

Strongly recommend

  • Typescript
  • GraphQL
  • At least one CSS preprocessor, such as SASS/LESS
  • At least one method of organizing CSS, such as BEM/SMACSS, or CSS framework, such as Bootstrap/Tailwind
  • At least one method of styling framework components, such as styled-components.
  • WASM
  • Server-side rendering/generation, such as Gatsby/NuxtJS
 

Svelte, Dart, Lua.. (edit: Learn basic Lua but code in Moonscript)

 
  • HTML and DOM APIs, the latest versions
  • CSS, the latest version and techniques
  • JavaScript, the latest version
  • fundamentals of accessibility
  • fundamentals of HTTP (networking, caching, best practices)
  • Choose boring technology but still have a general idea of where the industry is going
 
 
 

I would have them learn JQuery, actually. So much of other learning will be based on JQuery since it was so popular for a long time.

 

We're still on jQuery where I work. It's sad. We tried moving to Vue and ran into difficulties.

 

:( Not surprising, sadly. It's really hard to migrate old code and is reallllyyyy expensive for the business. I don't think you are in the minority...

 

Currently im done with vue, vuex, mixin, axios
My next target is vue native and vue electron

Then mastering expressjs

 
  • React or Vue
  • Typescript
  • Dart | Flutter
  • Node.js | Nest.js
 
 
  • React/Vue
  • Tailwind
  • TypeScript
  • JAMStack
  • Jest/Cypress
  • Next
  • Webpack
 

Gatsby, React, JS and TS, Node for Web Dev

Go, Rust, WASM for compiler based

Classic DEV Post from Jul 26 '19

🎩 JavaScript Enhanced Scss mixins! 🎩 concepts explained

In the next post we are going to explore CSS @apply to supercharge what we talk about here....

Nick Scialli (he/him) profile image
Husband, dog dad, software engineer, coffee monster. Working in civic tech!