Closed15

Next.jsのチュートリアルをやる

簡単すぎる。
Pageディレクトリの下につくったjsファイルがそのままurlとして公開される

export defaultがないとエラーになる。
この辺の指定は後でドキュメント見たい

ページ遷移はLinkを使う。
HTMLライクな<a>はNext.jsの内部のページ遷移の際は使わない、外部サイトに使う。

<Head>タグもhtmlの<head>ではなく、import Head from 'next/head'でimportしてる、next.jsのモジュール

styled-jsxというライブラリを使うと、CSSをReact内部に書ける

<style jsx>{``}</style>

ReactはブラウザのJS禁止されたら何もできないが、Next.jsはpre-renderingの仕組みがあるから、動く。
これすごいけど、無効になる機能がさすがにあるんじゃないかな?
その辺がよくわからない

https://nextjs.org/learn/basics/data-fetching/pre-rendering

Static GenerationとServer-side RenderingはPageごとに設定がわけられるそう。
全部Server-side Renderingでいいんじゃないかと思っていたら、そんなことはないらしい。
さほど頻繁にデータ更新が入らない画面なら、Static Generationでやって、
毎秒更新が入るようなページに対してのみSSRを使うのが基本指針とのこと

https://nextjs.org/learn/basics/data-fetching/two-forms

うーんチュートリアルちょっと迷子になった気がする……
getStaticPropsって結局なんで動いてるんだ?

Dynamic Routingの仕組みはなんとなくわかった

Next.jsのチュートリアル雑感

  • 簡潔な記述なのは良かった
  • Next.jsの概念を必要十分に説明しているところも良い
  • ただ説明不足感があって、所々置いてけぼり感があった
    • 特に「Pre-rendering and Data Fetching」のあたり
  • 全体的にあまりいいチュートリアルとは思わなかった。ある程度わかってる人向けの、必要十分、という感じ
このスクラップは2021/06/09にクローズされました
ログインするとコメントできます