Creating an Express server for Better Botz
Tags: database, beginners, cloud, tutorial
Published: 2020-03-16 20:40:23

**This post is a part of a tutorial series for learning how to build an app with [DataStax's Astra](https://astra.datastax.com/register?utm_medium=referral&utm_source=devto&utm_campaign=creating-an-express-server-for-better-botz) database. See all of the posts in this [Better Botz series](https://dev.to/betterbotz) to start using Astra now.**

In the <a href="https://dev.to/betterbotz/building-applications-with-better-botz-1he3" target="_blank">last blog post</a>, we learned about Better Botz and their need for a new online ordering application. We created an Astra database, generated two tables, inserted some data, and learned how to retrieve data.

Using that database, we’re going to configure an Express backend server on Node.js. This server is the backbone of the React application that will become the online ordering and reporting platform for Better Botz. If that goal sounds ambitious, don’t worry; we’re going to guide you through each part of the process. While experience with Node.js is helpful, it is not required. 

We’ll install the DataStax Node.js driver, download the secure connect bundle for your Astra database, and then configure the driver to use that bundle when connecting to your Astra database. After establishing that connection, we can use the Node.js driver as our conduit for getting data in and out of the database.


### Goal 1: Laying the Foundation

Before you dive into developing the ordering application, lay the necessary groundwork. You’ll install Node.js and the DataStax Node.js driver, and then download the secure connect bundle for your Astra database. 

First, download and install Node.js. Follow the instructions on the Node.js website for your preferred method of installing software: 


*   <a href="https://nodejs.org/en/download/package-manager/" target="_blank">Use a package manager</a>
*   <a href="https://nodejs.org/en/download/" target="_blank">Download the source code or install using a prebuilt installer</a>

1. With Node.js installed, install the DataStax Node.js driver:


    ```
    $ npm install cassandra-driver
    ```


2. Create a new directory for your Node.js application, and then go to that directory:


    ```
    $ mkdir betterbotzapp && cd betterbotzapp
    ```

We’ll be creating a set of files to work from. Choose one of the following options:

1. **Prebuilt:** Clone this <a href="https://github.com/riptano/better-botz-gui-at-glitch/tree/pollo-1" target="_blank">BetterBotz GitHub repository</a>. This option provides all of the files you need with the main structure already in place.
2. **Manual:** Use <a href="https://expressjs.com/en/starter/generator.html" target="_blank">express generator</a> to create a skeleton Node.js application. With this option, you’ll do more of the manual work to create files, folder structures, and source code.

If you chose the prebuilt option, jump ahead to [download your database credentials](#goal-2-downloading-database-security-credentials). For the manual route, let’s create a barebones project to work from.

Install express-generator to quickly create a skeleton Node.js application for us to work with, and then run express:

```
$ npm install -g express-generator
$ express 
```

When you run `express`, a skeleton project is created with the minimal files necessary for a basic Node.js application. Do a simple list to show the files that were created and familiarize yourself with the files we’ll work with.

```
$ ls -l
  |_app.js
  |_bin
  |_package.json
  |_public
  |_routes
  |_views
```

With the project structure in place, you’re ready to download the security credentials for your Astra database.

### Goal 2: Downloading Database Security Credentials

From your DataStax Astra database, download the secure connect bundle, which contains the security credentials for connecting to your database.

1. In a browser, log in to <a href="https://astra.datastax.com/utm_medium=referral&utm_source=devto&utm_campaign=creating-an-express-server-for-better-botz" target="_blank">DataStax Astra</a>.
2. From the **Databases** page, under Actions, select the ellipsis (**…**) for the database you want to connect to and select **Connection details**.
3. In the **Connection Details** window, select **Download secure connect bundle** to download the <code>secure-connect-<strong><em>database_name</em></strong>.zip</code> file.

    This file contains the security certificates and credentials for your 
    database.

    <strong>Important</strong>: Do not share this secure connect bundle with anyone outside of your organization. Anyone with access to these credentials can potentially access your database.

4. In your <code>betterbotzapp</code> directory, create a <code>.data</code> directory:

    ```
    $ cd betterbotzapp
    $ mkdir .data
    ```

5. Move the secure connect bundle that you downloaded to the <code>.data</code> directory you just created. Placing the bundle in this hidden directory allows you to better protect your database credentials and control access.


    ```
    $ cp ~/Downloads/secure-connect-database_name.zip ~/betterbotzapp/.data
    ```

6. Change the permissions on the <code>.data</code> directory so that only you have read/write access:

    ```
    $ chmod 700 .data
    ```

### Goal 3: Connect the server to your database

Ensure that your Express server can access the secure connect bundle for your database, and that the DataStax Node.js driver is configured correctly.


1. In your betterbotzapp project, open index.js in the routes directory.


$ cd routes
$ nano index.js

2. In index.js, replace the value for the path variable with the path to your secure connect bundle: 



    ```
    const path = './.data/secure-connect-database_name.zip';
    const { Client } = require('cassandra-driver');
    const client = new Client({
    cloud: { secureConnectBundle: path },
    credentials: { username: process.env.ASTRAUSERNAME, password: 
    process.env.ASTRAPASSWORD}
    });
    ```

    This code uses the credentials from the secure connect bundle in your `.data` directory to make a connection to your Astra database.

    **Note**: if you’re using the files from the Better Botz GitHub repository, the remainder of your `index.js` file is preconfigured to obtain data from your database. Skip ahead to step 5 to install dependencies and start your server.

3. In the `index.js` file, replace the main `router.get` function with the following code. 
    1. The first function gets the home page for your server and adds a Better Botz title.
    2. The second function creates a data report with results from a request that you’ll add in the next step.
    3. The third function generates a direct data response of the JSON response using the API get call.


    ```
    router.get('/', function(req, res, next) {
      res.render('index', { title: 'Better Botz' });
    });

    router.get('/datareport', function (req, res) {
      getMoreData().then(function(data){
        res.render('datareport', { data } );
      }).catch(function(filteredData){
        res.send(filteredData);
      })
    });

    router.get('/data', function (req, res) {
      getMoreData().then(function(data){
        res.send(data);
      }).catch(function(filteredData){
        res.send(filteredData);
      })
    });
    ```

4. Lastly, add the following code to the `index.js` file. This code sends a CQL `SELECT` statement to retrieve data from your orders table in the `betterbotz` keyspace.


    ```
    async function getMoreData(){
      const result = await client.execute('SELECT customer_name, address, 
    description, price, prod_id, prod_name, sell_price FROM 
    betterbotz.orders');
      return result.rows;
    }
    ```

5. Save your `index.js` file, and then run the following command to install required dependencies and packages for Node.js:

    ```
    $ npm install
    ```

    Running this command downloads dependencies to your machine. The number of downloaded dependencies depends on other packages installed on your system.

6. From your terminal, run the following command to set username and password variables and then start your Express server. Replace the variables with the username and password for your Astra database.

    ```
    $ ASTRAUSER=myusername ASTRAPASSWORD=mypassword node bin/www
    ```

Great! You won’t notice anything in your terminal...yet. Let’s review results in a browser to ensure that the server is working, and then check back in the terminal.


### Goal 3: Reviewing results

Open a browser and navigate to <a href="http://localhost:3000/" target="_blank">http://localhost:3000/</a>. You should see a page displaying Better Botz as the title, which verifies that your Express server is running with the included Jade templates. 

**Note**: If you cloned the Better Botz GitHub repository, your Jade template already contains the following lines. Skip ahead to step 3.

We’re going to make some modifications to the `layout.jade` template, which lives in the `/views` directory of your `betterbotzapp` project. For those going the manual route, we’ll add some code to update the Jade template, which affects the information displayed in the browser.

1. In your `betterbotzapp` project, navigate to the `/views` directory and open the `layout.jade` file.
2. Replace the body section with the following code:

    ```
    body
        header
          h1= title

        main
          p
            | Welcome to the #{title} site to help you build what you need for your Better Botz workforce!

        footer
          | Powered by&nbsp;
          a(href='https://astra.datastax.com') DataStax Astra
          | !
          | Lots of HTML turned into Jade with&nbsp;
          a(href='https://html2jade.org/') html2jade
          | . Built by all the robots at&nbsp;
          a(href='https://twitter.com/betterbotz/') Better Botz
          | !
    ```
3. In the `/templates` directory, create a `datareport.jade` file and add the following code.

    ```
    extends layout

    block content
        h1 Customer Orders
        ul
            for order in data
                li
                    div
                        b Customer Name:
                        =order.customer_name
                        div
                            b Address:
                            =order.address
                        div
                            b Description:
                            =order.description
            else
                li No orders currently.
    ```

4. Save your changes to the `layout.jade` and `datareport.jade` files.

5. Use `Ctrl + C` to stop the server. Restart the server with your database username and password.

    ```
    $ ASTRAUSER=myusername ASTRAPASSWORD=mypassword node bin/www
    ```

6. Refresh your browser pointing to <a href="http://localhost:3000/" target="_blank">http://localhost:3000/</a>.

Your browser displays the changes, which include a new footer with links to the projects we’re using to build our database, server, and HTML for the page. Great job!

We know that our server is running and that we can actively make changes that are reflected in the browser.

Let’s revisit your terminal. After updating the footer in the `layout.jade` file and refreshing your browser, you should see a few GET calls:

```
GET / 304 254.400 ms - -
GET /stylesheets/style.css 304 1.893 ms - -
```

These calls indicate requests from your Express server to the browser endpoints for data. Each time that you refresh your browser, GET calls are sent to the database and updated in your terminal.

Now, let’s review two different endpoints to view data responses from those GET calls.

1. In a browser, navigate to <a href="http://localhost:3000/datareport" target="_blank">http://localhost:3000/datareport</a>. You’ll see similar content to the main URL, except that the content displaying is a _direct data response_ of the JSON response that is using the API GET call. 
2. Navigate to <a href="http://localhost:3000/data" target="_blank">http://localhost:3000/data</a> and you’ll see...a set of square brackets? That’s correct! If you inspect the CQL statement that we added to the `index.js` file, you’ll see that we’re trying to retrieve data from the `orders` table:

```
SELECT customer_name, address, description, price, prod_id, prod_name, sell_price FROM betterbotz.orders
```

Your `orders` table is currently _empty_, which is why no data returns at the `/data` endpoint. In the [next post](https://dev.to/betterbotz/using-glitch-and-the-astra-data-api-4fjk), we’ll add data to the `orders` table and create a new table to track which orders are shipping and which have already shipped. We can then check the `/data` endpoint and see data being returned to the browser.

Stay tuned!