backstage-technical-services / hub

The starting place for anything related to the website.
0 stars 1 forks source link

RFC: Moving to an API and SPA #112

Closed bnjns closed 4 years ago

bnjns commented 4 years ago

In GitLab by @bnjns on Apr 27, 2020, 23:15

Request for Comments

Summary

This RFC is formalising the proposal for the website to move from the current Multi-Page Application (MPA) to an Application Programming Interface (API) for the logic and data access and a Single-Page Application (SPA) for the user interface. For a brief description of what these are, see this article on MPAs vs SPAs and this one on APIs.

TL;DR:

Motivation

The key issues

While there is nothing fundamentally wrong with the current site its size is making it progressively harder to maintain; this problem was particularly apparent once we began to plan how to integrate the finance and asset databases into the main site. The tight coupling between the business logic and presentation layer, as well as how Laravel apps tend to organise their files, has made it difficult to design the integration in a manner that is easily maintainable. This is a key factor in why progress into the asset database stalled early into the planning stage.

The few members who have become involved with the maintenance of the site have also frequently commented on the structure of the site being a significant learning curve that took them a while to understand. Due to the way Laravel works, a lot of boilerplate framework code is mixed among the application code making it harder to understand what's what. This is then exacerbated with the added need to understand where the presentation layer is stored, and how it integrates with the controller layer.

It is worth being aware that the size of this application already makes it similar to many small or even medium-sized enterprise applications, even though we do not use enterprise-grade hosting (such as AWS or GCP). It is important that the language and framework we use is designed for this size of application, and allows it to grow with time while retaining maintainability.

Why use an API and SPA

A common pattern nowadays is to break the business logic and presentation layer up into separate applications; the primary benefit of this is that it de-couples the data from the presentation, allowing each to be developed independently.

The proposal in this RFC is to use the following:

Why Kotlin (and Quarkus)

Both Kotlin and Quarkus are likely the least known of the 4 proposals in this RFC.

Kotlin is developed by JetBrains and is a replacement for Java. It works on the JVM, so gains the cross-platform compatibility that made Java popular, but brings many modernisations that make it a joy to work with. For any one with knowledge of Java (or Scala/Clojure), chances are Kotlin will be a small learning curve; even for those with C/C++ knowledge it's still relatively similar and so the learning curve is likely very similar to that of PHP. While Kotlin is not that new a language, it recently became Google's recommended language for Android development, and is slowly becoming popular in the enterprise industry too.

Quarkus is very new framework, built to the new microservices specification. While this site won't be using a microservice architecture, it's simplicity and speed is a huge benefit. It leverages many benefits from the JVM ecosystem, such as annotations to reduce boilerplate code, and you can organise your code base however you want - it also has the benefit of including no framework code within your application

Kotlin and Quarkus are both used at my job, which would bring the added benefit of making it easier for me to work on the site; at the moment the need to switch to PHP/Laravel makes it difficult to get any significant work done.

TypeScript vs JavaScript

JavaScript has been the champion of front-end for a while, but suffers as a result of its age. Its lack of real typing can lead to some unusual or unexpected type coercion that makes code very prone to developing bugs.

TypeScript, developed by Microsoft, aims to solve this problem by bringing static typing (where the types are checked at compile time) to JavaScript. While it is community-driven (most of the types must be provided as separate packages by the community), applications that use static typing see far fewer bugs than with dynamically-typed languages.

TypeScript may have a steeper learning curve than pure JavaScript, and issues can be encountered when packages are missing or have incorrect type, but once familiar with the syntax it will become second nature. TypeScript and Kotlin also share a lot of their typing syntax, which would make switching between the API and SPA significantly easier.

Drawbacks

Alternatives

Adoption Strategy

The first step would be to move the existing functionality over to the API/SPA. This would not need to be completed in one go, but instead could be developed in chunks. While we wouldn't switch over until the entire site is complete, this would offer a unique opportunity to distribute knowledge of the website around any members interested in becoming involved.

The second step would be to decide on the new hosting provider. It would be sensible to make this decision (or at least part with money) once the site is closer to completion as this will allow a more seamless transition between the old and new sites; the new site could be tested independently and then the DNS simply updated to switch over.

\label ~"type::rfc"

bnjns commented 4 years ago

In GitLab by @bnjns on Apr 27, 2020, 23:15

changed due date to June 01, 2020

bnjns commented 4 years ago

In GitLab by @Hypothawits on May 6, 2020, 20:47

Two parts, my response and then a summary of a response someone sent to me: Part Me: I'm sure I've already made it known I'm in favour. I feel the learning curve of the current setup prevents a lot of members from feeling like they can contribute. Moving to new language(s), that are closer to what we learn at Uni makes it easier for people to get involved without any prior knowledge. I worry that it's a big task for one person, but I also hope that people would be able to get involved at an early stage.

Part 2: It looks really well thought out, and the reasoning made is great. Personally it doesnt really matter what the language is cause I would have to learn from scratch anyway. Making it better organized sounds incredibly important especially for complete beginners like me. It would be really good if we could integrate Angels asset register (I know he will need to rewrite it) and the finance database and it can be easily updated.

bnjns commented 4 years ago

In GitLab by @bnjns on May 6, 2020, 22:07

Thanks for the responses!

To mitigate it being a lot for one person, I'm hoping that we can approach this in a far more reasonable manner and simply work on an area (or part of an area) and merge it in. This would certainly help others get involved as they can get stuck in straight away, and tackle a small part. Take the current MR as an example - I'm already merging into master to keep it small and manageable.

bnjns commented 4 years ago

In GitLab by @jordanlkirk99 on May 6, 2020, 22:26

As one of the few members to attempt to help, I should chime in. I was significantly hampered by my lack of knowledge of Laravel and website development in general. The structure (which appears to be as Laravel expects) splits the website structure up quite a bit, leading to having to jump around a lot. Plus the amount of abstraction lead to a lot appearing to happen as 'magic'. Not obvious where UI was pulling it's variables from etc

For your proposed languages and frameworks I can't really comment due to my lack of knowledge / experience in the web dev world. Typescript sounds better than traditional JS from the little I know. Kotlin dosen't seem to be that common in the web world, but it's very common on Android so hardly that obscure. If we're going to redo (potentially just you) the website using the same / similar tech you use professionally has its benefits.

bnjns commented 4 years ago

In GitLab by @bnjns on Jun 1, 2020, 22:14

This has been approved :) The current MPA is now frozen, with only major or urgent bug fixes to be worked on.

bnjns commented 4 years ago

In GitLab by @bnjns on Jun 1, 2020, 22:14

closed

bnjns commented 4 years ago

In GitLab by @bnjns on Jun 1, 2020, 22:15

locked this issue

bnjns commented 4 years ago

In GitLab by @bnjns on Jun 2, 2020, 18:19

unlocked this issue

bnjns commented 4 years ago

In GitLab by @bnjns on Jun 3, 2020, 20:33

locked this issue