Geminiと一緒に自分のポートフォリオサイトを1日で作ってみた全記録

📢やあ、みんな！ケイだよ。 今日の探求ノートへようこそ！

プログラミングを勉強して、少しずつスキルが身についてきた。 でも、ふと思ったんだ。 「このスキル、どうやって他の人に見せればいいんだろう？」って。

自分のスキルや作ったものをまとめた「ポートフォリオサイト」は、まさに**君だけの冒険の歴史を記した「宝の地図」**なんだ！

とはいえ、ウェブサイト作りなんて大変そう…。そこで、僕は相棒のGeminiと「1日でポートフォリオサイトを作る！」という、ちょっぴり無謀な冒険に出てみることにしたんだ。その全記録を、みんなに共有するね！

🗺️まずは冒険の地図作り：Geminiと「サイトの設計図」を考える

いきなりコードを書き始めるのは、地図を持たずに航海に出るようなもの。まずは、サイトにどんなページや情報が必要か、Geminiとブレインストーミングだ！

💬僕からGeminiへの最初の問い（プロンプト）

ねえGemini！僕、プログラミング初心者なんだけど、自分のスキルや作品を見せるための、シンプルなポートフォリオサイトを作りたいんだ。

どんなセクション（項目）があれば、僕のことをうまく伝えられるかな？初心者に必要な項目をリストアップして、提案してほしい！

🤖Geminiからの答え

もちろん承知いたしました。初心者のポートフォリオサイトでしたら、以下の5つのセクションで構成するのがおすすめです。シンプルでありながら、あなたの魅力を伝えるのに十分な構成です。

1. ヒーローセクション: サイトの顔となる部分です。キャッチコピーと名前を載せます。
2. 自己紹介 (About Me): あなたがどんな人物で、何に情熱を注いでいるかを伝える場所です。
3. スキル (Skills): 使える言語やツールを一覧で見せる場所です。
4. 制作実績 (Works): これまで作った作品へのリンクや説明を載せる場所です。
5. お問い合わせ (Contact): 連絡先やSNSへのリンクを置く場所です。

ケイ

なるほど！これなら、ごちゃごちゃせずに、僕のことがちゃんと伝わるサイトになりそうだ。よし、この設計図を元に、冒険を始めよう！