【0→100】ブログサイトを完成まで個人で作った話

# 初めに
今回は全くプログラミング未経験だった僕が１からAstroというフレームワーク（ツールのようなモノ）を使用して０からブログサイトを作ってきたのでその体験を記事化したものです。僕の内容の濃い２週間が興味深く凝縮されているので、ぜひ最後まで読んでみてください。

## ブログサイト

下に今回作成したブログサイトのリンクを張っておきます。開発の都合上英語にしたかったのでウェブサイト自体は英語なのですが、英語が出来なくてもポチポチボタンを押して「こんなのを作れるんだなー」ぐらいに見てみてください。

https://binary-fish.vercel.app/

# 本編

まず筆者のプログラム歴は長いもののそこまで良いものでは無かったです。プログラミングの仕方は分かっているものの、長く続かずいろんなことを試してみては中途半端に終わるという繰り返しでした.…**ウェブ開発をやってみるときもあればゲーム開発をやってみるときもあり、こんなゲームを作ろう！と決意するとアプリ開発に移る…**

そんな感じで結局何も完成させられていないという悪循環でした。実際に僕は中学１年生まではScratch（プログラミングの優しめにしたようなバージョンのアプリ）ぐらいのレベルでやっていて、その後からは少しステップアップしたものの中々完成しているプロジェクトがない状況でした。そんな同時期に僕はQiitaを始めました。その２か月後の時期に、ワードプレスなどの他のツールを使用してみることも検討してみたのですがさすがに学生にサーバー代を払う予算は無かったので断念。

そこから我慢してQiitaで記事を書いていくうちに僕は「**Qiitaやほかのブログサービスで書いたような事を英語に直して自分のブログサイトを0から作れば多くの人が自分の記事を読んでくれるのでは？**」と思いました。なので自分からブログサイトを作ることに決意。しかしウェブ開発をやっていたのはかなり前だったので今はほぼ知識が0の状態。

そこで学習コストが低いフレームワーク（いろいろプログラミング言語の機能を追加してくれるプログラミング界の拡張機能のようなモノ）を探している内に…

遂に見つけました。その名もAstro。どうやらマークダウンという比較的分かりやすい記述法で書いたファイルを勝手にウェブページに変換してくれる機能があるとかないとか.…さらに若干のプログラムを書くだけでかなり軽いサイトが作れるとか.…

https://astro.build/

「これはやるしか無い！」と思い早速公式ドキュメントからチュートリアルをやる事に。そこでブログのチュートリアルがあったので一通りやってみることにしてみました。

そうこうしている内に「**あーウェブで公開してみたいなー**」と思うようになったのでウェブに公開できるサービスを探すことに。この時ウェブで公開できるサービスを探すときの条件は３つありました。

* **無料である**（もちろんクレカやPayPayなんて持ってない学生にはある程度の無料枠があるサービスでは無いと難しい）

* **無料枠のドメインが短い**（無料のサービスだとカスタムドメインを持てないものが多いのでその中でもなるべく覚えやすくて短いものが必要だった）

* **Githubとの連携が楽**（一度Githubに保存してあるレポジトリーを参照されば後は毎回Pushするたびに公開できるサービスのほうが搭載していないサービスよりも作業効率が良くなるため）

これらの３つを照らし合わせた結果、Vercelというサービスを見つけました。

https://vercel.com/

Vercelはなんとかなり良心的な無料枠があり、ドメインも短く、Githubとの連携も楽。これは使うしかない。

そうしてアカウントを登録し色々設定をして公開をしました。実際に自分のウェブサイトを友達や家族に紹介してテンションが上がりました。こちらがその時のウェブサイトです。

<blockquote class="twitter-tweet" data-media-max-width="560"><p lang="ja" dir="ltr">Astroでウェブサイト作ってみた！！ <a href="https://t.co/9BWr1aFTs9">pic.twitter.com/9BWr1aFTs9</a></p>&mdash; SnowDingo (@snowDingoo) <a href="https://twitter.com/snowDingoo/status/1732755906906206364?ref_src=twsrc%5Etfw">December 7, 2023</a></blockquote> <script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>

そんな感じでチュートリアルを終了後もどんどんオリジナルにカスタマイズしていきました…
そこでもスムーズとはいきませんでしたが、着実に自分なりのアレンジをしていきました。

