Decode is a full-stack toolkit for developing internal tools in React. Internal tools are the stuff that employees at companies use, like customer support dashboards or ops tools.
You can logon to Decode and connect your HTTP APIs and databases. Then, you can write queries against those resources. For each query, Decode will provision a special secure endpoint. You can read/write from that endpoint with Decode's client-side React SDK.
In this tutorial, we're going to build a tool for a bank, Spacebank. This tool is used by the bank's risk team to mark transactions as fishy 🐟. Admins work through a table of transactions that they can sort and filter. They can mark a transaction as fishy/not fishy:
We'll make use of the following Decode features to bring this app to life:
⏱️This tutorial will take about 10 minutes to complete.
You'll find a fresh, incomplete version of Spacebank over on this Codesandbox:
https://codesandbox.io/s/github/usedecode/spacebank-client?file=/pages/index.tsx
The basic styles are in place, and some components are laid out. But this app isn't connected to any back-end data sources. Let's change that.
When you first sign-up for Decode, we pre-populate your account with two resources.
A resource can be either an HTTP API or a database (Postgres, MySQL, or MSSQL).
If you head over to the Resources view, you'll see the two resources listed: