Create Node API in second with Zeit now and typescript

.eslintrc.json

{
  "env": {
    "es6": true,
    "node": true
  },
  "extends": ["airbnb-typescript", "plugin:prettier/recommended"],
  "globals": {
    "Atomics": "readonly",
    "SharedArrayBuffer": "readonly"
  },
  "parser": "@typescript-eslint/parser",
  "parserOptions": {
    "ecmaVersion": 2018,
    "sourceType": "module",
    "project": "./tsconfig.json"
  },
  "plugins": ["prettier", "@typescript-eslint"],
  "rules": {
    /**
     * @description rules of eslint official
     */
    "import/prefer-default-export": "off", // Allow single Named-export

    /**
     * @description rules of @typescript-eslint
     */
    "@typescript-eslint/type-annotation-spacing": ["warn"],
    "indent": "off",
    "@typescript-eslint/indent": "off",
    "@typescript-eslint/consistent-type-definitions": ["error", "interface"],
    "@typescript-eslint/no-floating-promises": ["warn"],

    /**
     * @description rules of eslint-plugin-import
     */
    "import/no-unresolved": "off",

    /**
     * @description rules of prettier
     */
    "prettier/prettier": "warn"
  }
}

README.md

Create project:

npm init private

npm install @now/node

Setup prettier

curl -o .prettierrc https://gist.githubusercontent.com/vdelacou/58484f1c11af70aaa457f4e5c289e893/raw/.prettierrc

curl -o .prettierignore https://gist.githubusercontent.com/vdelacou/58484f1c11af70aaa457f4e5c289e893/raw/.prettierignore

Configure vscode

mkdir .vscode
curl -o .vscode/extensions.json https://gist.githubusercontent.com/vdelacou/58484f1c11af70aaa457f4e5c289e893/raw/.vscode_extensions.json
curl -o .vscode/settings.json https://gist.githubusercontent.com/vdelacou/58484f1c11af70aaa457f4e5c289e893/raw/.vscode_settings.json

curl -o .editorconfig https://gist.githubusercontent.com/vdelacou/58484f1c11af70aaa457f4e5c289e893/raw/.editorconfig

Install and init eslint

npm install --save-dev eslint eslint-plugin-flowtype@3

./node_modules/.bin/eslint --init

Reply as follow:

• How would you like to use ESLint? To check syntax, find problems, and enforce code style
• What type of modules does your project use? JavaScript modules (import/export)
• Which framework does your project use? None of these
• Does your project use TypeScript? Yes
• Where does your code run? Node
• How would you like to define a style for your project? Use a popular style guide
• Which style guide do you want to follow? Airbnb: https://github.com/airbnb/javascript
• What format do you want your config file to be in? JSON

Then install the prettier plugin

npm install --save-dev eslint-config-airbnb-typescript prettier eslint-config-prettier eslint-plugin-prettier

Add the Rules for prettier to the .eslintrc.json

curl -o .eslintrc.json https://gist.githubusercontent.com/vdelacou/d6a880059777451a913acd962b8e43a8/raw/.eslintrc.json

curl -o .eslintignore https://gist.githubusercontent.com/vdelacou/58484f1c11af70aaa457f4e5c289e893/raw/.eslintignore

Configure lint with husky

npm install --save-dev husky

Add to you package.json

  "husky": {
    "hooks": {
      "pre-commit": "npm run lint",
      "pre-push": "npm run lint"
    }
  }

Add to your script in package.json

"scripts": {
  ...
  "lint": "eslint . --ext .js,.ts",
  ...
}

Install typescript and add tsconfig

npm install --save typescript

curl -o tsconfig.json https://gist.githubusercontent.com/vdelacou/d6a880059777451a913acd962b8e43a8/raw/tsconfig.json

Create the first api:

mkdir api

curl -o api/user.ts https://gist.githubusercontent.com/vdelacou/d6a880059777451a913acd962b8e43a8/raw/user.ts

You can now launch to try your api locally

now dev (need deploy one time first with now)

Then you can try you api:

curl --request GET http://localhost:3000/api/user

tsconfig.json

{
  "compilerOptions": {
    "target": "es6",
    "module": "commonjs",
    "lib": ["es2016"],
    "strict": true,
    "noImplicitAny": true,
    "strictNullChecks": true,
    "strictFunctionTypes": true,
    "strictBindCallApply": true,
    "strictPropertyInitialization": true,
    "noImplicitThis": true,
    "alwaysStrict": true,
    "esModuleInterop": true
  }
}

user.ts

import { NowRequest, NowResponse } from '@now/node';

export default (req: NowRequest, res: NowResponse): void => {
  res.json({ name: 'Johne', email: 'john@example.com' });
};

// export default async (req: NowRequest, res: NowResponse): Promise<void> => {