Skip to main content

Quick start

This short walkthrough will show you how to set up a codehooks.io account and create your first project with data and a CRUD API. You can also sign up and create projects using the codehooks command line interface (CLI). Check out this tutorial if you prefer the command line.

If you are just curious about what codehooks.io is, you've also come to the right place!

Sign up

Visit account.codehooks.io or click the "Sign up" link in the menu. Currently we only support Github and Google accounts. Before you can continue, you need to accept the terms and conditions. Sign up

Projects overview

When you sign in, you will see all your projects (if you have any - which you probably haven't). Throughout the UI you will see the boxes with the

icon providing contextual information. If you don't need to see these, you can toggle them off in the toolbar. Sign up

Creating a new project

Now we click the

button. A dialog pops up and you can set the name of your project and choose the team it belongs to (Personal account or some other team you are part of). Create Project A new project and a default space ('dev') will be created for you and you will now see it in the projects list. We add 4 random characters so that the project name will be unique. My new Project

What is a space?

A space is where all the magic happens. It is a complete environment / container with a JavaScript/Typescript serverless backend as well as a NoSQL document database and a key-value store. In a project you can manage multiple spaces but they are completely isolated from each other. They only share the same URL endpoint, can be accessed by the same developers/teams and will be billed together.

This is the endpoint of the new project/space we just created (FYI: we will also offer custom domains in the near future):

https://quickstart-jcoo.api.codehooks.io/dev

Which code will be deployed by default?

All new spaces will currently be deployed with our "codehooks-crudlify" starter, which looks like this:

index.js
/*
* Auto generated Codehooks (c) example
*/
import {app} from 'codehooks-js'
import {crudlify} from 'codehooks-crudlify'

// test route for https://<PROJECTID>.api.codehooks.io/dev/
app.get('/', (req, res) => {
res.send('CRUD server ready')
})

// Use Crudlify to create a REST API for any collection
crudlify(app)

// bind to serverless runtime
export default app.init();

This little piece of code does a lot! It will basically let your space endpoint accept any REST API operation (GET, PUT, POST, PATCH, DELETE) and store/update/retrieve/query the data in the document database for you. So if you POST a JSON structure to "/users", you can immediately GET the data back from the same endpoint. A collection named "users" will also be created for you. You can also look at, query and edit the data in the Studio application (see below).

This default starter makes it supereasy to get going even though you have not decided what your API should look like. It's a mock API on steroids 💪

Continue development using the CLI

Currently, you need to use our CLI to continue development (Studio support for development is coming). Please check out the CLI quickstart for details. You install the CLI on the command line like this:

npm install codehooks -g

You need Node.js to install the CLI.

You log in with the CLI using the command codehooks login.

The command which will let you continue development is the 'init' command. Just create an empty folder and run it.

codehooks init

? Select project quickstart-jcco
? Select space (Use arrow keys)
❯ dev

It will create two files: config.json and index.js. You can now modify the index.js, run npm install codehooks-js codehooks-crudlify and deploy it with the command codehooks deploy.

Working with spaces

When you open the project, you will see a list of spaces. Currently, there is only one space: 'dev'. On this page, you can check the total usage for the project (API calls, objects) under the 'USAGE' tab and add developers to the project under the 'ADMIN' tab.

Project spaces

Clicking on the Settings button for the space 'dev', you will see the Space admin page. Here you can:

  • add API tokens (which is one approach to authenticate API calls)
  • add IPs to the whitelist (which will limit who can access your API)
  • add environment variables (they will be available in the Javascript backend code as for example process.env.MY_VARIABLE)
  • set a JWKS endpoint (which will automatically validate API calls with JWT Bearer tokens from services like Auth0 and Clerk)
  • Make the space available to admins only
  • Delete the space

Space Admin

Import data using the Studio

We conclude this quick tutorial by showing you how you can import data into your database using the Studio. First click the

icon next to the "Collections" menu. A dialog let you provide a collection name.

Add a Collection

Now that we have an empty collection, we can open the data menu by clicking on the

button in the down right corner. Empty Collection Selecting the "Import data from CSV or JSON..." menu item pops up a dialog with an import wizard. Import Dialog We'll select a sample CSV file (from Kaggle data sets). Import Choose File We pick which fields we want. Import View Data And start the import. Import Ready This was a small file, but you can also import CSV or JSON files with millions of data objects. Import Ready When finished, we can browse, edit and query the data. Collection with data

The data are now also available from the API (because we use the 'codehooks-crudlify' package) and we can use a tool like Postman or curl to test it.

curl shell command - query users
curl --location 'https://quickstart-jcco.api.codehooks.io/dev/testdata?country=India' \
--header 'x-apikey: cc22998e-f3fd-47dd-8529-36b95b640fa7' \
--header 'Content-Type: application/json'

Which returns an array of 1 object from the database.

[
{
"_id": "64f4d556a933cb39a432e24f",
"country": "India",
"rank": "1",
"area": "3287590",
"landAreaKm": "2973190",
"cca2": "IN",
"cca3": "IND",
"netChange": "0.4184",
"growthRate": "0.0081",
"worldPercentage": "0.1785",
"density": "480.5033",
"densityMi": "1244.5036",
"place": "356",
"pop1980": "696828385",
"pop2000": "1059633675",
"pop2010": "1240613620",
"pop2022": "1417173173",
"pop2023": "1428627663",
"pop2030": "1514994080",
"pop2050": "1670490596"
}
]

This concludes the quick start where we've shown you the basic concepts of codehooks. There is much more to explore in the documentation, but we've covered the basics to get you started building cool stuff.

Thank you for following along!

👏👏