サイトアイコンFronted Code

私の知識や、知ってたらよかったこと等が書いてあるブログです

2021/03/09

ReactNext.jsの始め方

Next.js の始め方

はじめに

Next.js とは、React ベースのフロントエンドフレームワークであり SSR や SSG 環境を構築するために使用します。 Vercelという会社によって開発されました。

前提

今回は、サクッと環境構築するためテンプレートを使用します。 npx コマンドをしようするので、未だインストールしていない方は次のコードをターミナルで実行してください

npm install -g npx

環境構築

npx を入手できましたね。では次のコードを実行してください

npx create-next-app

create-react-app を使用したことがある方は直感的に理解できると思いますが、このコードが意味することはまさにそれです。

そして次に、このようなコードが現れるかと思われます。

Need to install the following packages:
  create-next-app
Ok to proceed? (y)

簡単に訳すと, create-next-app っていうパッケージが必要だから入れていい? となります。ここはもちろん y(yes)を押して Enter で構いません。

これで終了です。たった一行で開発環境ができるので学習者にはありがたいですよね。