Thursday, April 22, 2021

Create Node.js & Express.js with Typescript Project

    Here are the steps to create Node.js & Express.js with Typescript Project.

    1. Create a folder.
    2. Type command "npm init" to create package files.
    3. Type "npm install -g typescript" to install typescript.
    4. Type "tsc --init" to create typescript config file.
    5. Type "npm install express --save" to download express module.
    6. Type "npm install nodemon --save-dev" to download nodemon developer tool.
    7. Type "install install @types/node --save-dev" to download typescript node definition files.
    8. Type "install install @types/express --save-dev" to download typescript express definition files.
    9. Edit the package.json
    10. Change to main to "dist/app.js" to point to the start javascript file.
    11. Add the start scripts, "start" : "nodemon dist/app.js"
    12. The package.json will look like below:
    13. Edit the tsconfig.json
    14. Add "moduleResolution" : "node" under "module" : "commonjs".
    15. Change the "outDir" : "./dist". This is the location where typescript compiles the javascript.
    16. Change the "rootDir" : "./srv". This is where we store the typescript files.
    17. The tsconfig.json will look like below:
    18. Create /src folder and add app.ts. Edit the app.ts with the below script.
      import express from "express";

      const app = express();
      const port = process.env.port || 3001;

      // Adding middleway to use syntax req.body.name.
      app.use(express.json());

      app.get("/", (reqres=> res.send("Hello World!"));

      app.listen(port, () =>
        console.log(`Example app is listening on post ${port}!`)
      );

    19. Open a terminal run "npm start". This will start the web server using nodemon.
    20. Open another terminal run "tsc --watch". This will watch the /src folder to compile the ts to javascript.
    21. Call http://localhost:3001/ using postman. If you see "Hello World!", congratulation, you have completed the setup Node.js & Express.js with the Typescript project.

    Below is the project you may download from GitHub.

    Below GitHub is the example of the Node.js & Express.js project. You may compare the different of project setup.

    No comments:

    Post a Comment