Next.js

スポンサーリンク
個人開発

【個人開発】アスキーアートを生成する簡単なアプリケーションを作ってみた

はじめに初めて個人開発として、AAGeneratorというWebアプリケーションを開発し、公開するところまでやったので、AAGeneratorについて簡単に紹介したいと思います。AAGeneratorとはAAGeneratorは、好きな文字...
開発環境

【Typescript × Next.js × VSCode】ESLintとPrettierの設定

はじめに下記の開発環境にて、ESLintとPrettierを設定する方法について紹介していきます。TypescriptNext.jsVSCodeESLintとPrettierまずはESLintとPrettierについて、ざっくり紹介します。...
プログラミング

【Typescript】Reactでテキストをコピーするボタンを実装する

はじめにTypescriptとReactでテキストをコピーするボタンの実装をしてみます。CopyButtonの実装クリップボードへのコピー部分に関しては下記のclipboard-copyを利用します。テキストをコピーするボタンの実装内容は下...
プログラミング

【Typescript】Next.jsのApp Routerで最小のHello Worldを作成してみる

はじめにNext.jsのAppRouterで最小構成のHelloWorldアプリを作成してみます。AppRouterAppRouterはNext.js13.4から安定版になった新しいルーティング機能で、従来の方法はPagesRouterと呼...
Docker

Docker ComposeでNext.jsとflask開発環境を構築する

はじめにDockerComposeでNext.jsとFlaskの開発環境を構築します。今回構築するのはNext.jsをフロントエンド、Flaskをバックエンドとしたアプリケーションになります。Next.jsコンテナまずはNext.jsアプリ...
Web

Next.jsでMaterial-UIを使う

はじめにNext.jsでMaterial-UIを利用する方法を紹介します。Material-UIとはMaterial-UIは、マテリアルデザインのReactコンポーネントを簡単に取り入れられるライブラリです。Next.jsでMaterial...
Docker

Docker ComposeでNext.js開発環境構築

はじめにNext.jsの開発環境をDockerで構築していきます。DockerfileでNext.jsのアプリが実行されるコンテナのイメージを用意し、DockerComposeで実行する方法をとります。そうすることでバックエンドとしてAPI...
Web

【Next.js初めの一歩】アプリを作成する

はじめにNext.jsでアプリを作成する方法を紹介します。Next.jsでアプリ作成手動で作成することもできますが、create-next-appを利用して自動でアプリを作成することが推奨されています。npmでアプリを作成するには以下のよう...
Web

CSR/SSR/SSGについてざっくり解説

はじめにNext.jsを勉強し始めたいのですが、CSR/SSR/SSGなどの単語の意味がわからないため、それらについてざっくり理解していきます。CSR(ClientSideRendering)CSR(ClientSideRendering)...
スポンサーリンク