Vercelで出欠管理アプリをホスティングする
目次
こんにちは。
クラウドソリューショングループ2のKongsです。
私たちには開発したいアイデアや、過去のポートフォリオを活用して外部への認知度を高めたいと考えることがよくあります。
一般的なウェブサイトのデプロイは手間がかかり、ホスティングサービスプロバイダーの利用、ドメインの購入、長期的なセットアップや管理が必要です。
しかし、新しいサービスプロバイダーであるVercelの登場により、これらの課題を気にせず、簡単にプロジェクトをデプロイできるようになりました。
本日は、Vercelとは何か、そしてその使用方法について紹介します。
Vercelとは
Vercelは、ウェブサイトホスティングを提供するクラウドプラットフォームで、特にReactやNext.jsフレームワークを使用したプロジェクトに適しています。
プロジェクトのアイデアを検証し、ウェブサイトホスティングに伴う面倒な作業(ドメイン登録、稼働時間、ウェブサイトトラフィックの管理など)を処理し、Githubを利用することで簡単にデプロイできます。
Vercelの利用を検討するタイミング
いくつかのプロジェクトをデプロイした経験から、以下の場合にVercelを利用することをお勧めします。
- プロジェクトやポートフォリオを紹介するウェブサイトを簡単にデプロイしたい場合
- 主にフロントエンドのみのウェブサイトで、バックエンドの操作に依存しない場合
(APIコールを設定すればバックエンド機能を利用することも可能です。) - ウェブサイトがアクセスされたときに動作するだけで良い場合
- 高トラフィックを予想せず、専用のウェブホスティングに多くの費用をかけたくない場合
以下のような場合には、Vercelを利用しない方が良いでしょう。
- バックエンドを含むフルスタックデプロイをしたい場合
- 専用のホスティングや、通常の見た目のドメインを持つウェブサイトを希望する場合
- 高トラフィックを予想しているが、それに見合う予算がない場合
Vercelを使用する際の注意点
Vercelを利用してウェブプロジェクトをデプロイするのは非常に便利ですが、いくつかのデメリットもあります。
以下は主な注意点です。
- 高パフォーマンスが必要なウェブサイトには、コールドスタートが発生するため不向きです。
- Hobbyプランは試用に適していますが、使用制限を超えるとウェブサイトが一時停止され、制限がリフレッシュされるか料金を支払うまで再開されません。
- Proプランに切り替えた後、無料プランの制限を超えると、従来のクラウド(AWSなど)でホスティングする場合より100~200%高額になる可能性があります。
- チームベースのプロジェクトには適していません。ロール管理などの関連機能は有料プランでのみ利用可能です。
- CI/CD、アナリティクス、ログ機能はすべて有料プランに限定されています。
追加の料金情報
以下は、有料プランでのみ利用可能な主な機能の一覧です。
- コールドスタート防止
- ページパフォーマンスやCore Web Vitalsなど、基本的なインサイト以外のカスタムアナリティクス
- チームシートおよびプロジェクト管理(1席あたり月額20ドル)
- 1TBを超えるデータ転送
- 100GBを超えるオリジントランスファー
Proプランは月額20ドルで、無料プランの制限を超えると料金が急激に増加する可能性があります。
クラウドプロバイダーを使用してプロジェクトをデプロイする方法を知らない場合を除き、Proプランの利用は推奨されません。
詳細な料金情報については以下のリンクをご参照ください:
https://vercel.com/docs/pricing
Vercelの使用方法
上記リンクにアクセスすると、次のランディングページが表示されます。
「Start Deploying」を選択してください。
プロジェクトをVercelでホスティングする最も簡単な方法は、プロジェクトをGithubのリポジトリ(公開または非公開)としてすでに設定しておくことです。
そこから、リポジトリを直接インポートしてデプロイを行えます。
https://attendance-app-bice.vercel.app/
上記は、デモとして私が作成したウェブサイトです。
このウェブサイトでは、「.docx」形式の名前リストを受け取り、出席を記録するオプションを表示します。
ウェブサイト自体の画像は以下の通りです。
このサイトをVercelでデプロイするのにかかった時間は5分以内でした。
リポジトリのインポートからサイトの公開までの手間を考えると、Vercelの利便性が実感できます。
結論
上記の例から、Vercelがいかに便利なツールであるかが明らかです。
アイデアを素早く形にしたいと考える開発者には、ぜひ試してみることをお勧めします。
今日から素晴らしいアイデアを生み出してみてはいかがでしょうか。
