GitHubCopilotとは
どのようなものかは公式へ
大雑把に言うと「察してくれる」インテリセンスという感覚
CopilotXも発表され、開発全般を補助してくれる予定のよう
試した環境
VisualStudioCodeにGitHubCopilot拡張があるのでそちらを使用
Astro+TailwindCSS 環境での javascript/html/css のコード記述時
今回はコメントからのコード生成はなし
まともにコメントを書いていないので逆に今度書いてもらおう
このブログを作成している時の感想になります
Unityだとどうなの？というのは後々
補完例:ログ
上にこういうコードがあると
const { slug, data } = Astro.props;
const { title, description, pubDate, updatedDate, heroImage, tags } = data;console.log を書いた時点でslugからの部分を補完しようとしてくれます
意図通りかは恐らく手がかりが少ないので微妙な所
console.log(//"slug", slug); <- コメント部分からが補完
co//nsole.log("title", title); <- 二行目に関してはcoの時点で補完してくれる補完例:関数
記事ページのastroファイルでのgetStaticPath関数
export async function getStaticPaths() {
/* この部分が全て補完
const posts = await getPosts();
return {
paths: posts.map((post) => ({
params: {
slug: post.slug,
},
})),
fallback: false,
};
*/
}これが意図通りかはさておき、こういうコードが一般的なのかな？という補完をしてくれます
各々の環境で少し手直しは必要
実際のコード箇所で補完確認しようと思っていたらmarkdown内のコードブロックでも
補完してくれてリアルタイムで驚いている（ぉぃ
補完例:CSS
markdown内のリンクの色が文章と同じなので色を変えてた時のコード
.post-content :global(a/* ここから補完) {
color: var(--color-primary);
text-decoration: none;
border-bottom: 1px solid var(--color-primary);
transition: all 0.2s ease-in-out;
*/
}これだとcolor-primaryで色が変わらないので修正が必要
text-decoration: noneなのにborder-bottomがあるのがちょっと分からない
自分が今回初めてjavascript,html,cssを触るのでcopilot君の意図が
分からない例ですね。こういう定石あるのかしら
補完例:コミットメッセージ
ここも補完してくれたので驚いた
console.logが残っていた//ので削除しました <- コメント部分からが補完コミットメッセージ特化というより、こういう文章がよく打ち込まれている
というのが補完されている印象
感想
補完をそのまま受け入れる頻度は先が読めてきたコードほど精度が高い印象
そうそうそれ、というのもそこそこ
手間は単純に減りますね。違う、そうじゃないというのと半々ぐらい？
と言っても大まかには合っているので修正という感じ
最も助かるのは、今回定石が分からないまま書いていたので
一般的なコードを出してくれる事ですね、これが一番助かった部分かも
続GitHubCopilot
まだコメントからのコード補完は真面目に試していませんが
おいおいやってみましょう
また、Unityの方は慣れた、ある程度知っている環境での使用になるので
そちらも楽しみですね
目次