2023/4/3週 もくもく会 GraphQL基礎, Laravel Weekly Update, Live2d Cubism SDK for web, Webpack基礎, TypeScript オブジェクト型の高度な型 etc.

こんにちは、フロントエンドエンジニアの 谷（@high_g_engineer）です。
最近、自分が所属するチームと興味がある人達を集めて、業務時間内でもくもくと学習する会、
もくもく会を開催し始めました。

もくもく会を開催しようと思ったきっかけは、こちらで紹介しています。

以下は今週の取り組んだ内容になります。

今週のもくもく会

谷

• GraphQLを調査していた
  • https://zenn.dev/highgrenade/scraps/09bb436c15a9a5
  • 今週は主にリゾルバの扱い方に集中した1週間だった
  • Postタイプのスキーマを学習した
  • リゾルバの引数のparent, dataSourcesに触れた
    • parentを利用しないとリゾルバ内のコードが複雑化する
    • parentを利用すると構造化ができ、リゾルバ内のコードをシンプルにすることが可能
    • 外部リソースに対し、axiosを利用してアクセスしていたが、apollo-datasource-restというモジュールが存在する
    • RESTDataSourceを用いてクラス化することで、リゾルバ引数のdataSourcesとして引数から利用可能
  • PrismaとGraphQLを接続し、Query実行まで出来た
    • Prisma Studioでデータを登録
    • PrismaClientを利用してGraphQLのリゾルバの記述を変更
    • Prisma側で定義+作成したDBのデータをQuery実行で取得できた

磯野

• Laravel Weekly Update #4
  • Laravel / replace関数がcase insensitiveに対応
  • Laravel Pint / PERコーディングスタイル対応
  • Laravel Vapor / Queue管理ダッシュボード追加
  • https://zenn.dev/link/comments/22fe9e251dd0fe
• Live2d Cubism SDK for web使ってみる
  • Demoはうまく動いた
  • canvasの大きさ・位置を変えるのに苦戦中

太田

• IT系の情報を最近全然インプットできてないのでまったり見る
  • Docker一強の時代も終わってしまうのか
    • https://zenn.dev/ttnt_1013/articles/f36e251a0cd24e
  • PHP8.2からのDNF型ってなんぞ
    • https://qiita.com/rana_kualu/items/ddadd32756afdefbe99f
• Webpackの基礎を学ぶ
  • https://zenn.dev/koji9412/scraps/fbf3d7fa817085
  • 次はViteをやろうと思ってます
    • 最近Laravel Breezeを触ってるので触れておきたい
    • https://ja.vitejs.dev/guide/why.html

高橋

• オブジェクト型の高度な型
  • TSの本
    • オブジェクトに対するkeyofのいい感じの使い方
    • 型情報を正確かつ安全に保持したままオブジェクト型任意のキーを取得する汎用的なゲッター関数を書くことができる

    // 型安全なゲッター関数
    function get<
        O extends object,
        K extends keyof O
    >(
        o: O,
        k: K
    ): O[K] {
      return o[k]
    }
    
    type ActivityLog = {
        lastEvent: Date
        events: {
            id: string
            timestamp: Date
        type: 'Read' | 'Write'
        }[]
    }
    let activityLog: ActivityLog = // ... 実際のデータたち
    // ゲッター関数を使った型安全な代入
    let lastEvent = get(activityLog, 'lastEvent') //Date
    

  • Record型

五十嵐

• ずっとdependabotやってました
  • ブログ記事
  • design_systemに上がってきたセキュリティアラートのPR対応完了

 

今週の報告は以上です。
週毎に取り組みを掲載していきますので、ご期待下さいませ。