コミュ障だから明日が僕らをよんだって返事もろくにしなかった

何かを創る人に憧れたからブログをはじめたんだと思うよ

TypeScriptのチュートリアルやる

やるといいらしいと聞いたのでやることにしました。

とあるまとめサイトを見ていたらやたら強い口調でTypaScriptのチュートリアルやればプログラミングスクール不要だよみたいなこと書いてあったのでそれやります。

やるサイトはこちら(公式)
www.typescriptlang.org

TypeScriptのチュートリアルってこれでいいんだよね?
f:id:andron:20210107133919p:plain
チュートリアルって書いてあるのだから僕はこれやるからな!

やった

意義があるのか知らないけどもやっていきます。
ASP.NET Coreやった
ASP.NET Core の概要 | Microsoft Docs
ASP.NET Coreはこんなやつ。導入すればすぐに使えるプロジェクトファイルを生成してくれるすごいやつだ!

この章のゴールはこれをつくること。コードの意味の解説とか特になくセッティングができたかどうかの確認章。


・gulpやった
すでにASP.NET Coreでのセッティングの段階でもgulpを触ったりしているけどもgulpはこれ。
gulp.js
変更したコードを良い感じに自動化してくれる仕組みをつくってくれるすごいやつだ!生JavaScriptだったらブラウザが勝手に読み込んでくれるけどもTypeScriptだとそういうことはまだサポートしてないので自動化してコンパイルなどもろもろの負担を減らそうみたいなやつ。

$ gulp
$ node dist/main.js
Hello from TypeScript

この章のゴールはこれが動かせられるか。gulpはね…。その後はBrowserifyとか使ったりしていきます。

Browserify
Browserifyは…、上でやったコマンド操作をブラウザ上でやろうとしてくれるすごいやつだ!そこからWatchify、Babel、およびUglifyについてのセッティングの話をやっていきます。もうそこから怒涛の展開なのでそれぞれが何をしている機能なのかは君の眼で確かめてくれ(投げやり)。

// プロジェクト上で確認
$ ls dist
bundle.js  bundle.js.map  greet.js  index.html  main.js

特にコードを書くとかそういう話全然ないので確認とかする場合は上みたいに良い感じのファイルが出力できたとか確認すればいいんでしょうかね?


・DOM操作やった
TypeScriptでのDOM操作読み物回って感じがする。DOM操作はHTMLタグを弄り回そうみたいなやつね。


See the Pen
TypeScriptでDOM操作
by Ando. (@andou666)
on CodePen.


基本はこうらしいです。僕の好きなJSFiddleもTypeScript対応しているはずなんだけどもそっちはなんか動かなかった……。


JavaScriptからの移行読んだ
読んだ!「JavaScript→TypeScript」への移行についてのポイントが書いてある章。僕はこのブログでコピペにならないような何を書けばいいのだろうか……。とりあえず、 tsconfig.json の最低限の書き方は大事かもしれない。
TypeScript: TSConfig Reference - Docs on every TSConfig option

{
  "compilerOptions": {
    "outDir": "./built",
    "allowJs": true,
    "target": "es5"
  },
  "include": ["./src/**/*"]
}

あとは……、エラーが起きるたびに対応していけばいいんじゃないかね。知らんけど。



・TypeScriptでBabelを使用する読んだ
読んだ!どう使っていくのが正しいかは「場合による」という元も子もないアドバイスからはじまってそれでも有用なケースはこれだみたいなふわっとした感じのことが書いてあったりする読み物。


というのがTypeScriptのチュートリアルに書いてあったのやってみたのでした。内容が限定的な感じしてまだプログラミングスクールの方がましな気がしてならないのだけどもやってみた。

おわり*1

*1:気が向いたら適当なプログラミングスクールの広告を以下に貼ったり貼らなかったりします