Bootstrapping a Typescript, Nodejs, Express API

3 min read

  • coding
  • typescript
  • nodejs
  • expressjs
  • api
  • technical

Published on January 18, 2022

You can also read this article in hashnode.

Initially verify that you have yarn and git installed in your system. Then enter the following commands.

  yarn init
  git init
  
  touch .gitignore

Add the following content in .gitignore or take node template from gitignore.io

  node_modules/
  
  build/
  
  .env

Then install the packages required for the project.

  yarn add express 
  
  yarn add -D @types/express @types/node ts-node-dev typescript

Add the following scripts to package.json

  {
    "name": "fuel-tracker-backend",
    ...
    "scripts": {
      "dev": "ts-node-dev --respawn --transpile-only src/app.ts",
      "build": "tsc"
    },
    "dependencies": {
      "express": "^4.17.2",
    },
    "devDependencies": {
      "@types/express": "^4.17.13",
      "@types/node": "^17.0.8",
      "ts-node-dev": "^1.1.8",
      "typescript": "^4.5.4"
    }
  }
  

Create src/app.js Then put a console log in app.js and run yarn dev The following is the folder structure that we are going to use.

``` bash
node_modules/
src/
└── app.ts
.gitignore
package.json
yarn.lock
```

Check if you are getting the output of the console.log in the terminal.

Then create the tsconfig file. Otherwise, the express app won't run

  npx tsc --init

Open tsconfig.json file that was created just now and set outDir to "./build". So the compiled javascript code will be outputted into the build folder

  {
    "compilerOptions": {
      /* Visit https://aka.ms/tsconfig.json to read more about this file */
  
      /* Projects */
      // "incremental": true,                              /* Enable incremental compilation */
      // "composite": true,                                /* Enable constraints that allow a TypeScript project to be used with project references. */
      // "tsBuildInfoFile": "./",                          /* Specify the folder for .tsbuildinfo incremental compilation files. */
      // "disableSourceOfProjectReferenceRedirect": true,  /* Disable preferring source files instead of declaration files when referencing composite projects */
      // "disableSolutionSearching": true,                 /* Opt a project out of multi-project reference checking when editing. */
      // "disableReferencedProjectLoad": true,             /* Reduce the number of projects loaded automatically by TypeScript. */
  
      /* Language and Environment */
      "target": "es2016",                                  /* Set the JavaScript language version for emitted JavaScript and include compatible library declarations. */
      // "lib": [],                                        /* Specify a set of bundled library declaration files that describe the target runtime environment. */
      // ......................................................................
      // "useDefineForClassFields": true,                  /* Emit ECMAScript-standard-compliant class fields. */
  
      /* Modules */
      "module": "commonjs",                                /* Specify what module code is generated. */
      // "rootDir": "./",                                  /* Specify the root folder within your source files. */
      // ......................................................................................
      // "sourceMap": true,                                /* Create source map files for emitted JavaScript files. */
      // "outFile": "./",                                  /* Specify a file that bundles all outputs into one JavaScript file. If `declaration` is true, also designates a file that bundles all .d.ts output. */
      "outDir": "./build",                                   /* Specify an output folder for all emitted files. */
      // "removeComments": true,                           /* Disable emitting comments. */
      // "noEmit": true,                                   /* Disable emitting files from a compilation. */
     // ......................................................................
      // ............................................................................
  
      /* Completeness */
      // "skipDefaultLibCheck": true,                      /* Skip type checking .d.ts files that are included with TypeScript. */
      "skipLibCheck": true                                 /* Skip type checking all .d.ts files. */
    }
  }
  

Then simply start coding the server

  import express from "express";
  
  const app = express();
  
  app.listen(5000, () => {
    console.log("App is running!");
  })

Kudos.