LoginSignup
186
150

More than 3 years have passed since last update.

@suin(suin@TypeScriptが好き)inCraftsman Software

YYTypeScript#1「JavaScriptを知らない人がTypeScriptを学ぶ方法を知りたい」「TypeScript初心者がどうやって勉強すると効率がいいか？」「なぜTSが選ばれるのか？」「PHPと比べて、サーバサイドをTSで書くメリットは？」「TypeScriptのバックエンドのオススメフレームワークって？」「定義をinterfaceとtypeどっちで書いてる？」「JSで書かれたプロダクトのTS化ってどうしてる？ 」

Last updated at Posted at 2019-09-20

これは2019年9月20日に開催したTypeScriptイベントYYTypeScript#1のイベントレポートです。

YYTypeScriptは一言で「TypeScripterの部室」です。発表者の話を聞く「一方向的な勉強会」とは真逆で、TypeScriptについて、雑に・ゆるく・ワイワイ話しながらTypeScripter同士の交流を深める「双方向的な座談会」の形式になります。集まった人たちで「今日話たいこと」「聞きたいこと」をいくつか挙げていき、それをテーマに雑談していきます。

今回の配信動画

過去回の配信動画 → YouTubeプレイリスト「YYTypeScript」
前回 → 今回が初開催です😌

雑談

JavaScriptを知らない人がTypeScriptを学ぶ方法を知りたい(ぬーたけ)

いま スラスラ読める JavaScriptふりがなプログラミング | 及川卓也, リブロワークス | 工学 | Kindleストア | Amazon を読んでいる。

↑Typescript公式にplaygroundがあるので、色々試す分にはそこを使うと便利かもしれません

TypeScript初心者がどうやって勉強すると効率がいいか？ (れおりん)

  • 3日の人が何をしたらいいか？
  • JavaScript経験者にとっての話

...

なぜTSが選ばれるのか？

TS案件で、なぜTSが選ばれたのか聞きたい。(じゅり)
JSがあるのにTSを採用する理由って？ (たべたつ)

・・・

  • TSを仕事で使ってる人4名
    • なぜTSを選んだのか？
      • アプリを作るための開発基盤を開発している。バックエンドもフロントエンドも同じ技術でできたほうがチームとしての生産性が良いと思った。
      • 型がある
      • IDEでコード補完がよく効く
        • WebStormが補完してくれる
      • JSのエコシステムがそのまま使えるというのも大きい
        • 開発コストを下げられる
      • 案件に入ったら既に採用されていた
      • テストを書く必要が減る
        • ロジックはテストが必要
      • 開発効率が良い
        • 型ファイルがあればnpmの外部モジュールを使っても補完機能が使えるし、APIの使い方を調べるのが楽になってJSより開発効率が良いのが好きですね。
        • https://github.com/DefinitelyTyped/DefinitelyTyped
      • TS案件に3つ参加した
        • 1つはAngular
        • 1つはVue+TS案件、3年前、Vue流行り始め。BEでJavaを書いていたため、FEでも型があったほうが良いという判断だったであろう
        • Nuxt。型があるメリット、JSの危なさを減らす目的で
  • ソフトウェアは保守フェーズのほうが長い
    • 長い目でみて保守性が高い
    • 世間的に見ても型有りに流れてるような(プロジェクトによる)
  • TS未経験のチームの学習コストは発生する
    • 細かい意思決定が無数に出てくる
      • 見えないけど、始めたら実際のしかかってくると思う。
  • ちっちゃいスクリプトでも、型推論が効くのが嬉しいのでts使いたい勢です。
    • typoを検出できるの便利。

PHPと比べて、サーバサイドをTSで書くメリットは？ (かきうち)

逆に、バックエンドでJS/TSが選ばれない理由も知りたい。(れおりん)

