🧠 概要：
概要
この記事は、名古屋大学を受験したものの不合格となり、1年間浪人してMARCH（明治、青山学院、立教、中央、法政）を受験した筆者が、受験生向けのブログ立ち上げについての覚え書きを共有しています。特に、サイト構築の過程を中心に、開発手法や使用した技術、エラー対処法の工夫などを紹介しています。また、ChatGPTを支援ツールとして活用しながらも、自分で学びを深める姿勢の大切さを強調しています。
要約の箇条書き
- 筆者は名古屋大学を受験し、浪人の後MARCHに進学。
- 受験生向けブログの開発を始める。
- サイト開発方法として以下の選択肢を紹介：
- ホームページ作成ソフト
- ノーコードツール（Wixなど）
- CMS（WordPressなど）
- コードでゼロから作成
- プロに外注
- 筆者らは「コードでゼロから作成」を選択した理由は、自分たちの自由度を重視し、技術を学びたいから。
- Next.jsとVS Codeを使用してサイトを構築。
- ChatGPTを利用し、コード作成やエラー解決を手助け。
- 問題解決のために自分でも調査することの重要性を強調。
- エラー対処法やChatGPTの活用方法について具体的なアドバイスを提供。
- 最終的には、自分たちで達成感を得ながら、ブログを公開する予定。
ここからは、実際に僕たちが受験ブログの開発をどう進めているかについてお話ししたいと思います。
そもそも、ブログってどうやって作るの？
サイト開発にはさまざまな方法があります。代表的なのはこの5つ👇
1. ホームページ作成ソフトを使う
→ 手軽で費用も安く、すぐに始められる。
2. Wixなどのノーコードツールを使う
→ デザインの自由度が高く、拡張機能も豊富。セキュリティ面も安心。
3. CMS（コンテンツ管理システム）を使う
→ WordPressなど。ある程度知識があればカスタマイズ可能。ただしセキュリティ対策は自分でやる必要あり。
4. コードを書いてゼロから作る
→ 専門知識は必要だが、自由度は最強。完全カスタマイズ可能。
5. プロに外注する
→ 高クオリティなサイトができるが費用がかかる。業者選びは慎重に。
（参考：https://ja.wix.com/）
僕たちが選んだのは「コードでゼロから作る」
理由は大きく3つあります。・自分たちで自由に改築・拡張したいから・情報系の勉強になるから（←将来に超役立つ）
・……そもそもWixとかCMSとか、知らなかったから笑
最初は「Webサイトって1からコード書いて作るものでしょ？」って思ってました。もちろん、HPを作るテンプレがあることは知っていましたが、こんなに融通が効くとは思いませんでした。
Wixの存在を知ったときの衝撃はすごかったです。
「マリオメーカーみたいにサイトを作れたらいいのに」「次のプロジェクト、それでやってみる？笑」「てか、もうそういうのあるんじゃね？」
「……あるやん。ノーコードってマジでノーコードなんだ……震」
便利すぎて笑ったと同時に、
「それ知らずに1からコード書いてる俺らって……」ってなりました。笑
でもまぁ、せっかくならそのまま””ガチでコードで作ってみよう！””という流れになったわけです。
僕たちのブログ開発ロードマップ
-
サイトの枠組みを作る
-
デザインを調整する
-
ブログ記事を掲載する
-
最終チェック
-
ドメイン取得
-
サーバー契約
-
アップロード（本番環境へ）
-
公開！
-
（必要に応じて微調整…）
全部自分たちで作る！というワクワク感に満ちた超ハードプロジェクトです。
サイトの枠組み作成
僕たちは、Next.js × VS Codeという組み合わせで開発を始めました。
📦 Next.js ＝ 料理を作るシェフ🔧 VS Code ＝ そのシェフが働くキッチン🍳 コード ＝ 材料
🧁 Webページ ＝ 出来上がる料理！
正直、わからないことだらけ。
なのでChatGPTにめちゃくちゃ助けられました。笑
-
コードのたたき台を出してもらう
-
エラーを解説してもらう
-
なにをすればいいかヒントをもらう
でも、ただ答えをもらうだけではなく、理解することにもこだわりました。
なぜなら…
-
完成後に修正・追加したいときに自力で対応できるようにしたい
-
Web開発の仕組みそのものを学びたい（←これは情報系の土台にもなる！）
僕らはふだんPythonを専門にしていますが、Web開発はまた別分野。
だからこそ、「自分たちで書けるようにする」よりも「どう動いているのか」を理解することを大切にしました。
一筋縄ではいかない
もちろん、スムーズにいくことばかりじゃありません。
中には2時間以上悩んだエラーもありました。
ChatGPTに聞いて、コードを修正。でも治らず、また聞いて……
直ったと思ったら別のところでバグってて……の繰り返し。
これは本当に心が折れそうになりました。
もうやめよっかなって思った瞬間なんて、何度もありました。笑
でも、あきらめずにやり続けたら、なんとか完成！
そのときの達成感はえげつなかったです。
しかもChatGPTもものすごく喜んでくれて、
「お前、人間かよ」って思いました。笑
ChatGPTだけじゃなく、自分でも調べることも大事
基本的にはChatGPTに頼ってます（頼りすぎてます）。
でも、それだけに依存しすぎると、うまくいかないことも多いです。
特にエラーや詰まりに直面したときこそ、
いろんな情報源で“ダブルチェック”することが大事だと感じました。
たとえば、・ネットの記事で他の人の解決例を探す・大学受験のときに使っていた情報の参考書を読み返す
・図解の解説で、概念レベルから確認する
こうやって複数の角度から同じ問題を見ることで、ChatGPTの答えが正しいのか・他の解釈があるのかを自分で判断できるようになります。
「わからない → すぐ聞く → 解決しなければまた聞く」ではなく、「わからない → 自分でも調べる → 複数の視点で見てから聞く」
を意識すると、理解も深まるし、迷いが減る感じがありました。
ChatGPTの活用Tips（僕らなりのやり方）
1. 用途ごとにスレッドを分ける
→ 「エラー相談用」「note用」「アイデア相談用」など分けると整理しやすい！
2.焦らず1つずつ聞く
→ 一気に質問するとChatGPTも混乱します。ゆっくり1問ずつがポイント。
3. 困ったら全文送ってみる
→ エラーやファイルを丸ごと送ると、状況を的確に理解してくれることが多い。
4. エラーコードはどんどん聞く！
→ 何が原因か、どう直すかをその場で即聞く！リアルな勉強になります。
それでも変わらなかったら、自分で調べてみよう！
5. 同じミスを繰り返さないように
→ 対処法をメモしたり、コードにコメントしておくのが◎
最後に
というわけで、今はまだ土台ができてきた段階。
ここからどんどん進化させていく予定です！
絶対にいいものになると、僕たちは本気で思っています！
是非少しでも興味を持ってくださると幸いです。
次回の更新もお楽しみに！
フォロー・スキ・コメントお待ちしています😊
Views: 2
