1
/
5

Reactのフレームワーク”Next.js”を触ってみた

弊社チーフエンジニア(みーや)のやってみた!をご紹介
今回はReactのフレームワークである「Next.js」を公式チュートリアルをもとに触ってみました。

Part1.

普段の開発ではReactを使用しているのですが、最近フロントエンド関連の記事でNext.jsをよく目にするようになったので、基本的な機能をチュートリアルを通して触ってみて知ったことをまとめたいと思います。

Next.jsはReactベースのフレームワークです。
公式の導入部分にて、Reactを使ってWebアプリケーションを開発する際の考慮点を取り上げた上で、Next.jsはそれらをすべて解決してくれると紹介されていました。

続きはこちら→


Part2.

今回は4つ目の pre-rendering and Data Fetching です。

  1. Create a Next.js App
  2. Navigate Between Pages
  3. Assets, Metadata, and CSS
  4. Pre-rendering and Data Fetching
  5. Dynamic Routes
  6. API Routes
  7. Deploying Your Next.js App

Next.jsではデフォルトですべてのページにおいてpre-renderingが有効になっています。 pre-renderingにより、ページのHTMLを事前に生成するためクライアントサイドですべてのJavaScriptを実行するのに比べて、パフォーマンスもSEOも良くなります。

続きはこちら→

株式会社ウエディングパークでは一緒に働く仲間を募集しています
同じタグの記事
今週のランキング
株式会社ウエディングパークからお誘い
この話題に共感したら、メンバーと話してみませんか?