背景
私はずっと何かを作ることに興味を持ってきました。プログラミングはそれを可能にします。
今年の4月から 100 Days Of SwiftUI を使って Swift(iOS)の学習を始め、7x日目まで続け、いくつかのアプリを作って App Store に公開しました。Swift は UI とロジックを同じ言語で扱えるので便利です。
しかし、その後ウェブの可能性のほうが大きいかもしれないと気づきました。ウェブにはより多くの自由があるからです。アプリは審査を受ける必要がなく、開発者アカウントにお金を払う必要もなく、自分のスタックを自由に選べる柔軟性もあります。特に、アプリケーションをクロスプラットフォームにしたい場合にはなおさらです。
ウェブ開発の学習
iPhone 向けの小さなアプリをいくつか作った後、過去3〜4ヶ月は freeCodeCamp と少しだけ Odin Project を使ってウェブ開発を学び始めました。
ウェブ開発が必要なのは、モバイルプロジェクト用のアプリランディングページを作りたいからであり、またモバイルアプリが利用する REST API もいくつか作りたいからです。
- FreeCodeCamp
- 実践的な演習が豊富ですが、実際のところ少し圧倒され、繰り返しが多いと感じました。
- The Odin project
- より理論的で、プログラミングがなぜ、どのように動くのかについて深く理解できます。
ですので、両方を同時にやることをおすすめします。一方がもう一方を補います。
freeCodeCamp では「Responsive Web」「Basic JavaScript」、そして「React」の半分を(今のところ)終えただけです。
私の学習は主にテキスト情報と公式ドキュメントに基づいていました。React と NextJS の公式チュートリアルはとても楽しかったです。
オンライン講座には一切お金を払っていません。
ほとんどがタスクドリブンの学習でした。やりたいことを一つ学び、次のことへ進み続けるという形です。
これまでの私のプログラミングの道のり
Swift と少しのローカル SQLite > シンプルな Flask REST API > HTML/CSS > JavaScript > 11ty(静的サイトジェネレーター)> React(公式チュートリアル)と NodeJS > Next.js(公式チュートリアル)> ExpressJS > REST API の安全性(CORS と環境変数)> React の復習(freeCodeCamp)> …
誰もがプロジェクトを作ることが重要だと言い、私もとても同意します
自分が作りたいものでなければ、興味を失っていたでしょう。長い間一つのプロジェクトに取り組んで疲れたら、別の言語の別のプロジェクトに切り替えて刺激を得るようにしています。タスク指向の学習が私には一番合っています。
私が使った初心者に優しい無料ホストのいくつか
- GitHub page
無料プランでは、公開するためにリポジトリを public にする必要があります。ただし、独自ドメインを割り当てることは可能です。
GitHub との連携がとても簡単で、コンタクトフォームのサポートが組み込まれているため、自分のサーバーを持つ必要がありません。Netlify CMS の認証と統合すれば、静的ブログにログインできるようにもなり、すべて無料です。(欠点は Next Image のサポートがないことです。つまり <Image> の最適化を活用できません。そのためには Vercel を使えますが、フォームのサポートを失うので、どちらを選ぶかです。私がこれを知っているのは、NextJS サイトを Netlify にプッシュしてエラーに遭遇したからです。)
UI は Netlify ほどクールで初心者に優しいわけではありませんが、帯域幅は無制限で、無料ホスティングがあり、限定的ながらクラウド関数も使えます。Netlify ほど初心者に優しくはありませんが、それほど難しくもありません。必要な基本的なもの、欲しいものがすべて無料で揃っています。そしてドメインもそこで取得したので、今では私の定番の静的ホストです。
無料のバックエンドホスト
私にとって初めてのバックエンドでした。基本的な用途にはとても使いやすいです。CPU 計算時間に制限があるため、大きな処理タスクをこのサーバーで無料で実行することは実質できません。しかし、常に稼働しているため、RESTful API にはとても適しています。
express.js をホストするための私の新しい選択肢です。欠点は15分間非アクティブだと自動的にスピンダウンすることです。JavaScript サーバーをホストできる、無料で常時稼働のサーバーはまだ見つけていません。ただし、スピンダウンしないサーバーは月額約7ドルで、それほど高くなく、デビットカードも使えるのが気に入っています。UI も簡単です。
いいえ、私にはあまりにも圧倒的でしたが、手頃な価格でスケーラビリティに優れているようです。ウェブサイトの UI が初心者に優しくなく、VPS についてあまり知らないので、まだ手を出していません。
Google Cloud は無料プランでも開始するのにクレジットカードが必要で、私はたまたま持っていませんでした。Firebase は認証システムを無料で簡単に構築するのに適しています。これは後で探求するつもりです。
ウェブサイト公開のサイクル全体を学ぶために
HTML/CSS と基本的な JS でいくつか簡単なウェブサイトを作った後、ブログを作りたくなりました。そういうことができる静的サイトジェネレーターがたくさんあることを知りました。Hugo や 11ty などでテンプレートを検索しました。NodeJS の扱い方を理解するのにとても良かったです。これらのテンプレートを扱うには少しのコーディングロジックが必要なだけですが、ウェブサイト構築のサイクル全体を練習できます。
Creating a new git repository > create the site with NodeJS > connect & auto push to 3rd party host > manage your domain > compare the features & price for each web host to best suits your objective or language.ほとんどのプロジェクトで異なるのは「create the site with NodeJS」の部分だけで、ここでは Python を使うこともできますが、学んだ他のことは依然として当てはまります。
ブログ構築についてさらに
大きな難しさはブログ機能そのものではありません。コメント欄です。初心者としてブログを書き、コンテンツに集中したいなら、WordPress を使うことをおすすめします。すべてが揃っていて、手間がかかりません。
そうでなければ、静的ブログにコメント欄を統合するには Disqus を使えます(プライバシー問題で評判が良くなく、読み込み時にメモリを大量に消費します)。あるいは GitHub ログインを使うオープンソースの代替手段もあります。しかし、私の知る限り、無料で Google ログインを許可するものはまだ一つもありません。あるいは自分でバックエンドのコメントサーバーを構築することもできますが、その場合はスパムのフィルタリングなどにも対応する必要があります。私にはあまり理想的ではありません。結局 Disqus を使うことにしましたが、読み込み時間を節約するために、ユーザーが「Show comments」をクリックするまで自動読み込みしないようにしています。
ChatGPT について
役に立つのはある程度までです。複雑なロジックには使わないようにしましょう。たいてい問題が起きます。厄介な問題の一つは、コードに変更を加えてもそれを知らせてくれないことです。初稿には役立ちます。バグのないコードが欲しいなら適していません。それは決してやってくれません。また、コードを再レビューさせるほど、エラーが増えることにも気づきました。それは、そのことを学んで自分で書くよりも煩わしく、時間がかかりました。
次にやること
サインアップ/ログイン認証と SQL データベースサーバーを備えた本物のバックエンドを構築する方法を学ぶことです。今回は Django を試して、クロスプラットフォームアプリで動くバックエンドを構築してみるかもしれません。
目標
学び続け、面白いプロジェクトを作り続けること。
読んでいただきありがとうございました!