devlog

主に web 開発とかプログラミングについて書きます

【勉強会 雑なまとめ】関西のTyepScirpt勉強会 kansai.ts #1 に参加してきました

概要

kansaits.connpass.com

関西でTypeScriptを中心にゆるふわ交流するというのがテーマのイベントに参加してきました。 多分関西では初めてのTypeScirptに特化したイベント。

先月東京で行われたTypeScript のミートアップも4.28倍とすごい倍率のイベントでしたが、関西でも高い倍率でした。TypeScriptの人気すさまじい。

これだけの人気を集める技術要素って今だと他にないのでは? Dockerとか?

【増枠】TypeScript Meetup #1 - connpass

管理者

github.com

コミュニティのDiscord

kansai.ts

会場提供からのお知らせ

あとで更新予定

フロントエンド関連のその他イベント

その他のイベント

Laravel Meetup Connect - connpass

v-kansai Vue.js/Nuxt.js meetup #7 - connpass

発表内容

Advanced built-in types

登壇者

twitter.com

  • Node.js のコラボレーター

発表資料

speakerdeck.com

内容まとめ

以下に記載しれている TypeScript の Advanced-typesについて説明

www.typescriptlang.org

以下紹介されたTypeについて列挙。

聞いてた内容を記載しようと思ったけど、不正確なので多分発表資料のスライドを要確認

  • Partial
  • Required
  • ReadOnly
  • Pick
  • Record
  • Exclude
  • Extract
  • NonNullable
  • Parameters

会場での質問

  • 型じゃなくてInterfaceでも使えるか? -> 使えそう

  • 使いやすいのは? -> Readonly

イベント告知

jsconf.jp

所感🤔

  • TypeScritpでほぼ使ったことない機能ばっかりだった。奥が深い(こなみかん)

AWS-CDK for TypeScript を紹介するぜ

登壇者

twitter.com

発表資料

master.d1r9qwzhk27es2.amplifyapp.com

内容まとめ

  • Typescriptと見せかけて AWS の話

  • CDK -> AWS Cloud Development Kit

  • LambdaなどAWS のサービスを 構成をtsファイルから作って、ビルドしてデプロイするデモ

  • CloudFormationのテンプレート(Yamlつらいという人向け)

  • 実演で Lambda の APIゲートウェイを使って"success"と返すだけのコードをデプロイするというのを実演していだきました(事前準備済み)

  • 絶対にプロダクトコードでつかっちゃだめ!(まだPublic Beta)

質問

  • 最悪逃げるときは、YAMLを使うか? -> JSONなりYAMLで構成を吐き出せるので、最悪それを手でいじる

  • デモはどれくらい時間かかった? -> 30分くらい

  • YAMLをやめたてTSにするのはどっちが早い? => なれたら TSのほうが早い(慣れもある)

  • どのサイトを参考にしたらよい? -> NodeModule の中のTSのinterfeceを見た方が早い

雑な所感🤔

  • CloudFormation 使ってないけど、そんなにYamlつらいんだ...

ざっくりAssemblyScript

登壇者

twitter.com

発表資料

scrapbox.io

内容まとめ

  • 自己紹介-> 要 ScrapBox確認 Reactとか言語処理系とか書いてるヒト

  • WebAssemblyとAssemblyScriptに関する紹介

  • WebAssemblyが出てきた経緯の紹介

  • コンパイル後のファイル.wasmに変換できる言語 Rust, Go , Kotlinなど C ...色々 もちろん TypeScript でも

  • AssemblyScript はTypescritp の サブセット(一部機能制限がある感じ)

  • 環境構築もいつものやーつ。 npm run asbuild で.ts から.wat と.wasm が生成される(超簡単)

  • .wat は読みやすくしたやつ

  • シンプルなレポジトリも用意しているから興味あるひとはあとで発表資料見て

  • AssemblyScriptのメリット -> バックエンドもフロントエンドも、超早くしたいところもTypeScriptで書くことができる

  • 一部Rustより早いらしい

  • 一部Cよりファイルサイズが小さくなるらしい

  • AssemblyScript に関する公開されているDemoページの紹介

