Next.jsをVercelでデプロイ!

FRONT END

LiSMOtechの小谷です。前回作成したNext.jsのチュートリアルをVercelを使ってデプロイします!

Vercelにサインアップ

まず、Vercelにサインアップしましょう。

githubのアカウントを持っている方はすぐに入れますね。

 

今回はgithubアカウントで入ります。

Vercelでプロジェクトを作成

ダッシュボードから新規でプロジェクトを作ります。

New Projectボタンをクリックします。

そうしますと、以下のような画面が出てくるので、対象とするレポジトリの「Import」ボタンをクリックします。

その後、プロジェクトの設定が出てくるので、設定します。

と言っても今回はとても簡単です。笑

 

今回はチームではないので、こちらはスキップします。

 

プロジェクト設定はデフォルトで入れてくれてるままで大丈夫そうです。

そして、Deployボタン押します!

あとは勝手にビルドしてくれて、勝手にデプロイしてくれます。

 

まとめ

Vercelを使うととても簡単にデプロイできます!

基本的にダッシュボードの操作感もその他のホスティングサービスと似た感じあるので、特に抵抗なく進められると思います。

 

ちなみに、僕はなぜか一回目がうまくいかなかったのですが、設定見直して再デプロイしてら大丈夫でした。

公開するロートディレクトリの設定が間違っているのかと思いましたが、そうではなかったみたいで結局、原因は不明のままです。。。

使いこなしていくと分かるようになるかもしれませんね。


ともに考え、寄り添う。プロのデザインチームが即参戦。

販促ツールや一貫したデザインによるブランド構築などビジネスの成長をデザインの力で促進します。

NEXTGATE LiSMOtechでは中小企業を中心にブランディング・WEBマーケティングを活用したWEB戦略を提供しています。

企業課題・問題に関するご相談、WEBサイト制作やグラフィックデザイン制作のクリエイティブに関するご相談やご質問、お見積りなどお気軽にお問い合わせください。

お得な情報がLINEに届く!!

LINE公式アカウントはこちらから。

友だち追加

最新記事

CONTACT

NEXTGATE LiSMOtechでは中小企業を中心にブランディング・WEBマーケティングを活用したWEB戦略を提供しています。
企業課題・問題に関するご相談、WEBサイト制作やグラフィックデザイン制作のクリエイティブに関するご相談やご質問、お見積りなどお気軽にお問い合わせください。

平日10:00〜19:00

お電話の場合こちらから

043-305-4162

平日10:00〜19:00