Upgrade to Pro — share decks privately, control downloads, hide ads and more …

ESLintプラグインを使用してCDKのセオリーを適用する

Sponsored · Your Podcast. Everywhere. Effortlessly. Share. Educate. Inspire. Entertain. You do you. We'll handle the rest. →
Avatar for Ren Yamanashi Ren Yamanashi
January 16, 2025
Programming
2
810

 ESLintプラグインを使用してCDKのセオリーを適用する

クラスメソッドのAWS CDK事情大公開スペシャル#2 で発表したLTのスライドになります
https://classmethod.connpass.com/event/337711/

Avatar for Ren Yamanashi

Ren Yamanashi

January 16, 2025
Tweet

More Decks by Ren Yamanashi

See All by Ren Yamanashi
保守性を高める AWS CDK のセオリー・ベストプラクティス
Avatar for Ren Yamanashi yamanashi_ren01
6
1.3k
CDK開発におけるコーディング規約の運用
Avatar for Ren Yamanashi yamanashi_ren01
3
630
AWS初心者ってどうやってAWSを学ぶ？〜アプリエンジニアがやってよかったアーキテクチャ学習方法〜
Avatar for Ren Yamanashi yamanashi_ren01
0
660

Other Decks in Programming

See All in Programming
20260313 - Grafana & Friends Taipei #1 - Kubernetes v1.36 的開發雜記：那些困在 Alpha 加護病房太久的 Metrics
Avatar for ChengHao Yang tico88612
0
220
最初からAWS CDKで技術検証してもいいんじゃない？
Avatar for アキキー | Akihisa Ikeda akihisaikeda
4
160
AI Assistants for Your Angular Solutions
Avatar for Manfred Steyer manfredsteyer
PRO
0
150
AI 開発合宿を通して得た学び
Avatar for ニフティ株式会社 niftycorp
PRO
0
150
Claude Code の Skill で複雑な既存仕様をすっきり整理しよう
Avatar for yuichiro_takahashi yuichirokato
1
410
SourceGeneratorのマーカー属性問題について
Avatar for tkym htkym
0
200
Cyrius ーLinux非依存にコンテナをネイティブ実行する専用OSー
Avatar for n4mlz n4mlz
0
210
maplibre-gl-layers - 地図に移動体たくさん表示したい
Avatar for Kouji Matsui kekyo
PRO
0
290
コードレビューをしない選択 #でぃーぷらすトウキョウ
Avatar for Takuma Kajikawa kajitack
3
1k
ベクトル検索のフィルタを用いた機械学習モデルとの統合 / python-meetup-fukuoka-06-vector-attr
Avatar for monochromegane monochromegane
2
470
Agentic AI: Evolution oder Revolution
Avatar for Lars Roewekamp mobilelarson
PRO
0
190
社内規程RAGの精度を73.3% → 100%に改善した話
Avatar for oharu121 oharu121
13
8.2k

Featured

See All Featured
Self-Hosted WebAssembly Runtime for Runtime-Neutral Checkpoint/Restore in Edge–Cloud Continuum
Avatar for Yuki Nakata chikuwait chikuwait
0
400
What the history of the web can teach us about the future of AI
Avatar for Ines Montani inesmontani
PRO
1
480
Odyssey Design
Avatar for Ryan Kendrick rkendrick25
PRO
2
550
Design of three-dimensional binary manipulators for pick-and-place task avoiding obstacles (IECON2024)
Avatar for konakalab konakalab
0
380
The Psychology of Web Performance [Beyond Tellerrand 2023]
Avatar for Tammy Everts tammyeverts
49
3.3k
Building a Scalable Design System with Sketch
Avatar for Laura Van Doore lauravandoore
463
34k
New Earth Scene 8
Avatar for Sydney Stone popppiees
1
1.7k
The State of eCommerce SEO: How to Win in Today's Products SERPs - #SEOweek
Avatar for Aleyda Solis aleyda
2
9.9k
What’s in a name? Adding method to the madness
Avatar for The Alliance productmarketing
PRO
24
4k
Introduction to Domain-Driven Design and Collaborative software design
Avatar for Kenny Baas-Schwegler baasie
1
640
Lightning talk: Run Django tests with GitHub Actions
Avatar for Sarah Abderemane sabderemane
0
150
The AI Search Optimization Roadmap by Aleyda Solis
Avatar for Aleyda Solis aleyda
1
5.4k

