# Setting Up Our API Server with AdonisJs Framework | Full-Stack Google Contacts Clone with AdonisJs (Node.js) and Quasar Framework (Vue.js) **Author:** Ndianabasi Udonkang **Published:** 2021-09-30 In this lesson, we will setup our API Server with the AdonisJS Framework and installing, configuring, and testing some essential packages. --- ## Tags - [JavaScript](/llms/technical-blog/tag/javascript.md) - [Nodejs](/llms/technical-blog/tag/nodejs.md) - [Vuejs](/llms/technical-blog/tag/vuejs.md) - [Adonisjs](/llms/technical-blog/tag/adonisjs.md) - [Quasar Framework](/llms/technical-blog/tag/quasar-framework.md) ## Part of Series: [Full-Stack Google Contacts Clone with Node.js (Adonisjs Framework) and Vue.js (Quasar Framework)](/llms/technical-blog/series/clnwu9bc991hiu3wo2vwmw45/full-stack-google-contacts-clone-with-node-js-adonisjs-framework-and-vue-js-quasar-framework.md) This article is part of the **[Full-Stack Google Contacts Clone with Node.js (Adonisjs Framework) and Vue.js (Quasar Framework)](/llms/technical-blog/series/clnwu9bc991hiu3wo2vwmw45/full-stack-google-contacts-clone-with-node-js-adonisjs-framework-and-vue-js-quasar-framework.md)** series. ### Articles in this Series: - [Introduction to Full-Stack Google Contacts Clone with Node.js (Adonisjs Framework) and Vuejs (Quasar Framework)](/llms/technical-blog/article/xe5mlxg43s9rpx1pxsvfdp3r/introduction-to-full-stack-google-contacts-clone-with-node-js-adonisjs-framework-and-vuejs-quasar-framework.md) - [Workspace Setup | Full-Stack Google Contacts Clone with Adonis.js/Node.js and Quasar (Vue.js)](/llms/technical-blog/article/fo8str8yjpkz5dygxg875bpw/workspace-setup-full-stack-google-contacts-clone-with-adonis-js-node-js-and-quasar-vue-js.md) - [Frontend Overview | Full-Stack Google Contacts Clone with Adonis.js/Node.js and Quasar (Vue.js)](/llms/technical-blog/article/nxgmng6fhf1cwjk30coflro2/frontend-overview-full-stack-google-contacts-clone-with-adonis-js-node-js-and-quasar-vue-js.md) - [The Left Drawer | Full-Stack Google Contacts Clone with Adonis.js/Node.js and Quasar (Vue.js)](/llms/technical-blog/article/m6fagvy2il5h65llxxbbl9os/the-left-drawer-full-stack-google-contacts-clone-with-adonis-js-node-js-and-quasar-vue-js.md) - [Improve The Header | Full-Stack Google Contacts Clone with Adonis.js/Node.js and Quasar (Vue.js)](/llms/technical-blog/article/jjwbxcg450jmkkcrrmkmwvwj/improve-the-header-full-stack-google-contacts-clone-with-adonis-js-node-js-and-quasar-vue-js.md) - [New Contact Form Design | Full-Stack Google Contacts Clone with Adonis.js/Node.js and Quasar (Vue.js)](/llms/technical-blog/article/ebguwpkntk3empakunrki4dq/new-contact-form-design-full-stack-google-contacts-clone-with-adonis-js-node-js-and-quasar-vue-js.md) - [Validating the Contact Form with Vuelidate | Full-Stack Google Contacts Clone with Adonis.js/Node.js and Quasar (Vue.js)](/llms/technical-blog/article/z0xr9m2ljler2cwnpsw2ycwa/validating-the-contact-form-with-vuelidate-full-stack-google-contacts-clone-with-adonis-js-node-js-and-quasar-vue-js.md) - [Designing the Contacts Table | Full-Stack Google Contacts Clone with Adonis.js/Node.js and Quasar (Vue.js)](/llms/technical-blog/article/h2p1x1z406ib38zu2dci3jur/designing-the-contacts-table-full-stack-google-contacts-clone-with-adonis-js-node-js-and-quasar-vue-js.md) - [Designing the Contacts Table (Part 2) | Full-Stack Google Contacts Clone with Adonis.js/Node.js and Quasar (Vue.js)](/llms/technical-blog/article/j0iscua9gg8ekuz8ifh6chpn/designing-the-contacts-table-part-2-full-stack-google-contacts-clone-with-adonis-js-node-js-and-quasar-vue-js.md) - [Refactoring the Main Layout | Full-Stack Google Contacts Clone with Adonis.js/Node.js and Quasar (Vue.js)](/llms/technical-blog/article/uktmlqsivwtr3cvnpld59k9q/refactoring-the-main-layout-full-stack-google-contacts-clone-with-adonis-js-node-js-and-quasar-vue-js.md) - [Improving User Experience with the Contacts Table | Full-Stack Google Contacts Clone with Adonis.js/Node.js and Quasar (Vue.js)](/llms/technical-blog/article/dzs812auf61ej7qu2cg726dh/improving-user-experience-with-the-contacts-table-full-stack-google-contacts-clone-with-adonis-js-node-js-and-quasar-vue-js.md) - [Designing the Contact Details Page | Full-Stack Google Contacts Clone with Adonis.js/Node.js and Quasar (Vue.js)](/llms/technical-blog/article/kf9pz97n63fvgfrcy5viwzrg/designing-the-contact-details-page-full-stack-google-contacts-clone-with-adonis-js-node-js-and-quasar-vue-js.md) - [Creating the Contact Edit Page | Full-Stack Google Contacts Clone with Adonis.js/Node.js and Quasar (Vue.js)](/llms/technical-blog/article/fmr90prj84c9zn0633jc368g/creating-the-contact-edit-page-full-stack-google-contacts-clone-with-adonis-js-node-js-and-quasar-vue-js.md) - [How Software Backends Work | Full-Stack Google Contacts Clone with AdonisJs (Node.js) and Quasar Framework (Vue.js)](/llms/technical-blog/article/aca8fcrghz70nn1wqg3uzbum/how-software-backends-work-full-stack-google-contacts-clone-with-adonis-js-node-js-and-quasar-framework-vue-js.md) - [Setting Up The Backend | Full-Stack Google Contacts Clone with AdonisJs (Node.js) and Quasar Framework (Vue.js)](/llms/technical-blog/article/fxb49fmz9ljbwrimbnnzudfv/setting-up-the-backend-full-stack-google-contacts-clone-with-adonis-js-node-js-and-quasar-framework-vue-js.md) - [Why Choose the AdonisJs Framework? | Full-Stack Google Contacts Clone with AdonisJs (Node.js) and Quasar Framework (Vue.js)](/llms/technical-blog/article/lnhm5oudx34yo2869gmcms37/why-choose-the-adonis-js-framework-full-stack-google-contacts-clone-with-adonis-js-node-js-and-quasar-framework-vue-js.md) - **Setting Up Our API Server with AdonisJs Framework | Full-Stack Google Contacts Clone with AdonisJs (Node.js) and Quasar Framework (Vue.js)** (Current Article) - [Setting Up Postman with the API Server | Full-Stack Google Contacts Clone with AdonisJS (Node.js) and Quasar Framework (Vue.js)](/llms/technical-blog/article/v4qehksislosmuy92qgjr4ct/setting-up-postman-with-the-api-server-full-stack-google-contacts-clone-with-adonis-js-node-js-and-quasar-framework-vue-js.md) - [The Model-View-Controller Design Pattern in AdonisJS | Full-Stack Google Contacts Clone with AdonisJS (Node.js) and Quasar Framework (Vue.js)](/llms/technical-blog/article/h5wqql65iejop5xrplujw458/the-model-view-controller-design-pattern-in-adonis-js-full-stack-google-contacts-clone-with-adonis-js-node-js-and-quasar-framework-vue-js.md) - [Create Column Definitions & Insert New Contacts | Full-Stack Google Contacts Clone with AdonisJS (Node.js) and Quasar Framework (Vue.js)](/llms/technical-blog/article/asc2emsho4u73r6jb2gxjddw/create-column-definitions-and-insert-new-contacts-full-stack-google-contacts-clone-with-adonis-js-node-js-and-quasar-framework-vue-js.md) - [Data Validation & Sanitisation with AdonisJS | Full-Stack Google Contacts Clone with AdonisJS (Node.js) and Quasar Framework (Vue.js)](/llms/technical-blog/article/bcey0ac7m5sbs9hqy1h824sl/data-validation-and-sanitisation-with-adonis-js-full-stack-google-contacts-clone-with-adonis-js-node-js-and-quasar-framework-vue-js.md) - [Creating a Middleware and Updating a Contact | Full-Stack Google Contacts Clone with AdonisJS (Node.js) and Quasar Framework (Vue.js)](/llms/technical-blog/article/oqxzmtgfy1r3oewpnedc7wf6/creating-a-middleware-and-updating-a-contact-full-stack-google-contacts-clone-with-adonis-js-node-js-and-quasar-framework-vue-js.md) - [Fetching and Deleting a Contact with AdonisJS | Full-Stack Google Contacts Clone with AdonisJS Framework (Node.js) and Quasar Framework (Vue.js)](/llms/technical-blog/article/p6bh0ponq43u3vi6o8uww84x/fetching-and-deleting-a-contact-with-adonis-js-full-stack-google-contacts-clone-with-adonis-js-framework-node-js-and-quasar-framework-vue-js.md) - [Using Model Factories and Seeders in AdonisJS | Full-Stack Google Contacts Clone with AdonisJS Framework (Node.js) and Quasar Framework (Vue.js)](/llms/technical-blog/article/cfotveuxbgjtdp12l6pzcb2y/using-model-factories-and-seeders-in-adonis-js-full-stack-google-contacts-clone-with-adonis-js-framework-node-js-and-quasar-framework-vue-js.md) - [Creating and Registering a Vuex Module | Full-Stack Google Contacts Clone with AdonisJS Framework (Node.js) and Quasar Framework (Vue.js)](/llms/technical-blog/article/cw96ewnzujgsz2e2garhbuzb/creating-and-registering-a-vuex-module-full-stack-google-contacts-clone-with-adonis-js-framework-node-js-and-quasar-framework-vue-js.md) - [Connecting UI Components to the Vuex Store | Full-Stack Google Contacts Clone with AdonisJS Framework (Node.js) and Quasar Framework (Vue.js)](/llms/technical-blog/article/fdyqp17yehbnqrjvjvab4b5b/connecting-ui-components-to-the-vuex-store-full-stack-google-contacts-clone-with-adonis-js-framework-node-js-and-quasar-framework-vue-js.md) - [Connecting the Frontend to the API Server | Full-Stack Google Contacts Clone with AdonisJS Framework (Node.js) and Quasar Framework (Vue.js)](/llms/technical-blog/article/fk4262359gg3g7f0jn95fn9b/connecting-the-frontend-to-the-api-server-full-stack-google-contacts-clone-with-adonis-js-framework-node-js-and-quasar-framework-vue-js.md) - [Creating and Updating Contacts From the Frontend | Full-Stack Google Contacts Clone with AdonisJS Framework (Node.js) and Quasar Framework (Vue.js)](/llms/technical-blog/article/t15w2s3ao9jo74l96stjo7z6/creating-and-updating-contacts-from-the-frontend-full-stack-google-contacts-clone-with-adonis-js-framework-node-js-and-quasar-framework-vue-js.md) - [Uploading Files and Creating Avatars for Contacts With AdonisJS and Axios](/llms/technical-blog/article/hg9ilaubqesm8angg0rhrjp9/uploading-files-and-creating-avatars-for-contacts-with-adonis-js-and-axios.md) - [Deleting a Contact with AdonisJS and Vuejs](/llms/technical-blog/article/zdr4pxmgcax2dsfnwimhty0g/deleting-a-contact-with-adonis-js-and-vuejs.md) --- ## Article Content In the last lesson, we discussed why we chose AdonisJS over other Node.js frameworks. In this lesson, we will setup the `AdonisJS framework` as our `API server` for this Google Contacts Clone App project. If you are following along this series, you already have the initial installation ([as seen here](https://docs.adonisjs.com/guides/installation#creating-a-new-project)) of the AdonisJS Framework in the `api` folder of our project. Now, we have to install some extra packages and then test our `API server`. Start by creating a new branch of your project. ```bash git checkout -b 10-api-server-setup ``` ### Install and Configure the `Lucid` package The `Lucid` [package](https://docs.adonisjs.com/guides/database/introduction) is used for interacting with the database. It offers a complete suite of SQL functionalities including querying, inserting, deleting, and updating records. It also offer a fluent ORM for interacting with database records, seeding, migrating tables, and working with model factories. 1. Install the `Lucid` package: ```bash ``` yarn add @adonisjs/lucid ```` 2. Configure `Lucid`: ```bash node ace configure @adonisjs/lucid ```` 1. When asked to `Select the database driver you want to use`, select `MySQL / MariaDB`. 2. When asked to `Select where to display instructions`, choose `Browser`. If the browser does not launch, repeat: `node ace configure @adonisjs/lucid` and choose `Terminal`. 3. When the configuration is done, follow the instructions on the terminal or browser. It is explained below. 4. Open `api/env.ts`. Add the following to the options object of the `Env.rules()` function: ```ts ``` DB\_CONNECTION: Env.schema.string(), MYSQL\_HOST: Env.schema.string({ format: 'host' }), MYSQL\_PORT: Env.schema.number(), MYSQL\_USER: Env.schema.string(), MYSQL\_PASSWORD: Env.schema.string.optional(), MYSQL\_DB\_NAME: Env.schema.string(), ```` ### Install and Configure the `Auth` package The `Auth` package provides authentication functionalities whether you are using AdonisJS as an API server or for server-side rendering of your web application. 1. Install the `Auth` package: ```bash yarn add @adonisjs/auth ```` 2. Configure the `Auth` package: ```bash ``` node ace configure @adonisjs/auth ```` 1. When asked to `Select provider for finding users`, select `Lucid (Uses Data Models)`. 2. When asked to `Select which guard you need for authentication`, select `API tokens`. 3. When asked to `Enter model name to be used for authentication`, enter: `User`. 4. When asked to `Create migration for the users table`, press `y`. 5. When asked to `Select the provider for storing API tokens`, select `Redis`. Lucid will complete the setup of the package. ### Testing our API server We will change into our `api` directory, start the server, and ping the `base route` ("/") of the API server. > Don't type the `#` symbol and content after the `#` on each line ```bash cd api # <-- change into our `api` directory node ace serve --watch # <-- start the server curl 127.0.0.1:3333/ # <-- ping the "/" route {"hello":"world"} # <-- response ```` The response came from the `api/start/routes.ts` file. Let's inspect that. Press `CTRL+P` on your keyboard and type `api routes` to search for the file. Click enter to open the `api/start/routes.ts` file as seen in the first result. The file currently contains one route definition after the `Route` class is imported: ```ts import Route from '@ioc:Adonis/Core/Route' Route.get('/', async () => { return { hello: 'world' } }) ``` The first argument of the `Route.get()` method is the route path. In this case, the path is `/`. The second argument is an `async` function handler which simply returns an object: `{ hello: 'world' }`. That's what we received on the terminal. Read extensively about the [AdonisJS routing here](https://docs.adonisjs.com/guides/routing). The route definition calls a static `get` method on the `Route` class. The `get` method corresponds to the HTTP `GET` [request method](https://developer.mozilla.org/en-US/docs/Web/HTTP/Methods). There are other static methods such as `Route.post`, `Route.put`, `Route.delete`, `Route.post`, and `Route.patch`. Their usage depends on the API operation you want to perform. Typically, you should follow this rules: | HTTP Method | AdonisJS Route Method | Usage | |------------|-----------------------|-----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------| | `GET` | Route.get() | Use this method when you want to fetch (read) information about a entity. For example: fetching the details of a user. | | `POST` | Route.post() | Use this method when you want to create a new entity. For example: create a new user. | | `PUT` | Route.put() | Use this method when you want to edit/override all the properties of an entity. For example: if you have five properties for a user and you want to edit all the five properties. | | `DELETE` | Route.delete() | Use this method when you want to delete an entity. For example: deleting a user from the `users` table. | | `PATCH` | Route.patch() | Use this method when you want to partially edit/override some properties of an entity. For example: changing only the `first_name` and `last_name` while other properties remain unchanged. | ### Health Check AdonisJS comes with a health checker for checking if our application is running optimally. It is often used by deployment tools to check if our application is running optimally before and after a new deployment. To add health check, do the following: 1. Open `api/start/routes.ts`. Press `CTRL+P` on your keyboard and type `api routes` to search for the file. Click enter to open the file as seen in the first result. 2. Below the import statement for the `Route` class, add: `import HealthCheck from '@ioc:Adonis/Core/HealthCheck'` 3. Below the route definition for the path `/`, add: ```ts Route.get('health', async ({ response }) => { const report = await HealthCheck.getReport() return report.healthy ? response.ok(report) : response.badRequest(report) }) ``` This adds the `health` route via the `Route.get()` method. It calls the `HealthCheck.getReport()`. The `report` object contains a `boolean` property: `healthy`. If `healthy` is true, we use the `response.ok()` method to return the report. Else, we use the `response.badRequest()` method to return a 400 error with the report as the payload. Your `api/start/routes.ts` should look like this: ```ts import Route from '@ioc:Adonis/Core/Route' import HealthCheck from '@ioc:Adonis/Core/HealthCheck' Route.get('/', async () => { return { hello: 'world' } }) Route.get('health', async ({ response }) => { const report = await HealthCheck.getReport() return report.healthy ? response.ok(report) : response.badRequest(report) }) ``` Save the file. And ping the `health` route: ```bash curl 127.0.0.1/health # result below {"healthy":true,"report":{"env":{"displayName":"Node Env Check","health":{"healthy":true}},"appKey":{"displayName":"App Key Check","health":{"healthy":true}}}} ``` Read more about [AdonisJS health checks here](https://docs.adonisjs.com/guides/health-check). ### Configuring the Database Credentials for the API Server Now, we will pass in the database credentials we created two lessons ago. Open our `.env` file for our backend i.e. `api/.env` The `.env` file is an environment file which contains very import key-value pairs for our application. More about the `.env` file. As you can see from the file, it contains the `APP_KEY`, `MYSQL_USER`, `MYSQL_PASSWORD`, and `MYSQL_DB_NAME`. These are very sensitive data for our backend which should not be known to any third party. This is the reason why you should never commit your `.env` into GitHub or other version control systems. As a matter of fact, AdonisJS has a file `api/.gitignore` which already configures the `.env` file to be ignored by `git` during commits. The `APP_KEY` value is used as the encryption salt for your application. All encryptions and hashing are done on the basis of the `APP_KEY`. It should be very random and never shared across multiple applications. If you need to change the `APP_KEY`, run: ```bash node ace generate:key ``` Then copy the generated key from the terminal into the `.env` file replacing the old value for `APP_KEY`. > SERIOUS WARNING. Updating the `APP_KEY` for an existing application with users will invalidate all passwords (passwords are hashed) and encrypted data. You should only do this in production in the case of a security breach, in which case, you will inform your users to reset their passwords. Back to configuring our database credentials: 1. For `MYSQL_HOST`, change the value to; `127.0.0.1`. 2. For `MYSQL_USER`, change the value to: `google_contacts_clone_user`. 3. For `MYSQL_PASSWORD`, change the value to the password you chose. 4. For `MYSQL_DB_NAME`, change the value to: `google_contacts_clone_app` 5. If you did use the default port number of `3306` when installing the MySQL database server, change the value for `MYSQL_PORT` to that port number you assigned. Save and close the file. ### Testing the Database Connection Open `api/config/database.ts` file. Within the `mysql` property, change `healthCheck` to true. ```ts { pg: { client: 'pg', connection: { // ... connection details }, healthCheck: true, // 👈 enabled } } ``` Save and close the file. Now, ping the `health` route again. You will get: ```bash curl 127.0.0.1/health # result below {"healthy":true,"report":{"env":{"displayName":"Node Env Check","health":{"healthy":true}},"appKey":{"displayName":"App Key Check","health":{"healthy":true}},"lucid":{"displayName":"Database","health":{"healthy":true,"message":"All connections are healthy"},"meta":[{"connection":"mysql","message":"Connection is healthy","error":null}]}}} ``` The Database health check is healthy. If all is going well as shown here, congratulations. Our API server is ready to serve our Google Contacts Clone App. Save all your files, commit and merge with the master branch. ```bash git add . git commit -m "feat(api): complete API Server setup" git push --set-upstream origin 10-api-server-setup git checkout master git merge master 10-api-server-setup git push ``` In this next lesson, we will setup `Postman` and get it ready for real work. *This document was generated from the live article page on https://ndianabasi.com/technical-blog/article/x1jgmet84aqj9qggu5mulkh0/setting-up-our-api-server-with-adonis-js-framework-full-stack-google-contacts-clone-with-adonis-js-node-js-and-quasar-framework-vue-js • 2026-06-07*