The Evolution of Our Tech Stack: Lessons, Optimizations, And Outlooks

Every startup has its own IT infrastructure that is usually curved by tech knowledge and budget. Hopefully, the first year of website development will serve with a couple of lessons for early-stage developers while exposing some know-how as well.

1. Starting with website-builders and a simple stack

Before 2020, we’ve started to experiment with various website-builder platforms such as Wix, WordPress, or Shopify to accomplish our goal of building the property platform we imagined. It soon became evident that they won’t satisfy our needs with regards to customization and flexibility, so we decided to start from scratch.Back these days our component stack was the simplest imaginable. It consisted of a Java/Spring-based backend API and a React-based SPA (single-page application) frontend. For our platform, we chose Heroku as it provided the easiest solution for a reasonable price, and our infrastructure was simple enough. We didn’t want to dwell on customization details. In the meantime, we also started to discover the capabilities of Amazon Web Services (AWS).

2. Migrating to SSR framework - Next.js

As our frontend entered its MVP stage, we’ve realized that the client-side rendered SPA won’t meet our requirements as it built a burden between us and the successful SEO strategy - Not stating that SPAs cannot be SEO friendly, but optimizing them isn’t easy and straightforward. The time has come to choose a server-side rendering (SSR) framework. Luckily we were still in an early stage. Our pick was Next.js. It is a free and open-source framework, built specifically to work with React. Additionally, it has a growing community and is evolving fast. Our frontend application code was migrated to Next.js. We are trying to keep up with their pace and introduce the features provided by the framework to our app.

3.Image quality and page speed optimization

As mentioned before, we’ve already started to look into the features AWS could provide, so We started with image optimizations. Our website relies heavily on the quality of the uploaded images. We encourage our users to create their property listings appealingly, therefore to upload high-quality photos of their properties. However, this can increase the loading time of the website, especially on mobile or any device with lower bandwidth. To solve this, we’ve implemented our own Lambda functions and deployed them to Lambda@Edge. Our images are stored in S3 buckets and whenever a request comes in for a photo, we can serve it in the desired dimension and format, while also saving the modified version in S3. Moreover, the images are cached by a CloudFront layer ensuring that they won’t be fetched directly from S3.

4. Saving money with AWS

We’ve also decided to migrate our whole frontend infrastructure from Heroku to AWS ECS. This made a slight reduction in our costs as we could now easily customize the computing resources given to our apps.

5. Future tech challenges and goals

The greatest challenge we were engaging - and still optimizing for - is the Google Lighthouse score. Our objective is to pair high-quality content, intuitive UX, and modern web components with an above-average page speed (especially on mobile devices). Thus we are balancing on a thin line.With regards to our backend infrastructure, we are aiming to move to AWS as well. The reason is that we would like to utilize the untapped resources given by AWS such as Rekognition and SNS - just to name a few, or implement a solution that generates descriptions using NLG techniques.Given the time and the resources we had in 2020 - a small team of three people, we are proud of what we’ve accomplished so far. We hope we can keep up with the pace of evolving technology and expand our team with people who own the same enthusiasm as we do.