## そして完成へ....
日本のことわざに「**雀百まで踊り忘れず**」とあるのですが、こちらのことわざを開発している間何回も実感しました。というのも最初は知識0に近かったのですが、やっていくうちに中途半端だった頃のweb開発技術を思い出すことが出来ました。そのおかげもあってか初期のダサいサイトとはお別れを付げることに…（今もダサいのは秘密）
案外人は一回学んだことは忘れないんだな～と開発していて学んだ筆者でした…

そうこうして２週間もたてばブログはほぼ完成状態へ.…
GoogleSearchConcoleというツールの設定もしたおかげでGoogle検索から表示されるようにもなっています。
さらに追加でエラーも解消しつつレスポンシブなサイトに変更し、かなり見た目が良くなったところで完成しました🎉

正直今回のプロジェクトを完成してまるでゲームのラスボスを倒したかのような達成感を感じることが出来ました....

# 最後に

このサイトを作ってみて学んだのは、毎日継続してやる大切さでした。「毎日少しずつ」のほうが「ドカーンと一日」より良いと実感。僕はその「ドカーンと一日」の方法で何かを完成させたいと無意識に思ってしまっているのが原因なのか中途半端で終わってしまっていたため、しっかりプロジェクトを完成させられて良かったです。後モチベーション維持の大切さも学びました。
皆さんも時間さえかければ僕の様に出来なかった事もいつか達成できると思うので、何か自分が出来なかったことにチャレンジしてみてください。きっとできるようになった時には僕の様に大きな達成感と成長を感じるはずです。
最後まで読んでくださりありがとうございました。



Vercelはなんとかなり良心的な無料枠があり、ドメインも短く、Githubとの連携も楽。これは使うしかない。

そうしてアカウントを登録し色々設定をして公開をしました。実際に自分のウェブサイトを友達や家族に紹介してテンションが上がりました。こちらがその時のウェブサイトです。

<blockquote class="twitter-tweet" data-media-max-width="560"><p lang="ja" dir="ltr">Astroでウェブサイト作ってみた！！ <a href="https://t.co/9BWr1aFTs9">pic.twitter.com/9BWr1aFTs9</a></p>&mdash; SnowDingo (@snowDingoo) <a href="https://twitter.com/snowDingoo/status/1732755906906206364?ref_src=twsrc%5Etfw">December 7, 2023</a></blockquote> <script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>

そんな感じでチュートリアルを終了後もどんどんオリジナルにカスタマイズしていきました…
そこでもスムーズとはいきませんでしたが、着実に自分なりのアレンジをしていきました。

## そして完成へ....
日本のことわざに「**雀百まで踊り忘れず**」とあるのですが、こちらのことわざを開発している間何回も実感しました。というのも最初の頃は僕の知識は0に近かったのですが、やっていくうちに中途半端だった頃のweb開発技術を思い出すことが出来ました。そのおかげもあってか初期のダサいサイトとはお別れを付げることに…（今もダサいのは秘密）
案外人は一回学んだことは忘れないんだな～と開発していて学んだ筆者でした…

そうこうして２週間もたてばブログはほぼ完成状態へ.…
GoogleSearchConcoleというツールの設定もしたおかげでGoogle検索から表示されるようにもなっています。
さらに追加でエラーも解消しつつレスポンシブなサイトに変更し、かなり見た目が良くなったところで完成しました🎉

正直今回のプロジェクトを完成してまるでゲームのラスボスを倒したかのような達成感を感じることが出来ました....

# 最後に

このサイトを作ってみて学んだのは、毎日継続してやる大切さでした。「毎日少しずつ」のほうが「ドカーンと一日」より良いと実感。僕はその「ドカーンと一日」の方法で何かを完成させたいと無意識に思ってしまっているのが原因なのか中途半端で終わってしまっていたため、しっかりプロジェクトを完成させられて良かったです。後モチベーション維持の大切さも学びました。
皆さんも時間さえかければ僕の様に出来なかった事もいつか達成できると思うので、何か自分が出来なかったことにチャレンジしてみてください。きっとできるようになった時には僕の様に大きな達成感と成長を感じるはずです。
最後まで読んでくださりありがとうございました。