所感🤔

  • 説明わかりやすかった(こなみかん)

  • AssemblyScript完全に理解した

Alexaスキル開発で始めるTypeScript

登壇者

github.com

  • Alexaチャンピオンのヒト

発表資料

speakerdeck.com

内容まとめ

  • AlexaチャンピオンによるTypeScriptでAlexaカスタムスキルを作ろうよという話

  • AlexaスキルはTypeScript入門に向いている

  • AlexaDeveloperスキルアワード2019の紹介

  • 興味ない人は猫を見るスタイル

  • Alexa は「音声-> 文字-> JSON」の2ステップ

  • LambdaでJSONを受け取ってJSONで返すだけ

  • Alexa のSDKはほぼTypeScriptで書かれている

  • InputとOutputがほぼ固定なので、TypeScirptの入門向け

  • なぜ型(TS)がいるか?インプットのJSONがすごい量なので、IDEが補完してくれないとつらい

  • 初心者向けのQiita記事

qiita.com

  • ASK-CLIは .ts-> .js への変換が必要がだ、今は自動でやってくれる

  • 型があってもパラメータ探すのめんどくさい -> ask-utils など色々作ったのでIssueください

builderscon.io

質問

  • Alexaのスキルで審査あります? -> 審査あり

  • Push通知みたいなことはできますか? -> リマインダーAPIと「お知らせを開いて」といったら喋るやつがある

所感🤔

  • 確かにInput Output固定なら初心者向けに良さそう

  • VUIの開発している人すくない

Cognitive Complexity でコードの複雑さを定量的に計測しよう

登壇者

twitter.com

発表資料

www.slideshare.net

内容まとめ

codeclimate.com

  • Code Climate を使っていた中で、Cognitive Complexity という評価基準ができてたのでそれを調べた話

  • Cognitive Complexity -> 人間に取って見やすいコードになているかどうかの評価基準

  • どのようなコードならCognitive Complexityが増えるのかをサンプルを使って説明

  • よく似ている概念として、循環的複雑度という概念があるがこれとは何が違うかについても説明

質問

  • 知ったきっかけは? -> CodeClimateを調べてた

  • CIで使えるか? -> 多分使える

  • 心折れたことある? -> 指摘自体は難しくない。メソッド分割とかれすば解決できるのでいままではない

VSCode Remote で始める Nuxt生活 with TypeScript

登壇者

twitter.com

発表資料

  • あとで載せる

内容まとめ

  • VSCode Remote Developmentの話

  • TypeScirpt歴は完全に理解したレベル

  • NuxtでVSCode Remoteを使うメリットについての説明

  • 実際の使ったレポジトリの実演

  • 実際に開発環境を整えたやつのGithubレポジトリの紹介

質問

  • 拡張機能はインストールできるか? -> 事前に設定しておくと、Reopenコンテナーで勝手にインストールさる

所感🤔

  • モブとかで開発環境を共有するときとか良さそう

  • デモだとエラーになるとかはあるある。次は動画を準備するか?

TypeScirptでAPIの受け入れテストを記述

登壇者

twitter.com

発表資料

  • 後でのせる

内容まとめ

  • 登壇がはじまってからTypeScirpt の勉強した

  • シンプルに記述できるVue.jsの良さの残しながらTyepScript を一部導入できないか

  • REST API の戻り値に型を導入してみたという話

  • TypeScirptは実行時はチェックしてくれない -> Runtimeチェックしたい

  • io-ts を使って Runtime時にチェックを実施。さらにIDEでのチェックもできる

  • デモでミスしない一番のポイントはPCを持ち込まないこと(iPadPro)

github.com

質問

  • io-tsを使ったデメリットはありますか? -> テストの時だけ書くので、特に遅くなるとかのデメリットはない