avatarChris, PhD

Free AI web copilot to create summaries, insights and extended knowledge, download it at here

4700

Abstract

">Spring Boot</a></p><blockquote id="307e"><p>„Spring® makes programming Java quicker, easier, and safer for everybody. Spring’s focus on speed, simplicity, and productivity has made it the world’s most popular <b>Java framework</b>.“ <i>according to the official statement by the developers of <a href="https://spring.io/why-spring">spring.io</a> (VMware)</i></p></blockquote><p id="6d6c">We can only agree with this statement: Java is an enterprise-level programming language, and the Spring framework makes development much more efficient and fun. Spring Boot — on top of it — is a popular extension of Spring that <a href="https://readmedium.com/from-zero-to-lil-hero-your-first-production-grade-api-with-spring-boot-in-60-minutes-8046cb7a966e">simplifies and accelerates the deployment of Java-based web apps</a> and microservices thanks to its integrated servlet container.</p><p id="2ce2"><b>Backend — Data: </b>Here, we use MySQL as a database as often as possible because we are convinced of its <a href="https://ewuranna.medium.com/mongodb-vs-postgresql-vs-mysql-which-database-is-right-for-you-5ef421a40192">simplicity and performance</a>. Of course, there are clients who have or prefer a different (often proprietary) database or, in rare cases, want to switch to a NoSQL database. None of this is decisive — so, that you can be flexible in this respect.</p><p id="67ad">Some interesting choices, we made in the past:</p><ul><li>Geolocation-based app: Postgres with PostGIS extension</li><li>Database distribution (high write throughput): Cassandra</li><li>Sensor data apps (IoT context, write performance): MongoDB</li></ul><p id="25f7"><b>Infrastructure: </b>While we self-host many projects on our own servers or sometimes at AWS EC2 or VMs/dedicated servers from other hosting providers, or they are hosted in the company by our clients, we still often rely on AWS for DevOps for its stability. Concretely, we use AWS Pipeline (CI/CD pipeline): CodeCommit — CodeBuild — CodeDeploy.</p><p id="18a4">Let’s summarise it.</p><p id="2800">This tech stack is perfect for SaaS or dashboard applications with several hundred to tens or even hundreds of thousands of users — and honestly, most of our clients are either just getting started, or it is absolutely fine for their project goals. Self-hosting is also in most cases not an issue.</p><h1 id="cea1">Discussing our tech stack</h1><p id="2784">Our main aspects as a web agency are the development and economic efforts, which are relatively low — compared to other tech stacks — while having high stability and reliability for the enterprise level.</p><p id="0232">In particular, both React and Spring Boot offer a variety of building blocks to quickly develop ready-to-use apps. So, there is a library for virtually everything, and you don’t have to reinvent the wheel. This dramatically shortens the development time.</p><p id="8706">The hosting costs are also low, as you can self-host it very easily and stably. However, Spring Boot as a Java framework requires more resources than other programming languages — scaling is an issue here.</p><p id="6e77">On the other hand, there is no server-side UI rendering, as React is characterized by client-side rendering, i.e., the workload is moved to the end users’ devices.</p><p id="66b8">The learning curve for new developers is also moderate. Bootstrap (as the ‘de-facto standard’ in CSS) and Java (as an object-oriented programming language) can be learned quickly, as it is really intuitive. React has a longer learning curve than other HTML/JS frameworks, but it’s worth the effort, as you can easily and fast target multiple platforms (Web, Android, iOS). MySQL is also very easy to use, and you can quickly find your way around.</p><p id="b90e">The same is true for AWS: Once understood, you can quickly set up stable and scalable hosting or DevOps and CI/CD pipelines without a lot of configuration work.</p><p id="bed6">The tech stack, or more specifically, all frameworks in this article are successfully used and tested by the biggest companies in the world — all having a large and strong community as well.</p><p id="0a4f">However, this tech stack also comes with disadvantages:</p><p id="728c">Spring Boot is well suited for starting a project, but is expensive to scale, e.g., to hundreds of thousands of users. If this is not the short- or medium-term goal anyway, this cons does not apply.</p><p id="b5cd">React is suboptimal for SEO-required landing pages, as it renders the website at runtime on the client, i.e., the Google crawler has to use additional resources (JavaScript engine) for indexing — as a result, <a href="https://developers.google.com/search/docs/craw

Options

