【Next.js】プロジェクトを作ってみる

【Next.js】プロジェクトを作ってみる

はじめに

コジマです。

Next.js気になったのでちょっと触ってみようかと。

https://nextjs.org/docs/getting-started/installation
を見て以下のコマンドを実行

npx create-next-app@latest

以下の質問聞かれます。Yesでいいですね。

What is your project named? my-app
Would you like to use TypeScript? No / Yes
Would you like to use ESLint? No / Yes
Would you like to use Tailwind CSS? No / Yes
Would you like to use `src/` directory? No / Yes
Would you like to use App Router? (recommended) No / Yes
Would you like to customize the default import alias? No / Yes
What import alias would you like configured? @/*

一応npm ciしておきましょう。

npm ci

開発モードで起動して、localhost:3000で画面が起動すればOK!

npm run dev

さいごに

記事執筆時点(2023.8.21)でNode.jsのバージョンが16.8以上必要なことに注意です。

フレームワークって単純に起動するだけならめちゃめちゃ簡単ですね。いい時代です。

この記事を面白いまたは役に立ったと思ってくれた方は是非私のTwitter(@kojimanotech)を
フォローしてくれたらうれしいです!

以上、コジマでした。

もっと学びたい人はこちら

JavaScriptをもっと学びたいエンジニアのためにおすすめのUdemy講座を紹介いたします!

JavaScript初心者向けの講座です。
HTML、CSSと合わせて学ぶことができます。
フロントエンド開発の基本的な知識を網羅的に学ぶことができます。
個人的には著作権表記についても触れているところが推せますね。
ウェブ開発入門完全攻略コース – HTML/CSS/JavaScript. プログラミングをはじめて学び創れる人へ!

JavaScriptをより深く学びたい人はこちらがおすすめです。
JavaScript初心者を脱するとよりよいコードを書かなければなりません。
つまずきがちなオブジェクト操作や、非同期処理の仕組みについて学ぶこともできるため、JavaScriptの仕組みから深く学ぶことができます。
【JS】ガチで学びたい人のためのJavaScriptメカニズム

気になった人はぜひ見てみてくださいね!


Next.jsカテゴリの最新記事