Tutorial
Project Setup

Project Setup

In this section, you will learn how to create a basic NodeJS project with TypeScript.

This step will cover the initial Node.js setup required, basic configuration for TypeScript projects, and how to setup the development scripts.

Requirements

  • Have NodeJS installed on your operation system (instructions). You can use any recent version (14/16/17), but, we highly recommend using the stable Node.js 20 LTS release.
  • Your favorite terminal configured (you are going to use it a lot!)
  • Run node -v, npm -v, npx -v in your terminal and make sure these commands are available for use.

Creating Node.js & TypeScript Project

This tutorial teaches you how to build a NodeJS project from scratch, so the first thing you need to do is create the directory that’ll hold the files for your project:

Open your terminal, navigate to a location of your choice, and run the following commands:

mkdir hackernews-node-ts
cd hackernews-node-ts
npm init -y

This creates a new directory called hackernews-node-ts and initializes it with a package.json file.

The package.json is the configuration file for the Node.js app you’re building. It lists all dependencies and other configuration options (such as scripts) needed for the app.

To add TypeScript supports for your NodeJS project, do the following:

In your project directory, install the packages required to run a TypeScript project:

npm i -D --save-exact typescript@5.1.6 @types/node@18.16.16 ts-node@10.9.1 ts-node-dev@2.0.0 cross-env@7.0.3

This will add the dependencies to your project under the node_modules folder, and update the package.json.

The command above installs the following libraries:

  • typescript is the basic TypeScript language support and compiler.
  • @types/node is a package that contains the basic TypeScript types for Node.js environment.
  • ts-node and ts-node-dev are libraries that allow you to run .ts files directly, without a compilation step to JavaScript and automatically re-run your files after you apply file changes.
  • cross-env allows providing environment variables cross-platform (windows environment variables are different 🤷).

Now, initialize a new TypeScript configuration for your project using the following command:

npx tsc --init

This will create a tsconfig.json file in your project. The tsconfig.json is the TypeScript configuration file, and it exists per-project. This is where you tell TypeScript compiler which files to compile and how to compile.

To make it easier to run your project, replace the "scripts" section in your package.json file with the following:

package.json
{
  "name": "hackernews-node-ts",
  "version": "1.0.0",
  "description": "",
  "scripts": {
    "dev": "cross-env NODE_ENV=development ts-node-dev --exit-child --respawn src/main.ts",
    "start": "ts-node src/main.ts"
  },
  "devDependencies": {
    "cross-env": "7.0.3",
    "@types/node": "18.16.16",
    "ts-node": "10.9.1",
    "ts-node-dev": "2.0.0",
    "typescript": "5.5.2"
  }
}

This will allow you to run the following scripts in your project directory:

  • npm run start - will start the server.
  • npm run dev - will start the server and restarts it on every change.

Now create the root entry point for your project, by creating a file under src/main.ts with the following:

src/main.ts
console.log('Hello World!')

And to run your server in watch mode, run in your terminal:

npm run dev
💡

Watch mode tracks your project’s files and re-runs your project automatically on a file change.

You should now see some log output regarding your build process, followed by:

Hello World!
💡

You can try to change the script, and notice that the server restarts automatically on every change!

The main.ts is the project entrypoint - this is where your NodeJS project starts and this runs the rest of the code.

Congratulations! You now have a ready-to-use project with NodeJS, TypeScript and development scripts configured.

The next step will show you how to setup a basic GraphQL schema and a GraphQL server!

IntroductionGetting Started