Handbook v2에 새롭게 추가된 문서 추가 (#110)

* lint fix

* remove twoslash

* lint fix

Author: bumkeyy

README.md

@@ -19,20 +19,6 @@
 
 그 밖에도 다양한 의견 및 피드백은 언제나 환영합니다:)
 
-## 2020 오픈소스 컨트리뷰톤 멘티 모집 (2020.6.1 ~ 7.6)
-공개 SW 포탈에서 현재 오픈소스 프로젝트 관련해서 멘티를 모집하고 있습니다.  
-오픈소스 프로젝트에 기여해 보고자 하는 마음이 있었지만 막상 도전하기 어려우셨다면 2020 오픈소스 컨트리뷰톤 참여를 추천드립니다 😄
-
-[오픈소스 컨트리뷰톤이란?](https://www.oss.kr/contributhon)
-
-<a href="https://www.oss.kr/contributhon_project/show/0c290a4d-e97d-4281-b5d3-4fbc1cc8b152"><img src="./assets/images/readme/oss-image.jpg"  width="300"></a>
-
-Github에 대해 아직 잘 모르시거나  
-이제 개발을 시작하는 초보 개발자시거나  
-TypeScript에 대해 공부를 하고 싶거나  
-TypeScript Handbook에 대해 번역 리뷰를 하고 싶으신 분이 있다면  
-강력하게 추천합니다! [신청하기](https://www.oss.kr/contributhon_project/show/0c290a4d-e97d-4281-b5d3-4fbc1cc8b152)
-
 ## 컨트리뷰터 목록 ✨
 
 도움 주셔서 감사합니다. ([emoji key](https://allcontributors.org/docs/en/emoji-key)):
@@ -43,7 +29,7 @@ TypeScript Handbook에 대해 번역 리뷰를 하고 싶으신 분이 있다면
 <table>
   <tr>
     <td align="center"><a href="https://github.com/yeonjuan/dev-blog"><img src="https://avatars3.githubusercontent.com/u/41323220?v=4" width="80px;" alt=""/><br /><sub><b>YeonJuan</b></sub></a><br /><a href="#translation-yeonjuan" title="Translation">🌍</a></td>
-    <td align="center"><a href="https://github.com/Bumkeyy"><img src="https://avatars0.githubusercontent.com/u/16663226?v=4" width="80px;" alt=""/><br /><sub><b>Kibeom Kwon</b></sub></a><br /><a href="#translation-Bumkeyy" title="Translation">🌍</a></td>
+    <td align="center"><a href="https://bumkeyy.gitbook.io/bumkeyy-code/"><img src="https://avatars0.githubusercontent.com/u/16663226?v=4" width="80px;" alt=""/><br /><sub><b>Kibeom Kwon</b></sub></a><br /><a href="#translation-Bumkeyy" title="Translation">🌍</a></td>
     <td align="center"><a href="https://guyeol.github.io"><img src="https://avatars3.githubusercontent.com/u/7357413?v=4" width="80px;" alt=""/><br /><sub><b>GuyeolJeong</b></sub></a><br /><a href="#translation-guyeol" title="Translation">🌍</a></td>
     <td align="center"><a href="https://github.com/dvlprsh"><img src="https://avatars1.githubusercontent.com/u/48552752?v=4" width="80px;" alt=""/><br /><sub><b>Seohee Park</b></sub></a><br /><a href="#translation-dvlprsh" title="Translation">🌍</a></td>
     <td align="center"><a href="https://devjang.github.io"><img src="https://avatars1.githubusercontent.com/u/23068523?v=4" width="80px;" alt=""/><br /><sub><b>poco.j</b></sub></a><br /><a href="#translation-devJang" title="Translation">🌍</a></td>

SUMMARY.md

@@ -2,47 +2,66 @@
 
 * [소개](README.md)
 
-## 튜토리얼
+## 시작하기
 
+* [TS for the New Programmer(en)](pages/tutorials/ts-for-the-new-programmer.md)
+* [TS for JS Programmers(en)](pages/tutorials/ts-for-js-programmers.md)
+* [TS for OOP Programmers(en)](pages/tutorials/ts-for-oopers.md)
+* [TS for Functional Programmers(en)](pages/tutorials/ts-for-functional-programmers.md)
 * [5분 안에 보는 TypeScript](pages/tutorials/typescript-in-5-minutes.md)
-* [ASP.NET Core](pages/tutorials/asp.net-core.md)
-* [걸프](pages/tutorials/gulp.md)
-* [JavaScript에서 마이그레이션](pages/tutorials/migrating-from-javascript.md)
-* [리액트 & 웹팩](pages/tutorials/react-&-webpack.md)
 
 ## 핸드북
 
+* [핸드북이란(en)](pages/the-handbook.md)
 * [기본 타입](pages/basic-types.md)
-* [변수 선언](pages/variable-declarations.md)
 * [인터페이스](pages/interfaces.md)
-* [클래스](pages/classes.md)
 * [함수](pages/functions.md)
-* [제네릭](pages/generics.md)
+* [리터럴 타입(en)](pages/literal-types.md)
+* [유니언과 교차 타입(en)](pages/unions-and-intersections.md)
+* [클래스](pages/classes.md)
 * [열거형](pages/enums.md)
-* [타입 추론](pages/type-inference.md)
-* [타입 호환성](pages/type-compatibility.md)
+* [제네릭](pages/generics.md)
+
+## 핸드북 레퍼런스
+
 * [고급 타입](pages/advanced-types.md)
-* [심볼](pages/symbols.md)
+* [선언 병합](pages/declaration-merging.md)
+* [데코레이터](pages/decorators.md)
+* [유틸리티 타입](pages/utility-types.md)
 * [이터레이터와 제네레이터](pages/iterators-and-generators.md)
+* [JSX](pages/jsx.md)
+* [믹스인](pages/mixins.md)
 * [모듈](pages/modules.md)
+* [모듈 해석](pages/module-resolution.md)
 * [네임스페이스](pages/namespaces.md)
 * [네임스페이스와 모듈](pages/namespaces-and-modules.md)
-* [모듈 해석](pages/module-resolution.md)
-* [선언 병합](pages/declaration-merging.md)
-* [JSX](pages/jsx.md)
-* [데코레이터](pages/decorators.md)
-* [믹스인](pages/mixins.md)
+* [심볼](pages/symbols.md)
 * [트리플-슬래시 지시자](pages/triple-slash-directives.md)
-* [JavaScript 파일 타입 검사](pages/type-checking-javaScript-files.md)
-* [유틸리티 타입](pages/utility-types.md)
+* [타입 호환성](pages/type-compatibility.md)
+* [타입 추론](pages/type-inference.md)
+* [타입스크립트와 DOM(en)](pages/tutorials/dom-manipulation.md)
+* [변수 선언](pages/variable-declarations.md)
+
+## 튜토리얼
+
+* [ASP.NET Core](pages/tutorials/asp.net-core.md)
+* [걸프](pages/tutorials/gulp.md)
+* [JavaScript에서 마이그레이션](pages/tutorials/migrating-from-javascript.md)
+* [TypeScript와 Babel 사용하기(en)](pages/tutorials/babel-with-typescript.md)
+* [리액트 & 웹팩](pages/tutorials/react-&-webpack.md)
+
+## 릴리즈 노트
+
+* [TypeScript 3.9](pages/release-notes/typescript-3.9.md)
+* [TypeScript 3.8](pages/release-notes/typescript-3.8.md)
 
 ## 선언 파일
 
 * [소개](pages/declaration-files/introduction.md)
-* [Library Structures](pages/declaration-files/library-structures.md)
 * [By Example](pages/declaration-files/by-example.md)
 * [Do's and Don'ts](pages/declaration-files/dos-and-don-ts.md)
 * [Deep Dive](pages/declaration-files/deep-dive.md)
+* [Library Structures](pages/declaration-files/library-structures.md)
 * [Templates](pages/declaration-files/templates.md)
     * [global-modifying-module.d.ts](pages/declaration-files/templates/global-modifying-module.d.ts.md)
     * [global-plugin.d.ts](pages/declaration-files/templates/global-plugin.d.ts.md)
@@ -54,17 +73,20 @@
 * [Publishing](pages/declaration-files/publishing.md)
 * [Consumption](pages/declaration-files/consumption.md)
 
+## 자바스크립트
+
+* [JavaScript에 TypeScript 적용하기(en)](pages/intro-to-js-with-ts.md)
+* [JavaScript 파일 타입 검사](pages/type-checking-javaScript-files.md)
+* [JSDoc 레퍼런스(en)](pages/jsdoc-reference.md)
+* [.js 파일에서 d.ts 파일 만들기(en)](pages/declaration-files/creating-dts-files-from-js.md)
+
 ## 프로젝트 환경설정
 
 * [tsconfig.json](pages/tsconfig.json.md)
 * [컴파일러 옵션](pages/compiler-options.md)
 * [프로젝트 레퍼런스](pages/project-references.md)
 * [MSBuild에서의 컴파일러 옵션](pages/compiler-options-in-msbuild.md)
 * [빌드 도구와 통합](pages/integrating-with-build-tools.md)
-* [Nightly 빌드](pages/nightly-builds.md)
 * [configuring-watch (en)](pages/configuring-watch.md)
+* [Nightly 빌드](pages/nightly-builds.md)
 
-## 릴리즈 노트
-
-* [TypeScript 3.9](pages/release-notes/typescript-3.9.md)
-* [TypeScript 3.8](pages/release-notes/typescript-3.8.md)

pages/declaration-files/creating-dts-files-from-js.md

@@ -0,0 +1,87 @@
+---
+title: Creating .d.ts Files from .js files
+layout: docs
+permalink: /docs/handbook/declaration-files/dts-from-js.html
+oneline: "How to add d.ts generation to JavaScript projects"
+---
+
+[With TypeScript 3.7](/docs/handbook/release-notes/typescript-3-7.html#--declaration-and---allowjs),
+TypeScript added support for generating .d.ts files from JavaScript using JSDoc syntax.
+
+This set up means you can own the editor experience of TypeScript-powered editors without porting your project to TypeScript, or having to maintain .d.ts files in your codebase.
+TypeScript supports most JSDoc tags, you can find [the reference here](/docs/handbook/type-checking-javascript-files.html#supported-jsdoc).
+
+## Setting up your Project to emit .d.ts files
+
+To add creation of .d.ts files in your project, you will need to do up-to four steps:
+
+* Add TypeScript to your dev dependencies
+* Add a `tsconfig.json` to configure TypeScript
+* Run the TypeScript compiler to generate the corresponding d.ts files for JS files
+* (optional) Edit your package.json to reference the types
+
+### Adding TypeScript
+
+You can learn how to do this in our [installation page](/download).
+
+### TSConfig
+
+The TSConfig is a json5 file which configures both your compiler flags, and declare where to find files.
+In this case, you will want a file like the following:
+
+```json5
+{
+  // Change this to match your project
+  include: ["src/**/*"],
+
+  compilerOptions: {
+    // Tells TypeScript to read JS files, as
+    // normally they are ignored as source files
+    allowJs: true,
+    // Generate d.ts files
+    declaration: true,
+    // This compiler run should
+    // only output d.ts files
+    emitDeclarationOnly: true,
+    // Types should go into this directory.
+    // Removing this would place the .d.ts files
+    // next to the .js files
+    outDir: "dist",
+  },
+}
+```
+
+You can learn more about the options in the [tsconfig reference](/reference).
+An alternative to using a TSConfig file is the CLI, this is the same behavior as a CLI command.
+
+```sh
+npx typescript src/**/*.js --declaration --allowJs --emitDeclarationOnly --outDir types
+```
+
+## Run the compiler
+
+You can learn how to do this in our [installation page](/download).
+You want to make sure these files are included in your package if you have the files in your project's `.gitignore`.
+
+## Editing the package.json
+
+TypeScript replicates the node resolution for modules in a `package.json`, with an additional step for finding .d.ts files.
+Roughly, the resolution will first check the optional `"types"` field, then the `"main"` field, and finally will try `index.d.ts` in the root.
+
+| Package.json              | Location of default .d.ts      |
+| :------------------------ | :----------------------------- |
+| No "types" field          | checks "main", then index.d.ts |
+| "types": "main.d.ts"      | main.d.ts                      |
+| "types": "./dist/main.js" | ./main/main.d.ts               |
+
+If absent, then "main" is used
+
+| Package.json             | Location of default .d.ts |
+| :----------------------- | :------------------------ |
+| No "main" field          | index.d.ts                |
+| "main":"index.js"        | index.d.ts                |
+| "main":"./dist/index.js" | ./dist/index.d.ts         |
+
+## Tips
+
+If you'd like to write tests for your .d.ts files, try [tsd](https://github.com/SamVerschueren/tsd).

pages/intro-to-js-with-ts.md

@@ -0,0 +1,69 @@
+---
+title: JS Projects Utilizing TypeScript
+layout: docs
+permalink: /docs/handbook/intro-to-js-ts.html
+oneline: How to add type checking to JavaScript files using TypeScript
+---
+
+The type system in TypeScript has different levels of strictness when working with a codebase:
+
+* A type-system based only on inference with JavaScript code
+* Incremental typing in JavaScript [via JSDoc](/docs/handbook/jsdoc-supported-types.html)
+* Using `// @ts-check` in a JavaScript file
+* TypeScript code
+* TypeScript with [`strict`](/tsconfig#strict) enabled
+
+Each step represents a move towards a safer type-system, but not every project needs that level of verification.
+
+## TypeScript with JavaScript
+
+This is when you use an editor which uses TypeScript to provide tooling like auto-complete, jump to symbol and refactoring tools like rename.
+The [homepage](/) has a list of editors which have TypeScript plugins.
+
+## Providing Type Hints in JS via JSDoc
+
+In a `.js` file, types can often be inferred. When types can't be inferred, they can be specified using JSDoc syntax.
+
+JSDoc annotations come before a declaration will be used to set the type of that declaration. For example:
+
+```js twoslash
+/** @type {number} */
+var x;
+
+x = 0; // OK
+x = false; // OK?!
+```
+
+You can find the full list of supported JSDoc patterns [in JSDoc Supported Types](/docs/handbook/jsdoc-supported-types.html).
+
+## `@ts-check`
+
+The last line of the previous code sample would raise an error in TypeScript, but it doesn't by default in a JS project.
+To enable errors in your JavaScript files add: `// @ts-check` to the first line in your `.js` files to have TypeScript raise it as an error.
+
+```js twoslash
+// @ts-check
+// @errors: 2322
+/** @type {number} */
+var x;
+
+x = 0; // OK
+x = false; // Not OK
+```
+
+If you have a lot of JavaScript files you want to add errors to then you can switch to using a [`jsconfig.json`](/docs/handbook/tsconfig-json.html).
+You can skip checking some files by adding a `// @ts-nocheck` comment to files.
+
+TypeScript may offer you errors which you disagree with, in those cases you can ignore errors on specific lines by adding `// @ts-ignore` or `// @ts-expect-error` on the preceding line.
+
+```js twoslash
+// @ts-check
+/** @type {number} */
+var x;
+
+x = 0; // OK
+// @ts-expect-error
+x = false; // Not OK
+```
+
+To learn more about how JavaScript is interpreted by TypeScript read [How TS Type Checks JS](/docs/handbook/type-checking-javascript-files.html)