サーバ（Express)、データベース（mongoDB）間のやり取りをmongooseを使って実装してみる

Webの概念としてクライアントから送られたリクエストをサーバが受け取り、サーバはデータベースとやり取りを行い、結果をクライアントへレスポンスとして返します。今回はこの一連のやり取りのサーバ、データベース間の処理に注目し…

【2024年版】Viteプロジェクトの環境変数設定

モダンなフロントエンド開発において、環境変数の適切な管理は開発効率とセキュリティの両面で重要な要素となっています。特にViteを使用したプロジェクトでは、開発環境（development）、検証環境（staging）、本…

今回はReact.memo / useMemo / useCallback の違いについて記録を残していきたいと思います。特に指定しなくてもアプリケーションとしては動くかなと思いますが、余計なレンダリングを避け、効率的…

Reactを使って開発をしていると、役割を分割するためにカスタムフックを書く場面があるかと思います。今回はそのカスタムフックの簡単なテストコードをReact Testing LibraryとJestを使って書いてみます…

web開発をしている中で、全体像を把握するときに、バックエンド側の知識もつけないと辛いなという場面が多々出てきたため、重い腰を上げてSQLを勉強しました。 SQLとMySQLの違いもわからなかったくらいの初心者なので、何…

1. 環境構築 Next.jsのセットアップ Nxの公式ドキュメントを参考に環境構築をします。 Next.jsで新しいNxワークスペースを作成するには下記コマンドを実行します。 workspaceはデフォルトの「org」…

まずは完成形を確認します。 3択クイズをアラートで正解/不正解を表示させ、最後に何問正解したかを表示させます。 1.下準備まずは3択クイズの見た目部分を整えていきます。 jsxの中はmap関数でループ処理しますが、一旦…

Three.js とは、できるだけ簡単にWebページ上に3Dコンテンツを表示する3Dライブラリです。今回はthree.jsの基本、回転するキューブを作成していきます。コードはこちら https://github.co…

固定ページでページを作成した時、bodyにページのスラッグを用いたclassを付与したいときありますよね。例えばcompanyというスラッグなら class=”company” が、servic…