finish chapther 5 JSX

Author: oukayuka

01-hello/02-hello-world/.vscode/settings.json

@@ -1,9 +1,10 @@
 {
   "editor.formatOnSave": false,
+  "editor.lineNumbers": "on",
+  "editor.rulers": [
+    80
+  ],
   "editor.tabSize": 2,
-  "editor.tokenColorCustomizations": {
-    "semanticHighlighting": true
-  },
   "editor.wordWrap": "on",
   "files.insertFinalNewline": true,
   "files.trimTrailingWhitespace": true,

04-typescript/08-config/tsconfig.json

@@ -12,6 +12,7 @@
     "allowSyntheticDefaultImports": true,
     "strict": true,
     "forceConsistentCasingInFileNames": true,
+    "noFallthroughCasesInSwitch": true,
     "module": "esnext",
     "moduleResolution": "node",
     "resolveJsonModule": true,

05-jsx/02-jsx-usage/.vscode/extensions.json

@@ -6,9 +6,9 @@
   "recommendations": [
     "coenraads.bracket-pair-colorizer",
     "dbaeumer.vscode-eslint",
+    "donjayamanne.githistory",
     "esbenp.prettier-vscode",
     "msjsdiag.debugger-for-chrome",
-    "ms-vsliveshare.vsliveshare",
     "oderwat.indent-rainbow",
     "stylelint.vscode-stylelint",
     "VisualStudioExptTeam.vscodeintellicode",

05-jsx/02-jsx-usage/.vscode/settings.json

@@ -1,12 +1,12 @@
 {
   "editor.formatOnSave": false,
+  "editor.lineNumbers": "on",
+  "editor.rulers": [
+    80
+  ],
   "editor.tabSize": 2,
-  "editor.tokenColorCustomizations": {
-    "semanticHighlighting": true
-  },
   "editor.wordWrap": "on",
   "files.insertFinalNewline": true,
   "files.trimTrailingWhitespace": true,
-  "npm.packageManager": "yarn",
-  "typescript.tsdk": "./node_modules/typescript/lib"
+  "npm.packageManager": "yarn"
 }

05-jsx/02-jsx-usage/tsconfig.json

@@ -18,7 +18,7 @@
     "resolveJsonModule": true,
     "isolatedModules": true,
     "noEmit": true,
-    "jsx": "react-jsx"
+    "jsx": "react"
   },
   "include": [
     "src"

CHANGELOG.md

@@ -5,6 +5,10 @@
 
 ### 全体
 
+- 主なパッケージの対応バージョンを以下にアップデート
+    - **React**　17.0.0 RC1 → 17.0.1
+    - **Create React App**　3.4.3 → 4.0.1
+    - **TypeScript**　4.0.2 → 4.1.2
 - 「Visual Studio Code」の略称表記を「VSCode」から「VS Code」に修正
 - 「Mac OS」と表記していたものを「macOS」に修正
 - 「ビルトインオブジェクト」と表記していたものを「組み込みオブジェクト」に変更
@@ -23,6 +27,10 @@
 - 「4-5. さらに高度な型表現」に新しく「条件付き型とテンプレートリテラル型」項を追加
 - 「4-5. さらに高度な型表現」の「組み込みユーティリティ型」項にて、`Record` 型および文字列リテラルの各ユーティリティ型についての説明を追加
 
+### 第5章  JSX で UI を表現する
+
+- [新しい JSX 変換形式](https://ja.reactjs.org/blog/2020/09/22/introducing-the-new-jsx-transform.html)についての説明を随所に追加
+
 ## 第3版（2020-08-20）
 
 ### 第1章  こんにちは React