Next.js– category –

この記事ではNext.jsでPrismaを使う方法をご紹介します。 Prismaを使うことでJSでデータベース作ったり、クエリを発行してデータを取得することができてとても便利です。 この記事ではPlatforms Starter KitとPrisma Examplesを参考にしています。 【prism...

この記事ではNext.jsでnext-seoを使う方法をご紹介します。next-seoはNext.jsのプロジェクトでSEOで必須となるタイトルタグやメタタグを管理するプラグインです。 Next.jsをインストール済みとして進めていくので、Next.jsのインストールがまだの方は「Nex...

I will show you how to use axios to get data in Next.js SWR. The API server is assumed to be Laravel.We also assume that Laravel is using Eloquent's API Resources when returning data. https://laravel.com/docs/8.x/eloquent-resources So, w...

useSWR()を使ってデータを取得するには以下の方法で取得できました。 const commentsFetcher = (url: string): Promise<fetchCommentsReturnType> => axios(url).then((res) => res.data); const { data: comments, error:commentsError } = u...

Next.jsのSWRでデータを取得するときにaxiosを使った方法をご紹介します。 APIサーバーはLaravelを想定しています。また、Laravelでデータを返すときはEloquentのAPI Resourcesを使用しているものとします。 https://laravel.com/docs/8.x/eloquent-resour...

Next.js links and Material-UI links cannot normally be used together.However, with a little ingenuity, they can be used together. The following are the requirements for the Link component that we will create using Next.js and Material-UI...

Next.js and material-table are very easy to use and I use them a lot.However, they don't work well together, and material-table doesn't work straightforwardly with Next.js. There is a sticking point for using material-table in Next.js, a...

Next.jsのLinkとMaterial-UIのLinkは通常併用できません。しかし、ちょっとした工夫でこれらを併用できます。 Next.jsとMaterial-UIのLinkを用いて作るリンクのコンポーネントの要件は次のとおりです。 リンクができるNext.jsのLinkが機能するMaterial-UI...

Next.jsとmaterial-tableはとても使い勝手がいいので僕はよく使います。しかし、これらは相性が悪く、Next.jsでmaterial-tableは素直に動いてくれません。 Next.jsでmaterial-tableを使用するにはハマりポイントがあり、以下のエラーが出ます。 TypeError:...