In this web development tutorial, we will look at just about every technology in web development. You'll see the future of Web Development and What You should learn to become a web developer in 2020Web Development in 2020: An Overview
The main goal of the video is to give you familiarity with some of the more mainstream web development tools available to web developers.
"I'm not trying to overwhelm you with technologies. These are just options that you have... There are a lot of technologies out there. When you hear something like Nuxt or Gatsby I want you to know what it is. And then you can choose if you want to learn it or not."
Brad starts by encouraging people to first ask what they want to do. Do you want to work on a product company? Or work as a consultant? Do you want to freelance? Or build a product of your own?
A lot of his advice about what to learn boils down to what your goals are. And he frames a lot of his tool suggestions in this light.
As a starting point, he recommends learning what he calls "The Necessities."
This slide and all subsequent slides come from Brad's video. The underlines indicate the tools he personally recommends.
One counter-intuitive thing he points out: you don't need a fancy computer for web development. "It's not like game engine development or something like that, so you can use a mid-range laptop or desktop, or even in some cases a lower-end computer."
He uses MacOS, Windows 10, and Linux for cloud servers and even for some of his media servers.
He is a big fan of VS Code for his editor, and uses Chrome and its built-in DevTools for browser-based debugging. This said, he thinks Firefox has come a long way as well and is a viable alternative.
He recommends starting with standard HTML and CSS, and learning newer CSS tools like Flexbox and Grid.
He says learning responsive web design in 2020 should be a given. "Every serious project that you create should look good and be completely usable on all devices."
Instead of relying on CSS frameworks like Bootstrap, he recommends you practice building your own modular CSS components that you can then re-use throughout your project.
This said, he says you may encounter these as you work on projects for different employers.
Bootstrap is still by far the most popular CSS framework, but there are a few other widely-used ones, too.
He specifically mentions Tailwind, which I hadn't heard of before. Tailwind is a bit different from other CSS frameworks. It's focused on "utility classes" that you can combine to accomplish what you want with the design.
Learning at a Practical Pace
Some of the fundamentals you should get good with. Brad has videos for most of these topics, and most of this is covered in the freeCodeCamp curriculum as well.
Throughout Brad's guide, he repeatedly emphasizes the need for practicality.
Yes - there are best practices for everything. But in many cases, there is a good enough way that will help you move faster and get more done, without getting mired in tools.
One of the most interesting (and perhaps heretical) things he says:
"There's no need to learn DevOps and AWS and all these things for a small site. A hosting site or a managed hosting site like InMotion or Hostgator is fine. It allows you to do [deployment] right in the browser. There's no need to overcomplicate things."
He argues that even in 2020, there's something to be said for using familiar tools.
For people new to web development, Brad recommends first getting to the point of being able to work as a basic front end web developer. This will allow you to build websites for local businesses as a freelancer.
"Hipsters will say you definitely need to use a front end framework. I don't think that is true. If you want to render templates on the server without using a front end framework, I think that's absolutely fine, but there are many many jobs that are looking for something like React or Vue."
But once you're ready to tackle front end frameworks, he recommends you explore React, Vue, and Angular. "Try all three and figure out which one you like the best."
He also gives a nod to Svelte - which isn't a framework, but rather a compiler. But he says it's probably too new to try and pick up in 2020.
And he discusses the increasing popularity of Server Side Rendering. File system-based routing means you don't have to create a complicated routing file. Instead, you can just put the files in the directory you want them to be in.
The two popular Server Side Rendering tools are Next.js (for React) and Nuxt.js (the Vue option).
Another emerging trend is Static Site Renders, which he says you don't need to learn but you should be aware of. For example, Gatsby sites are extremely fast and don't need a server.Back End Development Tools
A slide from Brad's talk with the most popular frameworks for each language.
For server side development frameworks, he recommends learning Express since it's the most popular and "it gives you a lot of freedom to build things how you want your own way."
He also uses Python for some projects, and recommends it as well.
"Python has two awesome frameworks. Django is a large, full featured framework, where as Flask is more minimalistic. It gives you what you need but you make the rest of the decisions. I honestly can't pick one of the two, I love them both and use them for different things."
And he's quick to come to the defense of PHP:
"A lot of people give crap to PHP and it's unfortunate because PHP can be a great language. It's practical and it's simple to deploy just about anywhere. PHP is great for freelancers that need to get stuff out quickly. If you're planning on working for a large company, PHP may not be the best choice, but if you're freelancing and building personal projects, PHP can be great choice. It's become cool to bash PHP. PHP was the first language I learned and I still really like it... If you look at Laravel code it's very elegant."
Brad also does a quick walkthrough of databases, and recommends perennial favorite PostgreSQL.Other Tools That are Probably Here to Stay
GraphQL is an alternative to REST for APIs. There are several courses that cover GraphQL on both Brad's channel and on freeCodeCamp's channel. But he says, "GraphQL is not something that you have to learn these days, but it's big enough that I think it's here to stay. It's more than a trend."
Brad also talks about Content Management Systems (CMS's) and how they are evolving into new "headless" options where you just use them as a back end and code your own front end.
"CMS's are very handy for freelancers who have clients that want to be able to log in and create their blog posts and stuff like that. A lot of people bash WordPress, but there's a huge percentage of websites on the internet that are run by WordPress and it's still very popular."
For webservers he prefers NGINX to Apache because "it seems to be less complicated." We use NGINX extensively at freeCodeCamp and I am inclined to agree.
Brad also explains how virtualization works, and talks about how it can simplify more complex projects by standardizing the environment across multiple computers. But he cautions against trying to virtualize everything:
"Docker is really good for teams. What I don't like is when people say you should always use Docker. It's just preference. If you just want to run a local LAMP server, there's nothing wrong with that. Don't feel pressure to learn something like Docker."
And he adds, to emphasize something I personally cannot emphasize enough: "I know a lot of nerdy types just want to overcomplicate things and I hate that. Just because I'm listing all of this doesn't mean I'm pushing it on you."
He's also quick to point out that most big companies have dedicated DevOps teams (also called "Site Reliability Engineers") who can do a lot of this for you.Nice To Have Skills You Can Learn as Specialties
His second choice for mobile app development is React Native, which is easy to pick up if you already know React.
Brad then does a great job of explaining what Progressive Web Apps are and some of the benefits of them. Here's the slide, but again, I strongly encourage you to watch his full video.
And then he gets to the big trends for 2020.Machine Learning and Web Assembly
Just because everyone else is talking about machine learning doesn't mean you have to drop everything and learn it. That's how he prefaces this stage of his talk.
It's clear from the way he talks about Web Assembly that he's pretty excited about it.
Rust is one of the languages you can use with WebAssembly (in addition to C and C++). It's significantly easier to learn and use than C and C++.
Born out of asm.js, a somewhat crazy concept dreamt up by Mozilla, WebAssembly was designed from the ground up as an efficient compilation target for the web. It promises smaller payloads, rapid parsing and validation, and consistent performance ... and it's ready to use, right now!
In this GraphQL and Serverless tutorial, you'll learn how to build Scalable APIs Using GraphQL and Serverless. Exploring Serverless API, we will have a look at the more advanced features and standards around mutators and resolvers and then she will close by going all in, full Serverless and deploy a GraphQL server to a function in the cloud.
Current trends in software and backend architecture have been evolving towards a more loosely coupled, more granular design. Most of you have heard of micro-service based architectures; the latest development in the past couple of years has been the advent of Serverless which allows you to run applications in very cost effective ephemeral services.
This is why it is important to have a proper gateway for your API that is able to route all your requests to the designated endpoint. GraphQL stands out in that respect as being a mature open sourced standard started at Facebook. Simona will demonstrate how to set up a GraphQL server locally, then explore the Query language and schema definitions it provides which allows you essentially query your mesh of services from a single point of entry.
The beauty is that it will notify you early if any of your endpoints is misbehaving or the schemas are out of date by erring out. Another advantage is that it allows for your API documentation to be a real time process and it will give you what one may call an API playground where you can query and explore your API. After exploring Serverless API, Simona will have a look at the more advanced features and standards around mutators and resolvers and then she will close by going all in, full Serverless and deploy a GraphQL server to a function in the cloud.