Working in the world of development can be a bit confusing, with lots of trends coming up to interrupt our normal lives and give us a bad case of FOMO. We‘re mostly stuck between learning, relearning and unlearning. Sometimes the new trends are not different from technologies we’ve already been using, other times, it will change your life or in this case, your stack.
In this article, we will be looking at the JAMstack and how it has come to make a huge difference in the way we build web platforms. We will be exploring how this approach to simplifying the technology stack can lead to shorter development times, with better performance and greater security.
We have conventionally built web sites and web apps by setting up servers to help interact with a database and yes, that worked, but also we’d have to spend a lot of time worrying about performance and setting up these facilities. Security protocols for these platforms also cost a lot and since we have information moving from the server side to the client side, platforms may be prone to security risks.
It’s not a bird, it’s not a plane …… no, it’s not Superman. JAMstack (JavaScript, API & Markdown) is a new way of building websites and apps that delivers better performance, higher security, lower cost of scaling, and better developer experience. It achieves this by keeping most of the functionality on the client side and abstracting all other functionalities to 3rd party API’s. Basically, all the heavy lifting is done by the API’s.
With the emphasis on web performance and great user experience, a few trends emerged:
The above trends developed independently until JAMstack came and unified them. And now that JAMStack is here, people are starting to pull away from servers. At the same time, they are running after speed, optimization, and snappy websites.
Everyday the line between frontend and backend keeps getting blurry
— Christian Nwamba (@codebeast) May 30, 2019
Before we go further into discussing how JAMstack achieves its awesomeness, let’s take a look at the other stacks and how they work, to help better appreciate the JAMstack. Before its existence developers used different tools to set up web platforms and apps as such.
LAMP represents the foundation of a Linux hosted website. LAMP stacks are comprised of, a Linux operating system (L), an Apache Web Server (A), a MySQL database layer (M) and a PHP scripting layer (P). The major problem with this stack is that it has a learning curve. This increases the amount of time to set up a functional app and this can eventually lead to performance issues on applications with simultaneous users, as well as security issues.
The stack is comprised of a MongoDB (M) document database, Express.js (E) which is a back-end web application framework, Angular.js (A) which is a front-end web application framework, and Node.js (N), a JavaScript run-time environment. Platforms are built in JavaScript from start to finish here and it is really recommended for large, non-relational data set, the only set back here is that everything is done in just JavaScript.
The stack is comprised of a MongoDB (M) document database, Express.js (E) which is a back-end web application framework, React (R) which is a JavaScript library for building user interfaces and Node.js (N), a JavaScript run time environment. Again platforms are built in JavaScript from start to finish and the only set back here is that everything is done in just JavaScript.
You might be wondering why you need to use another stack. Well, I have five reasons you should be using JAMstack:
Another great feature to consider is the ability to integrate core dynamic functionalities into JAMstack websites. This technology has the ability to handle dynamic server-side features, handling back-end functions with tools like Serverless. Form handling with Formspree or Netlify Forms. Full Search capability Google Search, lunr.js and Algolia, Handle optimal image delivery with Cloudinary. All you have to do is plug and play.
In this article, we have established the advantages of using JAMstack in developing modern web platforms. I would strongly recommend learning more about JAMstack and building faster platforms seamlessly.
Install LogRocket via npm or script tag. LogRocket.init() must be called client-side, not
server-side
$ npm i --save logrocket
// Code:
import LogRocket from 'logrocket';
LogRocket.init('app/id');
// Add to your HTML:
<script src="https://cdn.lr-ingest.com/LogRocket.min.js"></script>
<script>window.LogRocket && window.LogRocket.init('app/id');</script>
Would you be interested in joining LogRocket's developer community?
Join LogRocket’s Content Advisory Board. You’ll help inform the type of content we create and get access to exclusive meetups, social accreditation, and swag.
Sign up now
Use Lynx.js to build cross-platform web and mobile apps, addressing layout, navigation, and performance challenges for consistent UX.
Streamline your PDF report workflow using React and .NET. Walk through a real-world example and discover cloud-based alternatives.
Explore the MUI Grid system in depth, including updates from MUI v5, and learn how to build responsive grid layouts.
Build a progressive web app using Rust, WebAssembly, SurrealDB, and Nostr with local encryption and fast storage.