・・・

  • もともとJSが得意な人が書く場合
  • isomorphicなコードにしたい理由
  • よく聞くのはNode.jsは環境構築が容易だから
  • SSR(server-side rendering)やりたいから
    • PHPだと大変。
  • PHPと比べてだと、PHPでできないこと、非現実的なことができる
    • 大量のリクエストをさばく
    • WebSocket
    • 非同期処理
    • GoとTypeScriptでサーバサイドを書くのはどう違う？
      • TSは実行環境は必要だけど、Goはバイナリにビルドするのでランタイムが不要
      • WebSocket使うならTS(node)の方が得意
        • nodeは非同期系の処理が得意、シングルスレッドなので
          • Goはマルチスレッド
      • 表現力が違う
      • GoはジェネリクスないのでTS好きな人と相性悪い説ありますね

TypeScriptのバックエンドのオススメフレームワークって？ (ゆうきゃん)

expressとかはNode.jsのフレームワークとしてよく聞くが。

・・・

APIのリクエスト定義をinterfaceとtypeどっちで書いてる？ (じま)

リクエスト定義くらいならどっちでも書けるけど

・・・

TypeScriptのInterfaceとTypeの比較 - Qiita

  • interfaceがいいというイメージがある
  • typeの方が堅そう。変えられてはいけないところに合いそう
interface Foo {
    readonly a: number
    readonly b: number
}

type Foo = Readonly<{
    a: number
    b: number
}>
  • tsファイルが提供されていないjsファイルに後付で型定義を提供しようとすると、interfaceしかやりようなかった気がします
  • 日本語にしたときに気持ちいいのはinterfaceのほうかと思います。

TS3.xから追加された型の感想教えて (フィロマギ) ﾘﾓｰﾄ

TS3.xから追加された型、使ってみた人いたら感想聞いてみたいです（Omitとか）
↑3.5でした・・・(philomagi)

https://www.typescriptlang.org/docs/handbook/release-notes/typescript-3-5.html
...

type Person = {
    name: string;
    age: number;
    location: string;
};

type QuantumPerson = Omit<Person, "location">;

// equivalent to
type QuantumPerson = {
    name: string;
    age: number;
};
  • Omitは今まで自前で実装していたので手間が省けてよかったですね
  • Omitは元々reduxとかが提供していたので特に感想はなかったですね

TypeORMのモデル、どう生成している？ (ましろ) ﾘﾓｰﾄ

  • 生成してない。素で書いている
  • 今までtypeorm-model-generatorを使って生成していたんですけど他に何かいいものがあれば・・・といった感じです・・・

JSで書かれたプロダクトのTS化ってどうしてる？ (ぬあす) ﾘﾓｰﾄ

  • ぬあすのケース
    • GASでJS→TS
    • clasp使ったらできる
    • clasp
    • だがしかし、けっこうな既存プロジェクトの場合は導入すべき？
    • ちな、件の既存プロジェクトは みやもとさん

・・・

interface について、@types配下になんか書いてある時と、tsファイルにベタがきされているパターンの違い、またこの時はどっちに足せばいいのか (mikkame)　ﾘﾓｰﾄ

  • @typesディレクトリ配下に型情報を配置すると、依存関係を型に解釈させるため
  • 内部的なものと外部的なものの違いなので、使うケースが違う

参加してよかったこと(参加者の感想)

  • 実際にプロダクトに導入されている方や、同じような悩みを抱えている人の話を聞くことが出来てとても勉強になりました！
  • 実際開発をやってらっしゃる方々の生の声が聴けてありがたかった!
  • ほんまにわいわいしてはって居心地がすこぶる良かった
  • 最近流行り始めたものと思っていたので周りの人の知見の多さに驚けたことが収穫としては大きいです。もっとやろうと思いました。
  • Typescriptを使い利点など、自分とは異なる視点で話している人もいてためになりました。
  • koaフレームワークがあることを知ったので試してみます！
  • YYTSの第一回に参加できたこと
  • あんまり技術的な話をする相手がいなかったので面白かった

YYTypeScriptは毎週やってます

YYTypeScriptについてワイワイ話したい方は、YYTypeScriptのイベント情報をチェックしてみて下さい。

以上、YYTypeScriptのレポートでした。次回もワイワイやっていきたいと思います！ では、また来週！

186
150
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
Sign upLogin
186
150