Transcript

  1. 2025/01/17 山梨 蓮 クラスメソッドのAWS CDK事情大公開スペシャル#2 　

  2. 自己紹介 @ren_yamanashi ・job 󰞵: web engineer (backend) ・lang 📝: TypeScript

    ・hobby 🚀: CDK Contribute

  3. ・TypeScriptを使用した開発を想定しています 前提

  4. 自己紹 介 CDKにおける「セオリー」とは？

  5. ・construct ID は PascalCaseで書く ・propsのプロパティはreadonlyに CDKのセオリー ・props/Constructで公開するリソースのプロパティはClassではなくInterfaceに 　など

  6. ・特にCDK / TypeScript になれていない場合 CDKコーディングにおける課題 ・セオリーを意識しながらのコーディングが大変 ・メンバー間で認識のレベルに差がある

  7. ・特にCDK / TypeScript になれていない場合 CDKコーディングにおける課題 レビューで毎回同じ指摘をする(される) ・セオリーを意識しながらのコーディングが大変 ・メンバー間で認識のレベルに差がある

  8. ・特にCDK / TypeScript になれていない場合 CDKコーディングにおける課題 レビューで毎回同じ指摘をする(される) ・セオリーを意識しながらのコーディングが大変 ・メンバー間で認識のレベルに差がある （レビュー漏れも・・・）

  9. 自己紹 介 この課題を　 ESLintを使って解決する

  10. ・JS / TS コードを解析し、構文エラーやルール違反コードを検出するツール ESLintとは？ ・基本的なルールはESLintから提供される ・ルールはユースケースに応じて自前で作成可能

  11. 課題 ESLintを使用した課題の解決 ・セオリーを一つ一つ意識するのが大変なこと 解決方法 ・毎回同じ指摘をすること / レビュー漏れが起きること ・ESLintを使用した機械的な解析によって自動検知する ・意識しなくても /

    レビューしなくても 勝手にエラーになる

  12. 自己紹 介 課題を解決するために

  13. 自己紹 介 CDKに特化した ESLintルールを作りました

  14. 自己紹 介

  15. サポートしているルール(一部) eslint-cdk-pluginの紹介 ① construct ID は PascalCase で書く ② construct

    には必ず this を渡す ③ construct ID に変数を使用しない ④ propsやconstructで公開するリソースのプロパティはinterfaceにする ⑤ propsやconstructで公開するリソースのプロパティはreadonlyにする CDKのセオリー / ベストプラクティス強制するESLintルール

  16. 自己紹 介 ① construct ID は PascalCase で書く

  17. こちらの記事で紹介されているもの ① construct ID は PascalCase で書く

  18. ① construct ID は PascalCase で書く

  19. 自己紹 介 ② construct には必ず this を渡す

  20. CDKのメンテナである Rico Hermans (@rrix0rr) 氏から提案いただいたもの ② construct には必ず this を渡す

  21. ② construct には必ず this を渡す

  22. construct に this を渡すことは正しいリソース階層を維持するために重要 scope のような値を使用すると・・・ ② construct には必ず this

    を渡す ・生成されるCFnテンプレートのリソース階層が正しくない ・予期しないリソースの命名 のような問題が起こる

  23. 自己紹 介 ③ construct ID に変数を使用しない

  24. こちらもrrix0rr氏から提案いただいたもの ③ construct ID に変数を使用しない

  25. ③ construct ID に変数を使用しない

  26. construct ID に変数を使用すると・・・ ③ construct ID に変数を使用しない ・不要な重複 ・パラメータ変更時のリソース再作成 のような問題が起こり得る

    ・IDの一意性を重視するあまり、不要な文字列を混在させてしまう

  27. 自己紹 介 ④ propsやconstructで公開する リソースのプロパティはinterfaceにする

  28. こちらのスライドで紹介されているもの ④ propsやconstructで公開するリソースのプロパティは interfaceにする

  29. ④ propsやconstructで公開するリソースのプロパティは interfaceにする

  30. ④ propsやconstructで公開するリソースのプロパティは interfaceにする

  31. 自己紹 介 ⑤ propsやconstructで公開する リソースのプロパティはreadonlyにする

  32. 同じく、こちらのスライドで紹介されているもの ⑤ propsやconstructで公開するリソースのプロパティは readonlyにする

  33. ⑤ propsやconstructで公開するリソースのプロパティは readonlyにする

  34. ⑤ propsやconstructで公開するリソースのプロパティは readonlyにする

  35. まとめ ・セオリーを自動適用するプラグインを紹介 ・導入方法などはドキュメントをご覧ください 🙏 　https://eslint-cdk-plugin.dev/ ・「こんなルールが欲しい」という要望もお待ちしております！！ ・Twitter(X): @ren_yamanashi ・Github: @ren-yamanashi