| ページ一覧 | ブログ | twitter |  書式 | 書式(表) |

MyMemoWiki

「Next.js」の版間の差分

提供: MyMemoWiki
ナビゲーションに移動 検索に移動
34行目: 34行目:
 
npm run dev
 
npm run dev
 
</pre>
 
</pre>
 +
 +
[[File:Start_next_js.png]]
 +
 
===本番ビルド+実行===
 
===本番ビルド+実行===
 
<pre>
 
<pre>

2024年10月5日 (土) 02:55時点における版

React

  • Reactは、あくまでUI部分のみ
  • 本格的なアプリ開発には周辺領域を担うためのフレームワークが必要
  • Reactベースのフレームワークとしてデファクトスタンダードと言える存在
  • 主なライブラリ
    • ファイルシステムベースの設定レスルーター
    • サーバーコンポーネント
    • データ取得用fetchメソッド
    • リソース組み込みの自動最適化
    • CSSフレームワーク、Tailwind CSSへの標準対応


導入

newdelhi:Workspaces piroto$ npx create-next-app@latest
Need to install the following packages:
create-next-app@14.2.14
Ok to proceed? (y) y

✔ What is your project named? … first-nextjs-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
Creating a new Next.js app in /Users/piroto/Workspaces/first-nextjs-app.

実行

開発

npm run dev

Start next js.png

本番ビルド+実行

npm run build
npm start