Introduction to our stack and projects

Updated 241 Days AgoPublic

Actions

Our stack

Here you can find a short introduction to the repositories that are central to our development stack.

We usually don't use any hyped frameworks or big libraries, instead preferring in-grown, small modules that use boring but reliable technologies.

Sealious

Repo: rS Sealious
Project: Sealious

This is our ORM. It's a declarative tool that you can use to build production-reqdy REST API or an ORM for your backend in minutes. Check out its README file to see for yourself :)

Sealious is only concerned about the data and logic of your app. It does not build views or any kind of UI for the end user.

You can use any GUI layer for your Sealious app that you'd like. You can have a taste of a React-based one in production here: https://dlaschroniska.pl/. We no longer use React here in Sealcode, though.

If you want to quickly run a local Sealious app, look no further than rPLAY Sealious playground

Sealgen

Repo: rSGEN sealgen
Project: Sealgen

Sealgen is three things:

• a tool to programmatically build views and forms that don't rely on front-end-side JS; and
• a code generator for your Sealious-based project;
• a build tool for your Sealious-based project;

While working on a Sealious-based project, you can use npx sealgen add-route to scaffold the few files that are necessary to augment your app with another view or form. Thanks to that all apps built with sealgen follow a certain very predictable file structure.

Sealgen also helps with automatically detecting changes in your app and restarting it to reflect changes (it only takes an instant). We didn't implement watching and building from scratch - thankfully this part of Sealgen is just a simple wrapper around the wonderful and lightning-fast esbuild, with a default config and plugin setup.

tempstream

Repo: rSTREAM
Project: #tempstream

Tempstream is a small low-level utility that builds streamable strings - meaning, strings that can be read chunk by chunk, before they are finished being constructed. Imagine that you have a website with a DB-heavy operation needed to display its content. You don't have to wait for the DB operation to finish in order to tell the browser which CSS files it needs to prefetch once the sending of the HTML is done! We're using tempstream extensively for HTML streaming, greatly minimizing our time-to-first-byte metric.

All views built with Sealgen are tempstream-based.

ts-predicates

Repo: {rPRED}
Project: #ts_predicates

This is our tool for checking the structure of unknown objects at runtime in a way that makes TypeScript happy. See the examples in the README to get a taste of how it works

ImageRouter

Repo: {rRIMAGEROUTER}
Project: ImageRouter

Serving responsive images is hard! Just look at this blog post to see how much manual labor it takes to do by hand:

https://hub.sealcode.org/phame/post/view/12/responsywne_obrazki_w_html/

The beautifully named koa-responsove-image-router handles all of that for you. You just tell it the target size of the image on page and point it to a photo file on a disk, and it handles the rest. It:

• generates the complex HTML needed to inform the browser about multiple download options for the image;
• serves the scaled up images on demand;
• handles cropping the images to the required proportions;
• and more!

Using ImageRouter makes hitting that high PageSpeed score much easier.

Module starter

Repo: rSTART Module Starter
Project: #module_starter

This is a bunch of boilerplate files that you can use when creating a new Typescript module for use at Sealcode. It makes the module work well with Typescript, Eslint, Phabricator and our linters.

Locreq

Repo: {rLQ}
Project: #locreq

A small utility for importing files based on their relative path from the project root. Saves you typing a lot of "../../../../../" and makes the files more portable within a given project.

multiple-scripts-tmux

Repo: rMULT multiple-scripts-tmux
Project: #multiple-scripts-tmux

Sometimes you have a project that requires a few commands to run constantly in the background in order to operate in dev mode. Opening separate terminals/tabs is a chore. Tmux is a CLI utility that helps with that, allowing to open multiple scripts in one terminal, displayed in separate, independent columns, where each script lives in its own column, can be restarted independently of the other scripts, and accepts input. This module is a small wrapper around tmux that lets you run multiple npm scripts in parallel easily.