Start and Setup a NodeJs Typescript Project
Guilherme Niches
Posted on February 6, 2023
Start a new project usually involves a serie of commands and not always we remember all this commands and the main dependencies that we normally use.
This article show us one of many ways to start and setup a new NodeJs Typescript project.
Before this, some fast definitions of the tools we will use:
- NodeJs
"NodeJs is an open-source, cross-platform JavaScript runtime environment."
In other words, NodeJs allow us use Javascript in the server-side, without the need of a web browser.
- Typescript
Typescript is a superset of JavaScript, this basically means that the Typescript adds static typing on top of JavaScript.
Note: This article assumes that you already have NodeJS and some package manager installed on your machine. If you doesn't, check this links first:
Commands to start a NodeJS TS Project
- TS/Node dependencies
yarn add typescript ts-node ts-node-dev @types/node
OR
npm i typescript ts-node ts-node-dev @types/node
tsconfig.json
Create tsconfig.json (Visit https://aka.ms/tsconfig.json to read more about this file) file in the root directory of your project with the following structure:
{
"compilerOptions": {
/*Basic Options*/
"target": "es2018", /* Specify ECMAScript target version: 'ES3' (default), 'ES5', 'ES2015', 'ES2016', 'ES2017', 'ES2018', 'ES2019', 'ES2020', 'ES2021', or 'ESNEXT'. */
"module": "commonjs", /* Specify module code generation: 'none', 'commonjs', 'amd', 'system', 'umd', 'es2015', 'es2020', or 'ESNext'. */
"allowJs": true, /* Allow javascript files to be compiled. */
"outDir": "./dist", /* Redirect output structure to the directory. */
"rootDir": "./src", /* Specify the root directory of input files. Use to control the output directory structure with --outDir. */
/* Strict Type-Checking Options */
"strict": true, /* Enable all strict type-checking options. */
"esModuleInterop": true, /* Enables emit interoperability between CommonJS and ES Modules via creation of namespace objects for all imports. Implies 'allowSyntheticDefaultImports'. */
/* Advanced Options */
"skipLibCheck": true, /* Skip type checking of declaration files. */
"forceConsistentCasingInFileNames": true /* Disallow inconsistently-cased references to the same file. */
}
}
According to this configuration you should write your code in src/ folder and should have an entry point file called server.ts inside.
Our project structure should be similar to this:
.
├── src
├── server.ts
Inside the file server.ts we could put a simple log just to got a return when we run the server.
console.log("Server is Up");
package.json
Add dev, dev:debug and build scripts to your package.json file,
- Dev: Uses ts-node-dev to start a dev server that automatically transpiles your .ts files to .js whenever you edit something. (More info at https://www.npmjs.com/package/ts-node-dev)
- Build: Uses tsc to transpile your whole application to .js, is used when you want to deploy to production. (More info at https://www.typescriptlang.org/docs/handbook/compiler-options.html)
- Dev:debug: Uses ts-node-dev --inspect to start a debug function at port defined after '=' in inspect flag.
"scripts": {
"dev": "ts-node-dev --respawn src/server.ts",
"dev:debug": "ts-node-dev --inspect=0.0.0.0:9229 src/server.ts",
"build": "tsc",
"start": "node dist/server.js"
}
Run
npm run dev
OR
yarn dev
Dev:debug
npm run dev:debug
OR
yarn dev:debug
Build
npm run build
OR
yarn build
Optional
These steps above are enough to start and run a NodeJS Typescript project, it's a 'clean' install. But, normally, we want start a project with some dev dependencies.
The following steps are optional and will install some dependencies commonly used with NodeJS.
- Express => NodeJs framework to handling with routes (http://expressjs.com/)
npm i express --save
OR
yarn add express -D
- Sequelize or TypeORM => ORMs (https://sequelize.org/) || (https://typeorm.io/#/)
npm i sequelize --save
OR
npm i typeorm --save
OR
yarn add sequelize -D
OR
yarn add typeorm -D
Some other dependencies often used with NodeJS/Typescript project:
- Eslint => Identify code patterns in disagreement with pre-established rules (https://eslint.org/)
- PostgreSql or MongoDB => Relational Database and NoSql Database (MongoDb)
Extra
NPM Package
If you are writing a npm package specify main and types path and add --declaration to your build script in order to generate types suggestions to who is using your package.
package.json
"main" : "dist/index.js",
"types" : "dist/index.d.ts",
"scripts": {
"build": "tsc --declaration"
}
Concluding
This is one of many ways to start and setup a new NodeJs Typescript project, you can do the same in different ways even faster. But, I like to do in this way because is more "step-by-step" form.
Reviews, suggestions and/or contributions to this article are encouraged and welcome.
References
Posted on February 6, 2023
Join Our Newsletter. No Spam, Only the good stuff.
Sign up to receive the latest update from our blog.