Building an App 📱 and its Stack in minutes with LOLstack 🥡
Tags: mobile, reactnative, programming, docker
Published: 2021-08-07 22:10:51

> **Hello there (ʘ‿ʘ)╯**
> This post is part of a short series you may prefer to read chronologically.

---

## Preface

Chosing what will compose a stack is both a matter of _experience_, _opinion_ and _timing_.

_Experience_ helps identifying what will stick, but _opinion_ has a major role in the final chosing.

As of _timing_, what seems to be a good idea at the time, may be compromised by a lack of maintainers goodwill or vision a year later.

So by no means is the [LOLstack](https://stack.lol) The Perfect Stack™️. Now that's out, let's cover what it has to offer.

> **TL;DR:** Enough with the stalling, [Access the good stuff](#loot)

---

## What you'll get

An App, an API, a Database and all of the in-between that make an App and its stack work.

---

## The tech stack <a name="stack"></a>

| Category | Tech used |
|-|-|
| **Mobile app** that targets iOS, Android &amp; the web | [React Native](//reactnative.dev) [Expo](//expo.io) |
| **Design system** for a component-based, modular &amp; consistent design | [Eva Design](//eva.design) [UI Kitten](//akveo.github.io/react-native-ui-kitten/) |
| **Typing** for a type-safe runtime &amp; auto-generated interfaces | [TypeScript](//www.typescriptlang.org) |
| **Database** with both relational and unstructured data | [PostgresQL](//www.postgresql.org/docs/current/ddl-rowsecurity.html) |
| **GraphQL API** autogenerated from the database schemas | [PostGraphile](//www.graphile.org/postgraphile/) |
| **RESTful API** autogenerated from the database schemas | [PostgREST](http://postgrest.org) |
| **Custom RESTful API** for implementing server-side specific needs | [ExpressJS](//expressjs.com) [TypeScript](//www.typescriptlang.org) |
| **Authentication flow** for handling sign-up and sign-in | [JSON Web Token](//jwt.io) |
| **Role-based permissions** for a granular and low-level security | [PostgresQL](//www.postgresql.org/docs/current/ddl-rowsecurity.html) |
| **Containers** for services isolation and reproducibility | [Docker](//www.docker.com) |
| **Job queue** for handling asynchronous tasks | [Graphile Worker](//github.com/graphile/worker) |
| **Job scheduler** for running repetitive automated tasks | [ofelia](//github.com/mcuadros/ofelia) |
| **Web proxy** with SSL certificate handling, access logs | [traefik](//traefik.io) |
| **Admin interface** for accessing &amp; manipulating the data directly | [pgweb](https://sosedoff.github.io/pgweb/) [adminer](//www.adminer.org) |
| **Unit testing** for ensuring that code is functional | [Jest](//jestjs.io) [plpgunit](//github.com/mixerp/plpgunit) |
| **Status page** to communicate outage and downtime to customers | [Cachet](//cachethq.io) |

> Some of these choices are questionable? Please drop a comment, and let's 👊 discuss 'em softly :)

---

## Don't leave just yet! <a name="loot"></a>

Feeling overwhelmed? Don't. That was the boring part.

Now is the good part, as booting this stack is just a copy-paste away:

```shell
git clone git@github.com:codename-co/stack.git && cd $_
docker-compose up
```

> 🤭 Installing [Docker](https://www.docker.com/products/docker-desktop) first would be a good idea by the way.

---

### Open source

The [LOLstack boilerplate](https://github.com/codename-co/stack) is open source.
This is great news to you right now for your 🤪 crazy app idea.
Happy crafting!