プログラミングマガジン

プログラミングを中心にIT技術をできるだけわかりやすくまとめます。

  • ホーム
  • Next.js
 
 
     
  • サーバー言語  
    • Ruby
    • PHP
    • SQL
  •  
  • インフラ  
       
    • AWS
    •  
    • 基本
    • Git
  • Web
       
    • Web開発
    • JavaScript
    • Vue.js
    • React
  •  
  • 設計  
       
    • 実装設計
    • DB設計
  • 問い合わせ
  

カテゴリー:Next.js

  1. 10.08

    【Next.js】SSGでApollo Clientを使うには。

    SSG(Static Site Generation)とは? 事前にサーバーサイドでデータを取得するのでブラウザのJavaScriptが無効になっていてもデータを読み込むことができます。 初回のビルドを前もってやっておくのでページの…

    • Next.js
    • コメントを書く
  2. 10.08

    【Next.js】「Hasura」と「Apollo Client」の連携

    Next.jsではクライアントサイドとサーバーサイドの処理を扱うことができるのでApolloClientを使う場合は処理の切り分けが重要になってきます。 サーバーサイドで実行される箇所(SSG、ISR:getStaticProps、get…

    • GraphQL, Hasura, Next.js, React
    • コメントを書く
  3. 05.12

    【React、Next.js】「環境変数」の組み込み方について

    ReactやNext.js(バージョン9.4から使えるようです。)には標準で環境変数機能が備わっています。 環境変数設定ファイル 変数の定義方法 環境変数の反映にはアプリの再起動が必要になります。 React [crayon-64…

    • Next.js, React
    • コメントを書く
  4. 01.20

    【Next.js】「エラーハンドリング」

    Error Boundary コンポーネント内で発生する特定のエラー(実行時エラーなど)しかcatchしてくれない。以下のエラーは捕捉しないので、現状はあまり使い道はないかもしれない。 イベントハンドラ内で発生したエラー …

    • Next.js
    • コメントを書く
  5. 01.17

    【Next.js】ディレクトリ構成、「_app.tsx」と「_document.tsx」、APIルート機能など

    ディレクトリ名 説明 .next プロジェクト作成時にはなく実行すると生成されます。この中にプロジェクトから生成されたWebアプリのファイル類が保存されます。 pages ここで指定した…

    • Next.js
    • コメントを書く
  6. 01.16

    【Next.js】各種コマンドについて

    next dev 開発時にはこれを実行します。リクエストの都度サーバーサイドでページの生成(SSG)、クライアントサイドでレンダリング(CSR)が実行されるのでページの取得はページ遷移は遅くなります。 具体的な挙動 「ge…

    • Next.js
    • コメントを書く
  7. 08.13

    【Next.js】「CSR」、「SSR」、「SSG」の違い

    使い分け SEO リアルタイム更新 サイト再生成 初期ロード ページ遷移 サーバー負荷 用途 CSR × ○ × 遅い 早い SSR ○ ○ ○ 遅い…

    • Next.js
    • コメントを書く
  8. 05.16

    【Next.js】「CSR(UseSWR)」について

    useSWRとは? 「クライアントサイドレンダリング」の技術です。なので、もしブラウザでJavaScriptを無効化していたら動かなくなります。(なお、SSGやSSRやISRなどはサーバーサイドで動作するのでブラウザのJavaScript…

    • Next.js
    • コメントを書く
  9. 05.16

    【Next.js】Next.jsの基本コンポーネント、ページ遷移、ページのテスト

    基本コンポーネント Head [crayon-6482789b207ff610915412/] 以下のように使います。タイトルが表示されます。 [crayon-6482789b20809809917906/] Link ページ遷…

    • Next.js
    • コメントを書く
  10. 05.09

    【Next.js】「getStaticProps」、「Dynamic routes」について

    getStaticPropsとは? Next.js内(フロントエンド)で定義した関数が必ずバックエンドで実行される。 pages内でのみ使用可能 「npm run dev」の場合はリクエスト毎に実行される。 「n…

    • Next.js
    • コメントを書く
  • 1
  • 2
  • »
RETURN TOP

著者プロフィール

エンジニア歴10年で過去に業務系、Webデザイン、インフラ系なども経験あります。現在はWeb系でフロントエンド開発中心です。

詳細なプロフィールはこちら

スポンサーリンク

カテゴリー

  • Android
  • API
  • AWS
  • C++
  • CSS
  • C言語
  • DDD
  • DevOps
  • Django
  • Docker
  • Git
  • GitLab
  • GraphQL
  • Hasura
  • Java
  • JavaScript
  • Kubernetes
  • Laravel
  • linux
  • MySQL
  • Next.js
  • nginx
  • Node.js
  • NoSQL
  • Nuxt.js
  • Oracle
  • PHP
  • Python
  • React
  • Redux
  • Rspec
  • Ruby
  • Ruby on Rails
  • Sass
  • Spring Framework
  • SQL
  • TypeScript
  • Unity
  • Vue.js
  • WebRTC
  • Webサービス開発
  • Webデザイン
  • Web技術
  • インフラ
  • オブジェクト指向
  • システム開発
  • セキュリティ
  • その他
  • データベース
  • デザインパターン
  • テスト
  • ネットワーク
  • プログラミング全般
  • マイクロサービス
  • マイクロソフト系技術
  • マルチメディア
  • リファクタリング
  • 業務知識
  • 設計
  • 関数型言語
RETURN TOP

Copyright ©  プログラミングマガジン | プライバシーポリシー