Stacked for success building SSF

A collaboration with SSF

In the summer of 2020 we started a fun and interesting collaboration with SSF. Together we designed and built a portal for every person in Sweden to learn about how to be safe online, to learn about current breaches and to report unusual issues they encountered.

For this task, we wanted to use a stack that will allow us to develop fast, but will also be scalable and useful for many years to come, and will be within reasonable budget limits. The project included backend and frontend, as well as integrations with different services, and security was also top priority given the content of the website.

We chose to develop the website using React, NextJS, Netlify and Sanity. React is the most popular frontend library in the world, has the biggest community both globally and in Stockholm where we operate, which allows for high quality and quantity of documentation online. NextJS is a platform that allows server side rendering, a functionality that increases the loading speed and SEO (ability to find the pages through search engines), and considered best practice for websites with a lot of content that is modified frequently, for example articles. Netlify is a popular platform for deploying static websites. Its pricing and user experience are very friendly, it allows for creating different environments and sharing work in progress easily. For CMS, we had a lot of different options to choose from, and we were very happy to go with Sanity. Sanity provides a frontend React application for the admin side of the CMS, and it can be modified in a very flexible way, to allow good user experience for the content editors. It has a discount for NGOs which we were able to use for SSF, and good documentation and community.

For the backend we chose to go with Google Cloud Platform (GCP) due to our satisfaction of the products and pricing. We used Google App Engine for the backend server which we wrote in NodeJS and Hapi, and Cloud SQL (PostgreSQL) for the DB.

Working on a tight deadline requires tight prioritisation of the features and using off the shelf solutions. For the forms in the website we used TypeForm and didn’t implement it from scratch, to save time and in coordination with our partner product owner from SSF.

Since quality is very important to us, we also used a CI/CD pipeline for automatic deploys of the backend and frontends, and for integrating automatic tests as part of the development process. We used different services such as DebugBear for tracking the performance and accessibility of the website, SonarCloud for tracking our code quality using static code analysis.

You can’t talk about developing a system without talking about the development processes. We used Agile as the development methodology, with daily standups, 2-weeks sprints, with a roadmap on Monday.com, sprint plannings and retros, and a demo at the end of every sprint, ran by our QA expert who made sure we’re developing a good quality product, and has built our end-to-end automation.

Jesper Weissglas, Technical Director

Tech Director Jesper Weissglas has over 35 years of professional software development experience, from embedded realtime robotics to enterprise systems that span over several hundred servers. Jesper is one of Sweden's earliest pioneers of the World Wide Web, launching one of the country's first ten web servers. Being an avid entrepreneur, he also created Stockholm's first internet connected restaurant and one of the earliest web advertising agencies. He has a strong focus on customer benefit, combined with a thorough understanding of what makes business sense when building digital services. Jesper is also a keen sailor and yacht designer.

‍