はじめに
初めまして、学生団体IDEAという団体で副代表を務めているKoderと申します。少し学生団体IDEAの宣伝をさせていただくと「バックグラウンドによらない学習環境を提供する」というVisionの基、活動している団体です。
学生団体IDEAのアドイベントカレンダーも残すことあと2日ということで、今日は爆速でコードを読む方法に焦点を当ててお話しさせていただきます。
ソースコードを読むことの重要性
プログラミングにおいて、ソースコードを効率的に読むことは非常に重要です。プロジェクトの理解、バグの特定、また新しい技術の学習において中心的な役割を果たします。また、コードを読む能力は、効率的なチームワークとコラボレーションにも不可欠です。そんな日常コード読む行為を爆速で効率化することができた場合、成長間違いなしですよね？(多分)
先に結論
先に結論からお話しさせると、ChatGPTのプラグイン「Ask Your Code」を入れる。これがシンプルかつ僕が思う一番のソリューションです。
Ask your codeとは
「Ask Your Code」は、ソースコードの解析と理解を助けるために設計されたChatGPTのプラグインです。このツールは、特定のコードセグメントの機能や目的を問い合わせることができ、またコード内の特定のパターンやアルゴリズムに関する説明を提供します。これにより、コードの理解が深まり、効率的な学習と問題解決が可能になります。
何ができるの？
「Ask Your Code」は、ソフトウェア開発におけるコード理解とナビゲーションを支援する革新的なツールです。プログラミングにおける複雑なコードベースの解析にしばしば直面する開発者にとって、このツールは貴重なリソースとなります。
開発者が新しいプロジェクトに参加する際、膨大なコード量とその複雑さに直面することは一般的です。このような状況で「Ask Your Code」を活用することにより、特定の関数の機能や変数の使用箇所など、コードの特定の要素に関する迅速かつ正確な情報を得ることができます。
具体例
どんな感じで、使うのかが分からないと思うので具体例を持ってきました。これは初めてのソースコードをキャッチアップする場面は下記のように聞くと物凄くキャッチアップが楽になります。 ディレクトリ構造 > ファイル単位 > 関数 といったように粒度の大きいものから聞いていくとどのような処理をされているかがすんなり理解できます。
ディレクトリについて聞いた場合
「live-coding」プロジェクトのディレクトリ構造と主要なファイルは以下の通りです：
ファイル拡張子: このプロジェクトには、.css、.js、.md、.prisma、.ts、.tsx の拡張子を持つファイルが含まれています。
ルートファイル:
/.gitignore
/middleware.ts: config などの変数が含まれ、authMiddleware を使用しています。
/next.config.js: nextConfig という変数を定義し、config モジュールを使用しています。
/postcss.config.js
/README.md: 「Getting Started」、「Learn More」、「Deploy on Vercel」といったセクションが含まれています。
/tailwind.config.js
/tailwind.config.ts: config という変数が含まれ、Config を使用しています。
/types.ts: Member、NetServer、NextApiResponse、Profile、Server、Socket などのさまざまなタイプを使用しています。
関連するサブディレクトリ:
/components: 100% の関連性
/app: 44% の関連性
/lib: 12% の関連性
/hooks: 9% の関連性
/pages: 9% の関連性
/prisma: 1% の関連性
/componentsについて聞いた場合
「live-coding」プロジェクトのディレクトリ構造と主要なファイルは以下の通りです：
ファイル拡張子: このプロジェクトには、.css、.js、.md、.prisma、.ts、.tsx の拡張子を持つファイルが含まれています。
ルートファイル:
/.gitignore
/middleware.ts: config などの変数が含まれ、authMiddleware を使用しています。
/next.config.js: nextConfig という変数を定義し、config モジュールを使用しています。
/postcss.config.js
/README.md: 「Getting Started」、「Learn More」、「Deploy on Vercel」といったセクションが含まれています。
/tailwind.config.js
/tailwind.config.ts: config という変数が含まれ、Config を使用しています。
/types.ts: Member、NetServer、NextApiResponse、Profile、Server、Socket などのさまざまなタイプを使用しています。
関連するサブディレクトリ:
/components: 100% の関連性
/app: 44% の関連性
/lib: 12% の関連性
/hooks: 9% の関連性
/pages: 9% の関連性
/prisma: 1% の関連性
まとめ
みんなAskYourCodeを使おう！
まぁ、この記事もアドカレに間に合わないから、AI利用して爆速で書いてるんですけどね…
メリー苦しみます