ling-indexing/javascript/javascript-seo-basics">SEO takes longer</a>.</p><p id="89e3">…but don’t worry, we have developed a special procedure for both cons, as I elaborate below.</p><h1 id="490f">The ‘high scalability’ exception</h1><p id="e155">Even we make one exception, namely when it comes to high scalability for millions (!) of users.</p><p id="64ec">In this case, self-hosting is absolutely no longer viable for us, and we rely on (AWS) cloud resources only.</p><p id="a57e">The tech stack then turns into the following:</p><blockquote id="4d2e"><p>Our ‘high scalability’ tech stack:</p></blockquote><blockquote id="a389"><p><b>Bootstrap — React / React Native (CloudFront, S3) —nodeJs (Lambda) — (DynamoDB, RDS) — AWS DevOps</b></p></blockquote><p id="65b8">Let me explain.</p><p id="9156">Targeting this number of users typically involves a worldwide audience. This, in turn, means that you will have an issue with latency (slow loading times), depending on where the user is located in the world. So, we also switch to CloudFront — an ‘out-of-the-box’ content-delivery network (CDN) — and S3 for cost-effective file storage and provisioning of the frontend files (e.g., HTML, JS/ React, CSS, assets).</p><p id="aa4b">Spring Boot scales (as <a href="https://readmedium.com/decoding-netflix-an-in-depth-look-at-the-tech-stack-powering-the-streaming-giant-b0e3c0931ec5">Netflix & Co. show</a>) but requires a comparatively large amount of resources, which is obviously not economically attractive for us anymore. So, in such cases, we go for nodeJs, as like Python, it has a very low startup time and is, therefore, perfectly suited for the use of Lambda functions (event-driven, server-less compute units for running code without having to manage a server). Reaching these functions from out, we use API Gateway to define the API endpoints.</p><p id="8f3a">As SQL databases in AWS are very expensive (starting typically at $1k+ for a very small one) due to backup and administration, we often — if feasible within the project — go for NoSQL databases (DynamoDB or DocumentDB).</p><p id="1cbf">The development effort is higher for this tech stack, but it scales easily on-demand and with less (‘own’) administrative effort.</p><h1 id="6440">A few words on CMS</h1><p id="3e67">As React is terrible in terms of SEO, we use static (pre-rendered) web pages when it comes to landing pages only. Everything behind an access area, such as the dashboard or the actual SaaS app, is in terms of SEO irrelevant.</p><p id="08b7">If the website is to become more comprehensive (e.g., integrating a blog), we rely on a headless CMS such as <a href="https://strapi.io/">Strapi</a> to generate ‘static’ web pages. This not only has SEO advantages but these pages are all characterized by <a href="https://pagespeed.web.dev/">extremely low loading times</a>.</p><p id="5577"><i>Note: Of course, there are other valid tech stacks that can be used, but these also come with one or the other disadvantages (red flags) that we at least are not willing to accept.</i></p><p id="558f">Which tech stack do you use and why? Please share your experience with us in the comments below.</p><p id="cb0c">Some of my other related well-performing stories:</p><ol><li><a href="https://readmedium.com/start-your-6-figures-high-priced-web-agency-within-one-year-realistic-or-utopian-d4fcf60df5c5">Start Your 6-figure High-Priced Web Agency Within One Year — Realistic or Utopian?</a></li><li><a href="https://readmedium.com/from-zero-to-lil-hero-your-first-production-grade-api-with-spring-boot-in-60-minutes-8046cb7a966e">From Zero to Lil’ Hero: Your First Production-grade API With Spring Boot 3 in 60 Minutes</a></li><li><a href="https://baos.pub/the-one-thing-10x-boost-your-productivity-e14a12cd05a8">The ONE Thing — 10X Boost Your Productivity</a></li><li><a href="https://readmedium.com/the-20-lessons-i-learned-in-2023-do-better-than-me-next-year-i-will-42fff5dfa592">The 20 Lessons I Learned in 2023 — Do Better Than Me Next Year</a></li><li><a href="https://readmedium.com/how-i-started-my-full-time-business-life-and-how-you-can-do-the-same-64342d714e5f">How I Started My Full-time Business Life With 10X — And How You Can Do the Same.</a></li></ol><p id="d878"><b>Sign up for our <a href="https://medium.com/next-level-coding/newsletters/the-next-level-coding-newsletter">tech newsletter</a> (Spring Boot, Web agency, SaaS apps, Courses), and join many other enthusiastic coders in <a href="https://medium.com/next-level-coding">our community</a>.</b></p><p id="b057"><b>HAPPY READING, HAPPY CODING!</b></p><p id="95d7">Follow to get more: <a href="undefined">Coders by thebootcode.io</a></p></article></body>

