エンジニアを目指す日常ブログ

日々勉強したことのメモ。独学ですので間違っていたらコメント等で教えてください。

EC2サーバ(Linux)上でdockerコンテナを起動する方法メモ(nginxベース)

EC2サーバ(Linux)上にdocker環境を構築し、コンテナを立ち上げてwebサイトを表示する。

Node.jsのコマンド実行時にメモリが足りないエラーが発生

以下手順にしたがってgatsbyによるWebページ作成を試していたところ、想定外のエラーが発生した。結果的にVagrantのメモリを大きくすることで解決したので、対処法をメモ。

package.jsonとpackage-lock.json とは?(Node.js/React)

ReactアプリやNode.jsのExpressでアプリを作ると自動で作成される`package.json`ファイルの意味をメモ。

外付けHDDにデータバックアップを取る方法(Windows公式コマンドrobocopy利用)

ソースコードや各種ドキュメント、写真などをローカルPCから外付けハードディスクにバックアップする方法を記載します。

インストールしたNode.jsモジュールが実行できなかったときの対処メモ

Node.jsのモジュールgatsby-cliをインストールしたが、利用できない(`gatsby --help`などのコマンドを打つとエラーが出る)状態だったので、対処法をメモ。

Node.js インストール方法メモ

Node.jsのインストールを実施したので方法をメモ。

【React】関数コンポーネントの外に書いた処理はいつ実行されるのか

Reactでは、コンポーネントを関数で定義しているが、関数の外に書いた処理はいつ実行されているのかよくわからなかったので試してみた。

EC2へのSSHアクセス時にポートフォワーディングを設定する方法メモ

EC2にSSH接続する際、ポートフォワーディングの設定をしたい。 本記事はこちらへ移行しました。 bunsugi.com

ソースコードをAWS CodeCommitで管理する方法メモ

ローカルで開発したソースコードをAWS CodeCommitで管理する。

React×Typescriptでページ遷移時に値を渡す方法

React×Typescriptでルーティングする際、前画面の値を次の画面に渡す方法を記載する。 ①URLパラメータを使う(パスパラメータ、 クエリパラメータ)② ``コンポーネントにstateを渡す③`useHistory()`を使う

Vagrant環境とのファイル共有がうまくいかないときにやったことメモ

Vagrant環境と、ローカル環境ではフォルダを共有することができる。 Vagrantfileに設定を入れてもうまくいかなかったが、`vagrant-vbguest`をアンインストールすることで解決した。

ssh接続コマンドを簡単に書く方法

ssh接続は一般的に sshコマンドで実施するが、事前にファイルに設定を記入しておくことで、簡単にSSH接続することができる。

ゲストOS(Vagrant)とホストOS(Windows)間でscpによりデータをやり取りするコマンドメモ

違うサーバどうしでファイルをやり取りするのは`scp`コマンドが一般的である。 ここでは、scpの基本コマンドの解説に加え、Vagrant仮想環境とローカルのファイルのやり取りを実例としてメモする。

Ubuntu + Vagrant + VirtualBox環境でディスク容量を拡張した

VirtualBoxで突然ディスク容量不足により、何もできなくなったので、ディスク容量を拡張した。

VirtualBoxの容量不足エラーが出たときにやったことメモ

VirtualBoxで突然ディスク容量不足により、何もできなくなったので、対処した。内容をメモ。

【Gatsby】マークダウンファイルから記事ページを生成する

はじめに 前回、マークダウンのファイル情報をデータレイヤに取り込み、ブログ上に表示することができた。 今回はブログ記事ページを動的に作成する。 方法としては、 テンプレートコンポーネントを作成する方法({mdx.slug.js})(Gatsby公式チュートリアル…

GraphQLの引数を変数で設定する方法のメモ

GraphQLのリクエストに引数を入れる際、引数を固定値ではなく変数で設定するやり方をメモ。

【Gatsby】マークダウンファイルの情報を取得してブログ上に表示する

開発環境にマークダウン形式の記事を保存し、Gatsbyで取得する方法を確認する。 今回は取得したファイルの中身(マークダウン形式)を取得して、解析して最終的にHTMLに変換して表示する方法を確認する。

【Gatsby】プロジェクト内に保管したファイルの情報をGraphQLで取得する

Gatsbyでブログを書くためには、1ページずつHTMLを書くわけにもいかないので、記事を書いたデータベースからデータを取得してコンポーネントに組み込む必要がある。 開発環境にマークダウン形式の記事を保存し、Gatsbyで取得する方法を確認する。

GatsbyのデータレイヤーからgraphQLでデータを取得する

Gatsbyでブログを書くためには、1ページずつHTMLを書くわけにもいかないので、記事を書いたデータベースからデータを取得してコンポーネントに組み込む必要がある。 Gatsbyではデータの取得にGraphQLを利用する。 GraphQLでのデータ取得方法の基礎的なやり方…

GraphQLって何?

GraphQLとは、Facebookが開発した、REST-APIに変わるAPIの方式。 ざっくりと「GraphQLって何?」が一言でわかるように、簡潔にまとめる。

Gatsbyブログでのプラグイン利用方法/画像の挿入方法

Gatsbyにプラグインを導入する方法をメモする。 絶対に必要になる、画像挿入のためのプラグイン`gatsby-plugin-image`を導入してみる。

ビジネスのお勉強メモ

用語のメモ。PBR(Price Book-value Ratio)、非財務資本、有形資産と無形資産、ESG、のれんなど。

Gatsbyブログでデザインを変更する(CSS適用方法)

自分のブログに変更していくために、今回はCSSの適用方法を理解する。

Gatsbyブログに好きなページを追加する

Gatsbyブログ作成のやり方を学んでいく。ページの追加とルーティングを実施する。ここではマークダウンによる記事入稿ではなく、単純にReactでページを作成する。

gatsby developで出たエラーの対処法

`gatsby develop`コマンドを実行時に発生したエラーの対処方法。

GatsbyブログをGatsby Cloudで公開してみた

ローカルで作成したGatsbyプロジェクトを、ホスティングサービス(Gatsby Cloud)を利用し公開してみる。

Vagrant上でGatsbyブログを編集・ビルド・デプロイしてみた

Gatsbyでブログを作る。スターターキットそのままのブログに少し編集を加えてみる。また、本番環境で使うコマンド「ビルド」と「サーブ」を試してみる。

Vagrant上でGatsbyブログのひな型を作成した

Gatsbyでブログを作成してみたい。まずはスターターキットを利用して、型だけ作ってみる。

【React+Node.js/socket.io】チャットアプリに入室機能とユーザ名表示機能を追加する

ReactとNode.js Expressを使って、チャットアプリの超基礎となる部分を作成した。今回は、機能を追加し、さらにチャットアプリに近づける。