Best 5 Frontend Development Topics in 2019

Ah, a new year. A time of positivity, a time to restart. For new objectives and proposals. And in the world of developers, to look at the scenery and decide what we need to learn to keep up. Because let's face it-web development is always changing, and we're falling behind if we don't constantly learn.

Because things change so quickly, it is important not to be overwhelmed to decide what to focus on.

The main idea is to start with subjects we are interested in learning about, which will give us some impetus in future learning, and where we can be paid to take it or where there is a clear market for skills.

Just below, we actually apply the frameworks based on what we see in the web development right now and suggest some great resources from each area.

For each topic, we provided a range of free and paid resources. As an FYI, some of the paid resources use affiliate links, but we have done our best to ensure that we have free options throughout.

1. TypeScript

TypeScript was one of 2018's most amazing growth stories. A surprising 46 percent of npm users used TypeScript found in the npm survey. It is now not only the default Angular language but also a commonly used React option and an increasingly used Vue option.

Vue 3 has been announced in TypeScript, and the Node.js creator is working on a new node - like project that is TypeScript first. Now that Babel supports TypeScript, you may not even have to change your build system.

So if you were a holdout (like us), 2019 is definitely the year to learn TypeScript. It has momentum, an increasing number of jobs requiring it, and the way the JavaScript ecosystem moves is quite clearly.

Resources and Articles

• Learn TypeScript in 5 minutes. A great quick start to TypeScript.
• TypeScript Deep Dive. An entire book, freely available online.
• TalkScript. For those who like podcasts, this is a good one on TypeScript by the developers at Sitepen.

Free course

• Want to learn TypeScript? Here’s our free 22-part course. This is a post about the course that includes an overview of topics covered. The course itself is on Scrimba.

Paid course

• Understanding TypeScript. The top-rated course on TypeScript on Udemy, by one of my favorite instructors Maximilian Schwarzmüller.

2. React

React is old news for many of you, but for two reasons we are putting it high on the list again.

First - it definitely still wins the games "money" and "momentum." There are more jobs and contract gigs in the front-end world to React than anything else, so if you haven't picked it up, you should definitely.

Second - It continues to change, and some new features (especially hooks, but also things like the context api) promise to completely change the way we write react code, so even if you're already using React, you should brush it up.

Resources and Articles

• The React Handbook. an 80/20 introduction to React on the Freecodecamp blog, aimed at giving you a fast-path start to being productive in React.
• Hooks at a Glance. The hooks documentation for those already comfortable in React; probably the best place to learn hooks.
• Full Stack React. Both a blog and a newsletter with great in-depth React articles
• The React Podcast. If you’re into podcasts, this one by Michael Chan AKA Chantastic is great.

Free Course

• Start Learning React. The most comprehensive free course I’ve found on React. Very beginner focused.

Paid Courses

• Modern React with Redux [2019 Update]. The React course we took when we were getting started with React, updated with new content to handle the latest and greatest features.
• React 16.6 - The Complete Guide (incl. React Router & Redux). React course by Maximilian Schwarzmüller.

3. Vue

Vue.js is our current favorite framework, the framework that most developers have said they want to learn in JavaScript surveys in 2018 and 2017, and it only continues to improve.

Free Resources

• The Vue Guide. The Vue docs are phenomenal, and a great way to learn.
• Vuejsdevelopers.com both a blog and a weekly newsletter highlighting deep in-depth articles.
• Vue Feed, a website, newsletter, and twitter feed highlighting curated Vue news, tutorials, plugins, and more.

Free Courses

• Learn Vue 2 Step By Step (Laracasts). A great introductory course.
• Intro to Vue.JS (VueMastery). This is a shorter course than the one above. You get the lesson in the text as well, download any of the resources used, and participate with CodePen based exercises.

Paid Courses

• Vue JS 2 - The Complete Guide (incl. Vue Router & Vuex).

4. CSS Grid

For almost any audience you may be trying to address, CSS Grid has reached critical mass across browsers and is an amazing step forward from previous layout technologies.

If you still use heavyweight grid frames from UI toolkits such as Bootstrap or Foundation, you fall back. With less markup and complexity, CSS Grid gives you more power.

The only barrier is learning. So if you’re still a holdout, make this the year you learn CSS Grid.

Free Resources

• A Beginner’s Guide to CSS Grid | Free Code Camp. A Great, simple, and very visual step by step guide to CSS Grid.
• A Complete Guide to Grid | CSS Tricks One of the most thorough online resources available for CSS Grid, shows all of the grid related properties, their potential values, and visual demonstrations of what all of those values do.
• Best Practices With CSS Grid Layout | Smashing Magazine CSS Grid has been around and being used long enough that we’re starting to see some best practices congeal. Rachel Andrew goes through a set of them, informed both by her own experience and a survey of developers using grid.
• Another Collection of Interesting Facts About CSS Grid | CSS Tricks A set of lessons learned on how to use CSS Grid, some of the shorthand properties, and ways to handle explicit and implicit rows and columns. Filled with codepen-based examples, so you can dig in and tinker with the code to your heart’s content.
• Grid By Example. A set of curated CSS Grid examples.
• CSS Grid Garden. A great game-based learning tool.

Free Course

• CSS Grid | Wes Bos. Great intro course, taught by Wes Bos and sponsored by Firefox so completely free.

Paid Courses

• CSS Essentials: Getting Started with CSS Grid.
• Ultimate CSS Grid Course: From Beginner to Advanced. The most comprehensive course I could find that focused exclusively on CSS Grid

5. GraphQL

One of the big upcoming things is GraphQL, and I think 2019 may be the year it really starts hitting the mainstream.

Of course, there has been a lot of buzzes, especially in the reacting ecosystem, but the data from npm shows that buzz is also growing extremely quickly.

We are not sure how many jobs GraphQL requires yet, so this may not be an immediate money maker, but learning from a motivation and momentum point of view will now put you in a very good position for the future.

Free Resources

• GraphQL.org Docs. The official documentation here seems pretty good.
• The Road to GraphQL. A free book (though does require email signup), along with the option of a paid upgrade that gives you a bunch of starter templates and related.
• GraphQL Weekly. A weekly newsletter roundup of GraphQL related articles

Free Courses

• How To GraphQL. Free and open source, a combination of video and written tutorials.

Paid Courses

Depending on your frontend framework:

• GraphQL with React: The Complete Developers Guide
• GraphQL with Angular & Apollo - The Full-stack Guide
• Full-Stack Vue with GraphQL - The Ultimate Guide

Framework independent (but focused on backend)

• The Modern GraphQL Bootcamp

Business vector created by freepik - www.freepik.com

Janeth Kent

Licenciada en Bellas Artes y programadora por pasión. Cuando tengo un rato retoco fotos, edito vídeos y diseño cosas. El resto del tiempo escribo en MA-NO WEB DESIGN AND DEVELOPMENT.