Tech What? THE Tech Stack We Use for All Our $10k-100k Enterprise-level Projects — and Why This One?

One tech stack with the best pros/cons ratio has crystallized out in all our hundreds of client projects.

Photo by Jeremy Thomas on Unsplash

Tech stack: Definition

A tech stack is a set of technologies — including programming languages, frameworks, databases, tools, and APIs — to develop an application (in our case a web-based or web app).

The choice of tech stack can affect various things:

  • performance (e.g., page loading times)
  • developing effort
  • SEO — search engine optimization (!)
  • economic costs (e.g., hosting)
  • stability and reliability
  • skill set required
  • …and many more (minor or individual) factors

Later in this article, we will discuss these points in more detail using the example of our tech stack — but first, let’s take a look at what a web tech stack consists of.

Layers of a web tech stack

For the sake of not making things unnecessarily complicated, we will limit this to three layers of a web app:

  • frontend (UI)
  • backend (logic/API + data)
  • infrastructure (hosting + DevOps)

The frontend is everything that runs on the end user’s device, and with which the user interacts (also called UI).

The backend is everything that runs on the server, such as the logic and the data storage. The API running on the backend is the endpoint or interface through which the front end interacts with the backend.

The infrastructure is everything that makes the frontend available to the user and on which the backend runs (so-called hosting of the web app). DevOps is a special area there, which is a methodology in software development, that enables an automated deployment process.

So, after these numerous definitions, let’s move on to our tech stack, which we use in over 90% of our clients’ projects.

Our preferred tech stack

First of all, over the last 15–20 years we together (me and my team) have completed in total easily over hundreds of small to large projects for small to large companies in various dev teams of different sizes and skill sets.

This means that we have already seen and tried out a large number of tech stacks, including the latest trends that we always ‘test’ directly.

So, the following tech stack has crystallized for us:

…drum rolls….and the winner is…

Our ‘default’ tech stack:

Bootstrap — React / React Native — Spring Boot — (MySQL) — AWS DevOps

Our preferred tech stack

Frontend —UI: As one frontend framework, we use IMO the ‘de-facto standard’ of the CSS frameworks, namely Bootstrap (originally developed by Twitter). It is modular, customizable, and responsive (i.e., compatible with different screen sizes). In addition, there exist many nice-looking themes that can and should be used.

As HTML/JS framework, we often use React for web apps and React Native — a cross-platform framework — for mobile apps (Android and iOS), which are also highly compatible with each other. With both, you write the UI in JavaScript, which is then rendered for the target platform. React is used in thousands of well-known apps, such as Facebook (originally released by them), Instagram, Netflix, New York Times, Dropbox, Outlook, Skype, Shopify, Tesla, Pinterest, NFL, and many more.

Backend — Logic/API: Spring Boot

„Spring® makes programming Java quicker, easier, and safer for everybody. Spring’s focus on speed, simplicity, and productivity has made it the world’s most popular Java framework.“ according to the official statement by the developers of spring.io (VMware)

We can only agree with this statement: Java is an enterprise-level programming language, and the Spring framework makes development much more efficient and fun. Spring Boot — on top of it — is a popular extension of Spring that simplifies and accelerates the deployment of Java-based web apps and microservices thanks to its integrated servlet container.

Backend — Data: Here, we use MySQL as a database as often as possible because we are convinced of its simplicity and performance. Of course, there are clients who have or prefer a different (often proprietary) database or, in rare cases, want to switch to a NoSQL database. None of this is decisive — so, that you can be flexible in this respect.

Some interesting choices, we made in the past:

  • Geolocation-based app: Postgres with PostGIS extension
  • Database distribution (high write throughput): Cassandra
  • Sensor data apps (IoT context, write performance): MongoDB

Infrastructure: While we self-host many projects on our own servers or sometimes at AWS EC2 or VMs/dedicated servers from other hosting providers, or they are hosted in the company by our clients, we still often rely on AWS for DevOps for its stability. Concretely, we use AWS Pipeline (CI/CD pipeline): CodeCommit — CodeBuild — CodeDeploy.

Let’s summarise it.

This tech stack is perfect for SaaS or dashboard applications with several hundred to tens or even hundreds of thousands of users — and honestly, most of our clients are either just getting started, or it is absolutely fine for their project goals. Self-hosting is also in most cases not an issue.

Discussing our tech stack

Our main aspects as a web agency are the development and economic efforts, which are relatively low — compared to other tech stacks — while having high stability and reliability for the enterprise level.

