Application Developer

Authors
  • avatar
    Name
    Paul Bonnette
    Twitter

React full-stack applications

You have probably heard of React before. It's responsive and fast, making any website appear more like an application.

In fact this website is a React app.

React applications feature

  • Better performance - Files are pre-built wherever possible into static resources. This saves computing power for only important tasks where database interaction is truly necessary.
  • Higher security - Server-side processes are reduced to a small API of microservices, reducing the surface area for attacks.
  • Easier Scaling - Millions of connections per second are possible using various configuration of CDNs. This is an order of magnitude better than LAMP architecture.
  • Easier Development - Back-ends CMSs like WordPress™ can handle the heavy lifting of allowing users to edit the website while still serving mostly static content.

How does it work?

React applications are compiled from TypeScript into JavaScript. Most of the website becomes static content, meaning it no longe requires a server to build the files on-the-fly, as is the case with a PHP website.

So a CDN can deliver most of the website like static content. That's fast and cheap to host!

Any dynamic content uses JavaScript and is moved into APIs, which are scalable.

What is TypeScript?

TypeScript is a superset of Javascript, able to do more and catch bugs earlier through tighter type checking, which is the cause of most programming mistakes.

Most browsers don't run TypeScript. That's okay. TypeScript is transpiled into Javascript before being packaged up for release. All your customers know when they run your application is that it works.

There is a lot going on

This is oversimplified. There is a lot going on.

React updates the browser's DOM on-the-fly giving you very fast page refreshes. This is because the page does not need to refresh, just re-draw.

Other technologies

Next.js is a big part of the SEO and Image optimization magic.

It all works together to deliver a full-stack application.

Benefits to Google Insights Score

You may have noticed it is very difficult to get a high score on Google Insights. Yet in my experience Jamstack websites score extremely high. This is due to a number of factors but the largest factor is Jamstack technology. It allows you to super-optimize your user experience as well as other factors which Google takes into account when rating your website.

Experience

I consider myself to be an intermediate level React developer. I've been programming in Javascript for 20 years and the superset, TypeScript, for a few years now. This website is built in React using Next.js and a few other technologies to make it fly.