How to set up a Parse Server backend with Typescript
Tags: typescript, javascript, tutorial, devops
Published: 2022-12-01 13:49:14

_Originally posted on [ubiqueIoT](https://www.ubiqueiot.com/posts/parse-server-getting-started)_

[Parse Server](https://parseplatform.org/) is a great way to quickly spin up a backend for your project. Parse is a Node based utility that sits on top of ExpressJS. 

![parse logo](https://parseplatform.org/img/logo.svg)

It abstracts a lot of the backend code for us so we can spend more time focusing on the front end code. 

In combination with Parse, Typescript can really shine when dealing with our routing and database calls. 


## Let's walk through how to set up a Parse Server project using Typescript. 

First, start by cloning the [Parse Server Example project](https://github.com/parse-community/parse-server-example) in a directory of your choosing.

```bash
git clone https://github.com/parse-community/parse-server-example.git
```

Rename `parse-server-example` directory to what ever you would like and open the folder in a code editor of your choice. 

Install the dependencies: 

```bash
npm install
```

Next, install the typescript compiler globally, if not already installed on your local machine.

```bash
sudo npm install -g typescript
```

We also need to install typescript to your project in order to compile the Javascript code on our Elasticbeanstalk instance. 

```bash
npm install typescript
```

Install our types for the Parse project. 

```bash
npm install @types/parse --save
```

Add a `tsconfig.json` file to the root directory of your project with the following options:

```json
{
    "compilerOptions": {
        "allowSyntheticDefaultImports" : true,
        "module": "commonjs",
        "esModuleInterop": false,
        "target": "es2016",
        "noImplicitAny": true,
        "moduleResolution": "node",
        "sourceMap": false,
        "outDir": "dist",
        "rootDir": "src",
        "baseUrl": ".",
        "allowJs": true,
        "paths": {
            "*": [
                "node_modules/*",
                "src/*"
            ]
        }
    },
    "include": [
        "src/**/*"
    ]
}
```

Make a `src` folder in the root directory of this project. 

Move the entire `./cloud` folder into `./src`. 

Move `index.js` into the `./src` folder.

Notice how this matches the path defined in the `rootDir` tsconfig options.

Run a `tsc` command in your terminal (make sure to have typescript installed globally).

If everything works as expected, a `./dist` folder should've been generated by the typescript compiler. 

Finally, let's add the `dist` folder to the `./.gitignore` file so that we can be sure our code is compiled on the server each time we deploy. 

```yaml
# Typescript
dist
```


## Tell Parse where to find our compiled Typescript code

Open `./package.json` and update the `start` script:

```json
"start": "node ./dist/index.js",
```

Rename `main.js` → `main.ts` and `functions.js` → `functions.ts`. 

Replace contents of `functions.ts` with the following. We're just adding the `any` type to the request parameter for now to shut up our compiler. 

```js
Parse.Cloud.define('hello', (req: any) => {
  req.log.info(req);
  return 'Hi';
});

Parse.Cloud.define('asyncFunction', async (req: any) => {
  await new Promise(resolve => setTimeout(resolve, 1000));
  req.log.info(req);
  return 'Hi async';
});

Parse.Cloud.beforeSave('Test', () => {
  throw new Parse.Error(9001, 'Saving test objects is not available.');
});
```

Run another `tsc` command in your root directory to confirm everything compiles correctly. You should see your `./dist` folder filled javascript versions of your `main` and `functions` files. 

Try starting the server with an `npm run start` command.

If everything is working as expected, we should see the server start, then error out after ~30 seconds because Parse could not connect to a MongoDB instance. 

We will configure the MongoDB Atlas instance in a future post.