yytypescript / book Goto Github PK
View Code? Open in Web Editor NEWTypeScriptの入門書『サバイバルTypeScript』
Home Page: https://typescriptbook.jp
TypeScriptの入門書『サバイバルTypeScript』
Home Page: https://typescriptbook.jp
TypeScriptプロジェクトではどこまでGitでバージョン管理したらいいですか?
TypeScript初心者はコンパイラが生成するJSもバージョン管理すべきなのか分からない人もいると思うので、本書で明確な方針と具体的な設定を説明したほうがいいと思いました。
「作って学ぶ」の章。
Googleからの検索流入を見ると
といったエラーメッセージで検索してくることが結構なボリュームであります。
この解決策を書いておいてあげたほうが、困ってる人を助けられそうです。
コードブロックでファイル名を表現するのにコメントを使っているところがある:
```typescript
// hoge.ts
...
```
これをtitle
属性を使った書き方に直す:
```typescript title="hoge.ts"
...
```
コードの前後に半角スペースが入っているページがある。コード前後のスペースはスタイルシートでやるべきところなので、スペースを除去する。
数値型は `number` です <!--❌-->
数値型は`number`です <!--⭕️-->
「索引: 記号とキーワード」読みました!
https://github.com/yytypescript/book/blob/master/symbols-and-keywords.md
とてもありがたいです!検索が難しかったりの悩みが解決されました。
そこで、2点提案したいのですが、
2は賛否分かれそうなので、1がメインの提案です。
!
非Nullアサーション(Non-null assertion operator)
索引:記号とキーワードにgetとsetを加えてほしいです。
get構文は、オブジェクトのプロパティを関数に結びつけ、プロパティが参照された時に関数が呼び出されるようにします。
https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Functions/get
set 構文は、あるオブジェクトプロパティを関数にバインドして、プロパティに設定しようとしたときに呼び出される関数に結びつけます。
https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Functions/set
初めてgetterやsetterを見た人は、「JavaScript get」や「TypeScript set」で検索すると想定されます。ところが、検索結果にゲッターセッター以外の情報が多数混じっています。getならGETリクエスト、setならSetオブジェクトなど。中にはゲッター、セッターの情報にたどり着かない人もいるかもしれません。getとsetが索引にあることで、自分が調べているget/setが何なのか明確になると思います。
公式ドキュメントよりサバイバルTypeScriptを読むべきセールスポイントは何ですか?
サバイバルTypeScriptには公式ドキュメントにない次の特徴があります。
Reactいいねボタンのチュートリアルにyarn start
する手順がありますが、これを停止するにはどうしたらいいですか?
Control + Cを押すと止まる。
シェルコマンドの止め方が分からない人もいるということがわかったので丁寧に説明したほうがよさそうです。
Reactいいねボタンチュートリアル
関連: #98
カタカナ語の末尾長音をつけるかつけないかが曖昧だったため、執筆や表記のゆれを統一する際、textlintを設定する際にその都度考える必要があります。
できるだけ決定論的に決まるようにしたいというのが、このissueの提案です。
基準としては、3つあります。
例: キー, アロー, エラー, カリー, キュー, コピー, フロー, オーバー, カロリー, ゲッター, サーバー, セッター, ナンバー, バリュー, ヘッダー, ベンダー, フッター, ボディー, メンバー, メーラー, ユーザー, ライター, ランナー
5文字以上になると、末尾長音は違和感が大きくなるため、つけないほうが無難です。「エンジニアー」は変です。また、長音の情報量はほぼゼロなので、無駄は省くほうが文の文字数が節約できて読みやすいと思います。
例: アクセサリ, アクセッサ, アセンブラ, アセンブリ, エンジニア, コンパイラ, デコレータ, パラメータ, プリティア, プログラマ, プロバイダ, プロパティ, リポジトリ, コンピュータ, ジェネレータ, フォーマッタ, ボランティア, インターセプタ, コンストラクタ, トランスパイラ, コントリビュータ
ただし「インタビュー」のような例外があってもいいものとします。
合成語は各単語ごとの判定になります。例えば、「キーバリュー」を1単語扱いするとちょうど6文字で、このルールを適用すると「キーバリュ」になってしまい、これはおかしいからです。
「エディター」vs「エディタ」だと「エディタ」のほうが多数派ですが、「コミッター」vs「コミッタ」は「コミッター」のほうが多数派です。したがって、長音を含んだとき5文字なる単語は、ケースバイケースでの判定となります。
例: エディタ, バイナリ, バンドラ, レビュア, ウォーター, カレンダー, コミッター, サイドバー, ストーリー, プレビュー, ポピュラー, メタファー, メンテナー, リテラシー
5文字のときだけ決定論的になりませんが、それ以外は決定論的になるので、基準がまったく無いよりマシだと考えます。
記号とキーワードにvoid
を追加します。
JavaScriptとTypeScriptでvoidが違う意味になります。JavaScriptはvoid演算子、TypeScriptはvoid型です。JavaScriptに詳しくない人にとっては、コード中に出てきたものがvoid演算子なのかvoid型なのか分かりにくいと思ったからです。
有用な資料の作成と公開に感謝します。
戻り値にも型を書く
book/docs/tutorials/make-a-simple-function-via-cli.md
Lines 101 to 120 in 4d15317
Type 'number' is not assignable to type 'string'.
return num + 1;
~~~~~~~~~~~~~~~
説明のコンパイルメッセージを得るには、
「1」をクォートで囲む必要があるはずです。
return num + "1";
classes.mdのprivateセクションにあるコードブロックのコメントに誤りがあります。
https://github.com/yytypescript/book/blob/master/features/classes.md
AsIs:// public
からprotected
に変更
ToBe:// public
からprivate
に変更
まだCIでTypeScriptのチェックをしていなかったので追加する。
"14.x"
だと条件が厳しいので ">=14.x"
にできませんでしょうか
「コンパイラー」と「コンパイラ」で表記の揺れがあったので、どちらかに統一したいです。
エラーが起きないようにするには、brew installでLTSを指定するようにするか、React側の問題もあるのでReactのチュートリアルを直すか、など考えられる
型定義ファイルが同梱されていないJavaScript製のNPMパッケージを、TypeScriptプロジェクトで使うにはどうしたらいいですか?
JavaScriptしかないnpmライブラリがあって、vueやらReactやらAngularで使いたい時どうしたらいいですか?
require
コンソールの出力結果を表現するコメントの書き方を統一します。
現在次のようなバリアントがあります。
console.log(1); // -> 1
console.log(1); //=> 1
console.log(1); // 1
test
(素晴らしい本の執筆ありがとうございます!)
最後の console.log(result3)
を実行すると、Promise { <pending> }
が出力されてしまいます。
request1().then((result1) => {
return request2(result1);
}).then((result2) => {
const result3 = request3(result2);
console.log(result3); // -> 4 -> /*** Promise { <pending> } が出力される ***/
});
おそらく以下が正しいと思われます。
request1().then((result1) => {
return request2(result1);
}).then((result2) => {
return request3(result2);
}).then((result3) => {
console.log(result3)
})
ご確認よろしくお願いします。
TECH PLAY女子部に参加させていただき、本書を使ってTypescriptを勉強させていただきました。(わざわざ参加者向けのメッセージやIssueのリンクを貼ってくださり、ありがとうございます!!)
とてもわかりやすく理解できました、本書を書いていただきありがとうございます!
もくもく会で読み進めるにあたって何点か気づいたことがありますので、フィードバックを書かせていただきます。
yarn start
を実行した後の yarnの抜け方 (Mac: Ctrl + C, Windows: ???) が書いてあるといいかなと思いました
brew install node
を実行すると最新のバージョンがインストールされますが、環境によっては最新ではなくLTSバージョンではないとyarn start
時にエラーが出るようです。こちらの記事をご参照ください。
もくもく会では
nvm uninstall v17.0.1
nvm install --lts
を実行することによって最新のLTSバージョンを入れることによってyarnが無事動きました。本書に入れるかどうかの判断はお任せしますが、ご参考までにどうぞ。
これからも本書の更新を楽しみにしております。
章のREADMEページのサイドバーラベルが基本的に「概要」に設定されているため、次ページリンクがおかしな挙動に見えてしまう。
README→READMEと続くときは、次ページリンクのタイトルをページタイトルに合わせたほうが良さそう。
元issue: #98
変数宣言のconstと、const assertionのconstがあることが分かるようにする。
constはググれなくはないが、ググると変数宣言とconstアサーションが混じって出てくるので、索引にリストアップされるのが望ましいと思う。
as constで索引をルックアップする人対策として、asのセクションにもちょっとした記載があると良さそう。
主な流れ
TypeScriptのコンパイルエラーメッセージの表示方法が下記の3種類で書かれている。
```
コードブロック>
引用これを統一した表示方法にしたい。
docs/assetsに画像ファイルがある。GitBookから移行したときに、ファイル名がなりゆきになってしまっている。
default exportやnamed exportは英単語であってTypeScriptコードの断片ではないため、「default export
では、...」のようにコードとして表現されているところを「default exportでは、...」のように書き換える。
GitBookからDocusaurusに移行してはどうか? · Discussion #38 · yytypescript/book
node importFromGitbook/index.js .
rm -rf *.md overview reference tips tutorials writing .gitbook .gitbook.yaml
node importFromGitbook/updateContent.js
cp /Volumes/v/suinplayground/my-website/docs/writing/* docs/writing/
yarn prettier:fix
ag '{%'
で探す。これらは別チケットでやる。
ステータス管理はもはや「Google Docsで管理」ではなくなってきているので刷新する必要がある。
A declarative, efficient, and flexible JavaScript library for building user interfaces.
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google ❤️ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.