In particular, both React and Spring Boot offer a variety of building blocks to quickly develop ready-to-use apps. So, there is a library for virtually everything, and you don’t have to reinvent the wheel. This dramatically shortens the development time.

The hosting costs are also low, as you can self-host it very easily and stably. However, Spring Boot as a Java framework requires more resources than other programming languages — scaling is an issue here.

On the other hand, there is no server-side UI rendering, as React is characterized by client-side rendering, i.e., the workload is moved to the end users’ devices.

The learning curve for new developers is also moderate. Bootstrap (as the ‘de-facto standard’ in CSS) and Java (as an object-oriented programming language) can be learned quickly, as it is really intuitive. React has a longer learning curve than other HTML/JS frameworks, but it’s worth the effort, as you can easily and fast target multiple platforms (Web, Android, iOS). MySQL is also very easy to use, and you can quickly find your way around.

The same is true for AWS: Once understood, you can quickly set up stable and scalable hosting or DevOps and CI/CD pipelines without a lot of configuration work.

The tech stack, or more specifically, all frameworks in this article are successfully used and tested by the biggest companies in the world — all having a large and strong community as well.

However, this tech stack also comes with disadvantages:

Spring Boot is well suited for starting a project, but is expensive to scale, e.g., to hundreds of thousands of users. If this is not the short- or medium-term goal anyway, this cons does not apply.

React is suboptimal for SEO-required landing pages, as it renders the website at runtime on the client, i.e., the Google crawler has to use additional resources (JavaScript engine) for indexing — as a result, SEO takes longer.

…but don’t worry, we have developed a special procedure for both cons, as I elaborate below.

The ‘high scalability’ exception

Even we make one exception, namely when it comes to high scalability for millions (!) of users.

In this case, self-hosting is absolutely no longer viable for us, and we rely on (AWS) cloud resources only.

The tech stack then turns into the following:

Our ‘high scalability’ tech stack:

Bootstrap — React / React Native (CloudFront, S3) —nodeJs (Lambda) — (DynamoDB, RDS) — AWS DevOps

Let me explain.

Targeting this number of users typically involves a worldwide audience. This, in turn, means that you will have an issue with latency (slow loading times), depending on where the user is located in the world. So, we also switch to CloudFront — an ‘out-of-the-box’ content-delivery network (CDN) — and S3 for cost-effective file storage and provisioning of the frontend files (e.g., HTML, JS/ React, CSS, assets).

Spring Boot scales (as Netflix & Co. show) but requires a comparatively large amount of resources, which is obviously not economically attractive for us anymore. So, in such cases, we go for nodeJs, as like Python, it has a very low startup time and is, therefore, perfectly suited for the use of Lambda functions (event-driven, server-less compute units for running code without having to manage a server). Reaching these functions from out, we use API Gateway to define the API endpoints.

As SQL databases in AWS are very expensive (starting typically at $1k+ for a very small one) due to backup and administration, we often — if feasible within the project — go for NoSQL databases (DynamoDB or DocumentDB).

The development effort is higher for this tech stack, but it scales easily on-demand and with less (‘own’) administrative effort.

A few words on CMS

As React is terrible in terms of SEO, we use static (pre-rendered) web pages when it comes to landing pages only. Everything behind an access area, such as the dashboard or the actual SaaS app, is in terms of SEO irrelevant.

If the website is to become more comprehensive (e.g., integrating a blog), we rely on a headless CMS such as Strapi to generate ‘static’ web pages. This not only has SEO advantages but these pages are all characterized by extremely low loading times.

Note: Of course, there are other valid tech stacks that can be used, but these also come with one or the other disadvantages (red flags) that we at least are not willing to accept.

Which tech stack do you use and why? Please share your experience with us in the comments below.

Some of my other related well-performing stories:

  1. Start Your 6-figure High-Priced Web Agency Within One Year — Realistic or Utopian?
  2. From Zero to Lil’ Hero: Your First Production-grade API With Spring Boot 3 in 60 Minutes
  3. The ONE Thing — 10X Boost Your Productivity
  4. The 20 Lessons I Learned in 2023 — Do Better Than Me Next Year
  5. How I Started My Full-time Business Life With 10X — And How You Can Do the Same.

Sign up for our tech newsletter (Spring Boot, Web agency, SaaS apps, Courses), and join many other enthusiastic coders in our community.

HAPPY READING, HAPPY CODING!

Follow to get more: Coders by thebootcode.io

Spring Boot
Technology
Tech Stack
React
Enterprise Technology
Recommended from ReadMedium