Skip to main content

Application Setup

Let's start by creating a new project, installing required dependencies, and setting up a basic server application.

New project

Create a new folder for your project, navigate to it in the command line, and initialize a new Node.js project:

npm init -y

Next, install all the Node.js dependencies we're going to use. In this case it will be the Express.js framework, an Express.js middleware for handling multipart/form-data requests, and finally the Forge SDK:

npm install --save express express-formidable forge-apis

The "dependencies" in your package.json file should now look something like this (potentially with slightly different version numbers):

// ...
"dependencies": {
"express": "^4.17.1",
"express-formidable": "^1.2.0",
"forge-apis": "^0.8.6"
}
// ...

Finally, let's create a couple more subfolders in the project folder that we're going to need later:

  • wwwroot - this is where we're going to put all the client side assets (HTML, CSS, JavaScript, images, etc.)
  • routes - this is where we're going to implement all the server endpoints
  • services - here we're going to keep all the server-side logic that can be shared by different endpoints

Now, when you open your project folder in Visual Studio Code for the first time, the folder structure should look similar to this:

Folder Structure

Application config

Our application will need a couple of configuration inputs to run properly, for example, the credentials of our Forge app (client ID and secret) for communicating with Autodesk Forge services, and the name of a bucket in the Data Management service for storing designs. We will pass these parameters to our app using environment variables.

Create a config.js file in the root of your project folder, and add the following code:

config.js
let { FORGE_CLIENT_ID, FORGE_CLIENT_SECRET, FORGE_BUCKET, PORT } = process.env;
if (!FORGE_CLIENT_ID || !FORGE_CLIENT_SECRET) {
console.warn('Missing some of the environment variables.');
process.exit(1);
}
FORGE_BUCKET = FORGE_BUCKET || `${FORGE_CLIENT_ID.toLowerCase()}-basic-app`;
PORT = PORT || 8080;

module.exports = {
FORGE_CLIENT_ID,
FORGE_CLIENT_SECRET,
FORGE_BUCKET,
PORT
};

We simply read the environment variables from process.env, and exit the application immediately if any of the required properties are missing. And if no bucket name is provided, we generate one by appending the -basic-app suffix to the Forge Client ID.

caution

Note that the Data Management service requires bucket names to be globally unique, and attempts to create a bucket with an already used name will fail with 409 Conflict. See the documentation for more details.

Now, to pass actual configuration values to our application for debugging purposes, we need to create a launch configuration. Use Run > Add Configuration in the menu to create a new configuration, and when prompted for the specific environment, choose Node.js. This will create a new .vscode subfolder in your project with a launch.json file where you can define different launch configurations. Replace the content of the file with the following:

.vscode/launch.json
{
"version": "0.2.0",
"configurations": [
{
"type": "node",
"request": "launch",
"name": "Launch Server",
"runtimeExecutable": "npm",
"runtimeArgs": [
"start"
],
"envFile": "${workspaceFolder}/.env",
"skipFiles": [
"<node_internals>/**/*.js"
]
}
]
}

We are defining a single launch configuration called Launch Server that will start our application (using the npm start command), and what is more important, it will look for a .env file in the project folder, and provide any <key>="<value>" pairs defined in this file as environment variables to our application. Let's create the .env file in the project folder, and populate it with our environment variables (using your own values instead of the placeholders of course):

FORGE_CLIENT_ID="your-client-id"
FORGE_CLIENT_SECRET="your-client-secret"
FORGE_BUCKET="optional-name-of-existing-bucket"
caution

Since the .env file contains sensitive information, make sure that it is not included in git! This can be ensured by adding the .env line to the .gitignore file.

Basic server

Next we'll create a basic server application.

Create a server.js file in the root of your project folder with the following code:

server.js
const express = require('express');
const { PORT } = require('./config.js');

let app = express();
app.use(express.static('wwwroot'));
app.listen(PORT, function () { console.log(`Server listening on port ${PORT}...`); });

For now the server isn't doing much, just serving static assets from the wwwroot subfolder (which is currently empty), and reporting any errors to the console and back to the client.

Next, let's add a "start": "node server.js" script to the package.json file so that we can easily run our application later:

// ...
"scripts": {
"start": "node server.js"
}
// ...

Try it out

Now that we have a basic application setup, let's try it out!

Start the application from Visual Studio Code (for example, via the Run > Start Debugging menu, or by pressing F5), and navigate to http://localhost:8080 in the browser. The server should respond with Cannot GET / because we haven't added any logic to it just yet. That's going to be the topic of the next step.