2021-01-01から1年間の記事一覧
ReactとNode.js Expressを使って、チャットアプリの超基礎となる部分を作成した。今回は、機能を追加し、さらにチャットアプリに近づける。
箇条書きを入れ子にした際、マーカーを入れ子構造がわかりやすいように変更する方法のメモ。
型定義が必要なTypescriptを利用しているが、何を定義したらよいか難しい場合があるので、調べた内容を記載する。
eact-router-domを利用して基本のページ遷移を実施する。 react-router-domは2021/11/3にバージョン6がリリースされたようだが、情報が少なくて独学が難しいのでバージョン5から始める。
Reactのreact-router-domを例に、yarnで古いバージョンのパッケージをインストールする方法メモ。
React × TypeScriptでコンポーネントを追加するときに毎回迷うので、基本となる要素をメモ。
ReactでCSSを適用する方法のメモ。ReactでCSSを当てる方法はいくつかある。覚えておけばよさそうなものだけ抜粋してメモ。
Reactのレンダリングに関わるuseEffect、memo、useCallback、useMemoに関しての基本事項を記載。
AWS AmplifyでReactアプリを作成しようとしたところ、ビルド実行時にエラーとなったので原因をメモ。
Reactを勉強する中でJavaScriptの記法を利用している。 その中でよく出てきた、超基本の重要なJavaScript記法をメモしておく。今後、何か月か勉強をお休みすることがあると忘れそうなため。
Reactを利用してアプリを作っていたところ、予期せぬ大量レンダリングが発生して画面描画が遅くなってしまった。 いろいろ試した結果、useStateのset関数の使い方が悪いことがわかったのでメモ。
ReactとExpressを利用して簡易チャットアプリを作成した。 実施した内容をメモ／紹介する。
チャットアプリの事前準備として、画面サーバ（React）とWebサーバ（Node.js）を別々に構築して、クライアントとWebサーバ間をSocket.ioで接続する。
自分で画面サーバとWebサーバを作成し、通信させる。 具体的には、画面サーバがWebサーバから値を取得して、画面表示する。 また、このときに必要になるCORSについて理解する。
dockerコンテナを立ち上げる。 また、今回はdocker-composeというツールも利用する。
Windows上にLinuxの仮想環境を構築する方法として有名なVagrantの立ち上げ方メモ。
手書きで書いた文字の黒い部分を抽出し、データ化する方法を考えたのでメモ。手書きで味のある文字を写真の上などに乗せられたらかっこいいなと思い実施。
Expressで利用される「ミドルウェア」と、ミドルウェアを呼び出すときに使われる`app.use`について調べたことをメモ。
Node.jsでWEB-APIサーバを立ち上げたが、一部の処理を別のモジュールとして切り出したい場合がある。自分でモジュールを定義して、処理を呼び出す方法をメモ。
前回、Node.jsを利用してWEB APIサーバを立ち上げた。 流れで、テンプレートエンジンを利用してフロントエンドをNode.jsで実装する方法も学んだので、メモしておく。
Node.jsの勉強をしていたところ、HTTPリクエストをPOSTメソッドで投げたい場面が出てきたため、Postmanを利用することにした。手順のメモ。
PowerShellを管理者権限で実行できているか確認するコマンドメモ。
CodePipelineを利用してECS Fargateでブルーグリーンデプロイメントする。 まず、ビルド、デプロイについて単体で理解し、それらの設定をCodePipelineに組み込んでいった。かなり苦労したので、エラーの内容も合わせて紹介する。 順々にやっていったことで20…
Lambda関数を作成し、DynamoDBにアクセスする。 Lambda関数を呼び出すためにAPI Gatewayを利用する。
AWS上にDynamoDBを作成し、レコード（アイテム）を追加する。
SSHアクセスした先のファイル（今回はAWS EC2上に作成したファイル）をVSCodeで編集する方法のメモ。
以前の記事では、パブリックサブネット上に直接ECSサービスを作成し、タスクに割り当てられたIPアドレスに直接アクセスした。これだとタスクを起動するたびにIPアドレスが変わってしまうので、今回は、ALBを用意してコンテナへのルーティングを実施する。
APIで値を取得するHTTP クライアント`axios`をインストールしたところエラーとなった。解決した方法のメモ。
Dockerイメージをビルドする際、コピーしたくないフォルダがある時に、`.dockerignore`ファイルを作成してコピー対象から除外する方法を実践する。
ECSのコンテナにReactアプリを載せる方法のメモ。ECRを利用。
