Next.js でGoogle Fonts を利用する
こんにちは。 これはNext.js でGoogle Fonts を利用する方法を調べたときのメモ。 フォントの最適化について 現在のNext.js ではGoogle Fonts に対してWebフォントの最適化が行われている。 特に設定をせずにWebフォントの追加を行うだけで最適化される。 ただし、Webフォントを追加する場所は各コンポーネントやpages/_app.js ではなく、pages/_document.js に追加する必要がある。 // pages/_document.js import Document, { Html, Head, Main, NextScript } from 'next/document' export default class MyDocument extends Document { render() { return ( <Html> <Head>
Next.jsの_app.jsと_document.js - Qiita
Next.jsで基本的な挙動が理解できたら、次に考えることは実践で使う細かい設定だ思います。つまり、ページ全体の共通の設定や、状態管理、エラーハンドリング（これは明日のアドベントカレンダーでまとめます。）などです。 全体設定のためのインターフェイスとしてNext.jsが用意しているのが、pages/_app.jsとpages/_document.jsになります。 それぞれの役割と実際に使われる場面を見ていきましょう。 一部、公式ドキュメントを翻訳しています。 https://nextjs.org/docs/#custom-app import React from 'react' import App, { Container } from 'next/app' export default class MyApp extends App { static async getInitial
2020年のフロントエンドマスターになりたければこの9プロジェクトを作れ - Qiita
以下はSimon Holdorf( dev.to/ Twitter / GitHub )による記事、9 Projects you can do to become a Frontend Master in 2020の日本語訳です。 9 Projects you can do to become a Frontend Master in 2020 Introduction あなたがプログラミングの初心者であるか、既に経験豊富な開発者であるかにかかわらず、この業界では、急速な変化に追いつくために新しい概念と言語・フレームワークを学び続けることが必要です。 たとえばFacebookが4年前にオープンソース化したReactは、既に世界中のJavaScript開発者にとって第一の選択肢になっています。 もちろんVueとAngularにも多くのフォロアーがついています。 さらにはSvelte、Next
Next.jsをはじめる - Qiita
Next.jsアドベントカレンダー2018の1日目です。 Reactを使ってSPAで開発したい事情がある、でもSEOとユーザビリティのためにSSRが最適解。 そういった場合、Reactを用いたシンプルなIsomorphic JavascriptフレームワークであるNext.jsがあります。 使ってみると案外簡単でフレキシブルで、非常に良いです。 世間ではNuxt.jsが大流行ですが、Next.jsを少しでも使ってもらえるように、はじめるにあたってのガイドを共有したいと思います。 特徴を知る Next.js公式サイトの中にある、チュートリアルの冒頭に下記特徴が書かれています。 Server-rendered by default デフォルトでサーバーサイドレンダリングされる Automatic code splitting for faster page loads 高速ページローディングの
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Resolving "Built-in next/font" Error in Next.js
Vercel Deployment Error: Command "npm run build" exited with 1
