JavaScript

reactのデザインをmaterial-ui + styled components (CSS in JS)を組み合わせて利用する

react のデザインで styled components (CSS in JS)で行う場合、「全てのスタイルを1から作成するのは嫌だ」というときに、material-uiと組み合わせて利用することで省エネでデザインすることができます。 ...
Windows

Windows 10 Home(WSL2)にUbuntu(18.04 | 20.04)をインストールする手順まとめ

Windows 10 Home上のWSL2でUbuntu(18.04 | 20.04)をインストールする手順についてまとめました。Windows 10 HomeにWSL2を設定するUbuntu18.04をインストールする前に、WSL2を利用...
Git

.gitignoreに追加したファイルが反映されない場合の対処方法 ~ git rm -r –cached ~

.gitignoreの内容が反映されないgitの管理対象に含めたくないファイルやディレクトリは .gitignore ファイルに記述することで対象外とすることができるのですが、.gitignoreファイルに追加したのに、git status...
Windows

【完全版】Windows開発環境の構築手順(WSL2 + Docker + VSCode)

Windows開発環境の構成 Windows で大丈夫?プログラミング開発環境としてはWindowsよりもMacの方が人気が高いです。人気の理由は、本番環境はLinuxであることが多く、MacがUnixベースであるため開発環境と本番環境が近...
Git

git commitメッセージを間違った時の修正方法

gitコマンドで コミット時にコミットメッセージだけを間違えることがよくあります。コミットメッセージだけを修正したい場合には、以下のコマンドで簡単に修正できます。git pushする前に実行しましょう。git commit --amend ...
Git

GitHubのプルリクエスト(Pull Request)でコンフリクト(Conflict)が発生した場合の解決方法 ~merge編~

GitHubでプルリクエスト(Pull Request)を発行したがコンフリクト(conflict)が発生した場合に、コンフリクトを解消するまで「Merge Pull Request」ボタンが非活性でマージが出来ません。GitHubのPul...
Git

GitHub CLI (gh)のインストール方法とコマンド(repo/pr)の使い方

GitHub公式のGitHub CLIツールghのインストール方法とコマンドの使い方をまとめました。GitHub CLIを利用するとリポジトリの作成やプルリクエストを発行をブラウザではなくターミナルから実行できます。シェルなどにも組み込むこ...
Windows

WSL2のUbuntuやCentOSをシャットダウンや再起動する方法

WSL2上で実行しているUbuntuの設定を変更し再起動が必要な場合に、PCの再起動を行うことは面倒です。そこで、WSL2のUbuntuやCentOSのみをシャットダウンや再起動する方法をまとめました。WSL2をシャットダウンする方法Pow...
JavaScript

Express(Node.js)でTypeScriptを利用した開発環境構築 ~REST APIのひな形を作成する~

フロント側ではReact、Vue、Angularなどは静的型付け言語であるTypeScriptでコーディングされることが一般的になってきました。今回は、Node.jsのフレームワークであるExpressについてもJavaScriptではなく...
CICD

GitHub ActionsでCI/CD環境を構築する ~ReactアプリをFirebaseへデプロイするyamlファイルの書き方~

CI/CD環境はこれまでCircleCIを利用してきたのですが、Reactのversion17でcreate-react-appしたプロジェクトをCircleCIでbuildすると以下のエラーが発生するようになりました。The build ...