個人開発【個人開発】アスキーアートを生成する簡単なアプリケーションを作ってみた はじめに初めて個人開発として、AAGeneratorというWebアプリケーションを開発し、公開するところまでやったので、AAGeneratorについて簡単に紹介したいと思います。AAGeneratorとはAAGeneratorは、好きな文字...2023.08.25個人開発
開発環境【Typescript × Next.js × VSCode】ESLintとPrettierの設定 はじめに下記の開発環境にて、ESLintとPrettierを設定する方法について紹介していきます。TypescriptNext.jsVSCodeESLintとPrettierまずはESLintとPrettierについて、ざっくり紹介します。...2023.08.15開発環境
プログラミング【Typescript】Reactでテキストをコピーするボタンを実装する はじめにTypescriptとReactでテキストをコピーするボタンの実装をしてみます。CopyButtonの実装クリップボードへのコピー部分に関しては下記のclipboard-copyを利用します。テキストをコピーするボタンの実装内容は下...2023.07.30プログラミング
プログラミング【Typescript】Next.jsのApp Routerで最小のHello Worldを作成してみる はじめにNext.jsのAppRouterで最小構成のHelloWorldアプリを作成してみます。AppRouterAppRouterはNext.js13.4から安定版になった新しいルーティング機能で、従来の方法はPagesRouterと呼...2023.07.17プログラミング
DockerDocker ComposeでNext.jsとflask開発環境を構築する はじめにDockerComposeでNext.jsとFlaskの開発環境を構築します。今回構築するのはNext.jsをフロントエンド、Flaskをバックエンドとしたアプリケーションになります。Next.jsコンテナまずはNext.jsアプリ...2021.10.12Docker
WebNext.jsでMaterial-UIを使う はじめにNext.jsでMaterial-UIを利用する方法を紹介します。Material-UIとはMaterial-UIは、マテリアルデザインのReactコンポーネントを簡単に取り入れられるライブラリです。Next.jsでMaterial...2021.08.21Web
DockerDocker ComposeでNext.js開発環境構築 はじめにNext.jsの開発環境をDockerで構築していきます。DockerfileでNext.jsのアプリが実行されるコンテナのイメージを用意し、DockerComposeで実行する方法をとります。そうすることでバックエンドとしてAPI...2021.08.06Docker
Web【Next.js初めの一歩】アプリを作成する はじめにNext.jsでアプリを作成する方法を紹介します。Next.jsでアプリ作成手動で作成することもできますが、create-next-appを利用して自動でアプリを作成することが推奨されています。npmでアプリを作成するには以下のよう...2021.08.05Web
WebCSR/SSR/SSGについてざっくり解説 はじめにNext.jsを勉強し始めたいのですが、CSR/SSR/SSGなどの単語の意味がわからないため、それらについてざっくり理解していきます。CSR(ClientSideRendering)CSR(ClientSideRendering)...2021.08.01Web