Technology is quickly changing and how we build websites are no exception to that. JavaScript is taking over the front-end world, and things like serverless are becoming very popular on the backend. So, what are the popular ways of building websites in 2021?
WordPress
WordPress is still the king of the Internet. The majority of websites still run on WordPress and there are several reasons for that.
I am a full-stack web developer, yet I still operate a lot of WordPress websites. The biggest strength of WordPress in my opinion is convenience. It’s still the fastest way to sign up to Bluehost, install a WordPress with a one-click installer and I am online.
That works for most small-scale websites, but it doesn’t really take into account modern web development workflows. Don’t get me wrong. For a casual blog it’s fine to spin up WP and start writing. However, for a web application website, you need a lot more than that.
Automated backups give you a safety net even if you don’t test things before you put them on your website (like plugins and themes). They can ruin your website in an instant, yet I am guilty of it too. With automated regular backups, you can somewhat be sure that whatever goes wrong on your live website, you can always go back to a previous version.
There is also a huge community around WordPress. That means a lot of free themes and plugins are available just one click away.
All this is true for most of the other content management websites, like Joomla, Drupal and the rest.
Site Builders
There are a lot of paid website builders. You pay a monthly fee and you get a stable website that can be easily updated (usually drag and drop).
The obvious advantage of this setup is that you can have something up just as fast as with WordPress. The downsides are that most of what is generated by these builders are not well optimized. Your SEO may suffer, speed may be slower. You are also locked in to the service, which means that you cannot easily move your content if you decide to move somewhere else later.
Static Sites (Jamstack)
Static site generators are living their renaissance. The most notable ones are Gatsby and Nextjs (both are React-based, more on that later).
What are static sites, you might ask?
Static sites are what the name suggests, static html and JavaScript sites.
Wait, aren’t those out of fashion? Wouldn’t it be too hard to update them?
Not really. You can still use a CMS or write your content in Markdown. When you are done, you simply run a generator script that goes through your content and creates a static website out of it.
The result is a very fast website. Depending on the static site builder you use, you may get single page application functionality, which means that the site doesn’t refresh, but only certain parts of the document are exchanged to the new data.
You don’t need a traditional web server for static sites. You can upload it to any CDN and it’s good to go.
Single Page Applications on the Frontend
The web is dynamic and contrary to the title of this section, we don’t have to settle for only one page. What it really means is that at the first load and html file and a bunch of JavaScript is downloaded. Then for all successive requests the JavaScript part of the website will reach out to a web API to request new data. When the data arrives, it updates the data without reloading the whole page.
The advantages of this setup is that the website will feel more like a native application. It can show new data without apparent reloading or waiting (depending on the speed of your API).
The most well-known frontend frameworks are React, Vue, Angular and Svelte.
Headless CMS on the Backend
With single page apps and static sites are gaining popularity, the backend has to keep up. A relatively new trend is using headless content management systems.
A headless CMS provides a nice content editing user interface and an API where the content can be accessed.
The advantage of this setup is that the frontend and the backend are not closely coupled. One developer can work on the frontend without changing anything on the backend. The frontend can be easily swapped out if needed.
There are many paid headless CMS-es, but there are also some free ones. Since WordPress has a REST API, it can also be used as a headless CMS. In the JavaScript world, Strapi is the most prominent one.
GraphQL Instead of REST
If all you have ever used is WordPress, your head may be spinning of all the information. And I still have some more.
REST APIs have been pretty much the standard for years, but recently GraphQL is taking over.
GraphQL was created by Facebook as a solution to the challenges they faced with their massive scale.
Instead of using http methods for CRUD operations, you only use the POST method and you can ask for the shape of your data in one request, even if the data is nested. This results in fewer requests and even more flexibility on the frontend.
No-SQL Databases
Relational databases for storing data have been the standard for decades. In recent years document databases are gaining popularity.
Relational databases are the SQL databases that we all know. WordPress is using MySQL for storing data, but PostgreSQL, Oracle, and Microsoft’s SQL Server are all relational database management systems.
The new kid on the block is MongoDB. You don’t have to set up complicated relationships between tables. Data is stored in JSON format.
The advantages of this is that you can move fast, the shape of your data can change a lot without causing much headache on the database side. The downside is that data integrity may suffer, along with losing some of the guarantees that an RDBMS can offer.