lemon-typescript-template

Done

• eslint
• prettier
• editorconfig
• gitignore
• nvmrc
• testing(jest)
• tsconfig
• husky & lint-staged
• travis-ci
• codecov
• typedoc
• npm module(publish)

Prerequisite

nodemon

$ npm install -g nodemon

nvm

$ nvm use
Found '/Users/tak/workspace/lemoncloud/api/lemon-typescript-template/.nvmrc' with version <8.10.0>
Now using node v8.10.0 (npm v5.6.0)

---

How to use

Installation

$ npm install

Build for typescript

$ npm run build

Development

$ npm start

Test

$ npm test
$ npm run dev:test # 개발할 때 사용, --watchAll 추가 

Lint

$ npm run lint

Publish to npm(module)

$ npm login
Username:
 
$ npm publish

Documentation

$ npm run doc
$ npm run doc:publish # gh-pages 만들기 

---

Travis-CI 설정

• travis-ci에서 github로 sign-up 및 계정 access 허용
• .travis.yml 파일 추가
• push or pull request 날려보기
• 아래 이미지처럼 나와야함

뱃지다는 법

• traivs-ci repository의 이름 옆에 있는 뱃지 클릭
• 브랜치 및 URL 형식 설정(여기서는 Markdown)

• 링크 복사 및 README.md에 추가

2019.05.13: lemoncloud-io에서 travis-ci 권한 얻을 수 없어서 fork 뜬 후에 louis repo에서 진행

---

Codecov

• jest와 codecov를 이용하여 테스트코드의 코드 커버리지를 리포트할 수 있다.
• travis-ci처럼 codecov에 github로 로그인하여 repository와 sync한다.

Install codecov

$ npm install --save-dev codecov

Report coverage

$ npm run test
# 위 명령어 실행 후, coverage 폴더가 생성된다. 
$ ./node_modules/.bin/codecov --token="....." # token은 codecov에서 확인가능하다. 

travis-ci와 연동

• .travis.yml 파일에서 env 및 after_success 설정해준다.

---

TODO

• Setup serverless

Setup

$ nvm use
$ npm init 
$ npm install --save body-parser cors dotenv express morgan serverless-http winston
$ npm install --save-dev typescript ts-jest serverless nodemon jest husky concurrently
$ npm install --save-dev @types/cors @types/dotenv @types/jest @types/morgan @types/winston
 
# eslint, prettier 
$ npm install eslint @typescript-eslint/eslint-plugin @typescript-eslint/parser --save-dev
$ npm install prettier eslint-config-prettier --save-dev
$ npm install @types/supertest --save-dev

VSCode plugins

• Editorconfig
• eslint
• prettier

How to setup VSCode

• eslint, prettier plugin 설치
• vscode의 settings.json 오픈 후 아래 코드 추가

    ...
 
    "eslint.validate": [
        "javascript",
        "javascriptreact",
        {
            "language": "typescript",
            "autoFix": true
        },
        {
            "language": "typescriptreact",
            "autoFix": true
        }
    ],
    "prettier.eslintIntegration": true,
    "javascript.format.enable": false,
    "eslint.autoFixOnSave": true,
    "[javascript]": {
        "editor.formatOnSave": false,
        "editor.defaultFormatter": "esbenp.prettier-vscode"
    },
    "[typescript]": {
        "editor.formatOnSave": false,
        "editor.defaultFormatter": "esbenp.prettier-vscode"
    },
    "[javascriptreact]": {
        "editor.formatOnSave": false,
        "editor.defaultFormatter": "esbenp.prettier-vscode"
    },
    "[typescriptreact]": {
        "editor.formatOnSave": false,
        "editor.defaultFormatter": "esbenp.prettier-vscode"
    },
 
    ...