milanwittpohl.com

I am Milan Wittpohl, deeply passionate about digital products, currently at ORBIT as Junior Technologist.

Why did I publish this tutorial?

Programming fascinates me and I love to learn new frameworks, languages, patterns and so on. However, I tend to fool myself that I have understood something without fully understanding it. I guess I'm just too impatient. But, if I write about what I have learned, my knowledge gaps are revealed and force me to understand it. This article is about something I learned.

I am still learning

Please keep in mind that I am constantly learning. I would not consider myself an expert in any of the topics covered here. I'm simply trying my best. If you find any mistakes (content- or language-related) please contact me via twitter, instagram, or send me an email, thanks.

milanwittpohl.com

I am Milan Wittpohl, deeply passionate about digital products, currently at ORBIT as Junior Technologist.

About this series

In this series, I want to build a modern, extensible, yet simple set up that allows me to quickly build and deploy a web-frontend, -backend and database. From an educational point of view, my main goals with this series are

  • to get a deeper understanding of how to build and deploy applications
  • to have at least a basic knowledge of every single component that is involved
  • to have a playground that wasn't hacked in a quick and dirty way and I can use for future projects

What are we going to build

While this project functions as a template for future projects, we still need some sort of goal. This is why we will create the simplest todo-app ever. Todo-apps are a good use case as it is simple but still covers most aspects of a modern application. We will have to:

  • connect a database to store todos
  • work with that database by reading, creating, updating and deleting entries
  • create a backend that exposes a REST-API for our frontend
  • secure our backend properly
  • build a frontend that works well with data from an API

There are several ways to build this modern web-application. I chose the following frameworks, each of which is covered in one tutorial:

  • Part I: The Backend Using Java With Spring
  • Part II: The server-side-rendered Frontend Using VueJS And NUXTJS
  • Part III: Dockerizing Our Front- & Backend
  • Part IV: Deploying Our Front- & Backend In The Cloud using Heroku dynos
  • Part V: Automating The Build- And Deployment-Process using GitLab CI/CD

Prerequisite

  • Good knowledge of object-oriented programming and java
  • Good knowledge of javascript
  • Basic knowledge of the terminal
  • A mac - While all of this should also work on windows I did not spend any time to check for or provide solutions for windows



The complete code after completing all parts can be found here.