TypeScript の Class
Jan 26, 2021TypeScriptClass とは、ある「もの」を表すのに必要なものをまとめたもの。Blueprint (設計図)のようなもの。 例えば「乗り物」だったら、機能としては走れる。それを Class…
Class とは、ある「もの」を表すのに必要なものをまとめたもの。Blueprint (設計図)のようなもの。 例えば「乗り物」だったら、機能としては走れる。それを Class…
Interface とは TypeScript の Interface とは新しい Type (型)を作ること。 上記変数を引数に受け取る関数を作る。 引数に Type Annotation をつけると長くなり、見づらい。 Interface…
ネスト構造のオブジェクトを分割代入する方法は、以下のようになる。
配列に Type Annotation (型注釈)をつける方法は以下のよう。 空の配列を代入するときに使う。 配列に値が入っている場合は Type Inference (型推論)できるので Type Annotation…
Object.assign() メソッドを使ってオブジェクトをコピーすると Shallow Copy になる。 Shallow Copy とはオブジェクト直下のプロパティのみコピーすることです。 obj1 のコピーを作成して obj2 に保存。 この段階で、 obj…
オブジェクトのメソッドに Type Annotation をつける方法は関数と同じ オブジェクトを分割代入で受け取ったときの Type Annotation…
関数に Type Annotation をつける方法は となる。 関数のときは、引数と返り値に Type Annotation をつける。 なぜなら 本当は return するつもりがミス。だけど返り値に type annotation…
変数の後に と型を記述する。 記述例 Type が決まると、以下のように変数が持っているメソッドが分かる。 Type が決まると以下のものはエラーであると分かる。 変数の Type が決まると値を代入するときにエラーであると分かる。
が返す値の Type は引数に渡す値の型によって変わる。 それぞれ返ってくる型が違うので Type Inference (型推論)できない。 JSON.parse() の返り値を保存する変数は any 型になる。
Type とは Value の特徴を示すもの。 Value とは変数に代入できるもの。 〇〇 Type だとこんなプロパティを持ってて、こんなメソッドを持ってますよ、というのが分かる。 Type を指定することによって間違った使い方を未然に防ごうというのが TypeScript…
API が開発途中などでまだ使えないとき、仮で使用できる便利なAPIサービスがある。 {JSON} Placeholder ページ中程に Resources がある。 使えそうなダミーデータがある。 取り急ぎ確認したいときに便利。
TypeScript をインストールしてコンパイルする方法。 上記コマンドを実行し、インストールする。 上記コマンドで TypeScript を JavaScript にコンパイルできる。 は TypeScript Compiler…
Kubernetes で Cluster 内の Pod を更新するとき以下の工程がある。 Docker image 作成 Docker image を Docker Hub に Push…
Mac で host ファイルは にある。 hosts ファイルを書き換えて特定のドメインで localhost にアクセスできるようにする。 記述例
Pod と Pod の間のやりとりは ClusterIP を介して行う。 Request を送るときのアドレスを ClusterIP の名前にする。 コマンドを実行して表示された Service の Name がアドレスになる。 event-bus の ClusterIP…
Kubernetes に出てくる Load Balancer Service と Ingress を簡単に説明。 Load Balancer Service Load Balancer Service は Kubernetes Object のひとつ。 Load Balancer…
記述例 apiVersion apiVersion は表示させたい Kubernetes Object のセットを指定する。 kind kind は apiVersion で指定した Kubernetes Object セットの中から使いたいタイプを指定する。 metadata…
Kubernetes Deployment オブジェクトを最新の Docker Image を反映させるには、以下のコマンドを実行する。 rollout…
Kubernetes Service には4つのタイプがある。 Cluster IP Node Port Load Balancer External Name Cluster IP Cluster IP は Cluster 内 にある Pod 間の通信を管理する。 Node…
記述例 apiVersion apiVersion は表示させたい Kubernetes Object のセットを指定する。 kind kind は apiVersion で指定した Kubernetes Object セットの中から使いたいタイプを指定する。 metadata…
Kubernetes に適用した Pod を削除するには以下のコマンドを実行する。
稼働中の Kubernetes Pod を表示させるには以下のコマンドを実行する。
Kubernetes では Pod を単体で使うことは少ない。 複数の Pod を管理するときは Deployment オブジェクトを使う。 記述例 apiVersion apiVersion は表示させたい Kubernetes Object のセットを指定する。 kind…
Kubernetes は複数の Container を一緒に実行するためのツール。 どの Container をどのように使うのかなどを設定する必要がある。 設定は yaml ファイルを使う。 この yaml…
よく使うコマンドは alias を設定しておくと便利。 alias とは別名という意味の単語。 zsh を使っている場合は .zshrc ファイルに以下の形で追加する。 記入例としては となる。 これで コマンドを実行すると、 が実行される。
やったこと JEST を Yarn でインストールしたよ! Getting Started のページを見ながら sum 関数を作ったよ! sum 関数のテストを書いたよ! やりたいことを考えて(例)数字を足してくれるものを作ろう ひとつ例を考える(例)1+2 =…
Kubernetes に出てくる用語の説明。 Kubernetes Cluster 複数の Node とそれらを管理するための Master からなる、ひとつのまとまり。 Node Container を実行するバーチャルマシーン。 参考ページ:Nodes Pod Docker…
JavaScript で配列に要素を追加する方法が2つある。 と である。 2つの違い push() を使った場合、元の配列 が変わってしまう。破壊的メソッドである。 返り値は新しくなった配列の個数。上記例だと は 4 になる。 concat…
Object の値を抽出して配列で返してくれるメソッドとして がある。 使いどころ ブログの記事を以下のようなオブジェクトで保存する。 上記のようなオブジェクトで保存してあると で配列に変換できる。 また、 で各 post にアクセスできる。 参考:Object…
手軽に API のテストを行える Postman の簡単な使い方をみてみる。 サイトからアプリをダウンロード。 アプリを起動して、画面の中央の上の方にある「+」を押す。 新規タブが開くのでエンドポイントを入力する。 今回は POST メソッドを試す。 URL…
Kernel とはプログラム(アプリなど)とコンピュータのハードウェア(CPUやハードディスクなど)とのやりとりを管理するもの。 プログラムが直接 CPU などに命令を送るのではなく、プログラムは Kernel に命令を送り、Kernel が受け取った命令を処理して CPU…
JavaScript…
if文の条件式などで使われる AND演算子 と OR演算子 。 条件式で使われる場合、AND演算子や「かつ」、OR演算子は「または」という意味で使われるっと説明されることが多いが、この解釈だと間違った認識になってしまう場合があるので注意が必要です。 AND演算子 AND…
手順 Twig プラグインをインストール で Twig のシンタックスハイライトが適用されるようにする Twig プラグインをインストール WebStorm を開いた状態で、Command…
Git のリモートにあるブランチを削除するには以下のようにする。 以下でもできる。
Git のローカルにあるブランチ名を変更するには以下のようにする。 今いるブランチの名前を変更するときは今のブランチ名を省略できる。 リモートのブランチ名を変更するときは「今のブランチ名」のブランチを削除する必要がある。
Type 定義が入っていないモジュールをインストールしたとき、Type の恩恵が受けられない。 Type を定義したファイルを探す必要がある。 NPM…
CSS で文章の改行を制御するときは以下の2つを設定すると良い。 overflow-wrap: break-word…
参考ページ:Basic usage-host based routing 記述例 apiVersion apiVersion は表示させたい Kubernetes Object のセットを指定する。 kind kind は apiVersion で指定した Kubernetes…
参考ページ:Annotations#Use Regex ingress-nginx で正規表現を使えるようにするには annotation に を追加する。 記述例 や のように正規表現が使えるようになる。
作成した Docker Image を Docker Hub にアップするには以下のコマンドを実行する。 例
タグを追加する 現在の状態にタグを追加したい場合は以下のコマンドを実行。 過去の状態にタグを追加したい場合は以下のコマンドを実行。 ハッシュは で確認する。 タグを一覧表示する 以下のコマンドを実行。 タグを GitHub…
Express.js で CORS エラーを解消するには を使う。 でパッケージをインストールし、以下のコードを追加。
Express.js を使用しているとランダムでIDを付与したいケースがある。 が便利。 参考:Node.js Documentation
ローカルで作成したファイル、例えば package.json などを container 内にコピーしたい場合、 Dockerfile に と記述する。 ただ、 ディレクトリはコピーしたくない。 そのときは Dockerfile と同じ階層に ファイルを作成し と記述する。
Docker Image を作るには Dockerfile が必要。 記載する内容 元となる Image ( OS のようなもの、以下のコマンドを実行するのに必要 ) 必要なプログラムなど( File System Snapshot ) 最初に実行するコマンド( Startup…
Docker Image は File System Snapshot と Startup Command からなる。 コマンドを実行すると、 File System Snapshot にあるプログラムを作成した Container 内の Hard drive…
container の説明で出てくる と の簡単なイメージ。 namespacing とは namespacing は処理ごとにリソースを分けるもの。 cgroups とは croups は Control Groups…
稼働中の container 内でコマンドを実行したいときは を実行するとプロンプトが表示されて実行可能になる。 -it とは は と の2つのフラグを付与すること。 は稼働中の container…
Docker の出力結果を後から確認したい場合、あるいは を実行する際に フラグを付けずに実行してしまった場合、 を実行すると、あとから出力結果を確認できる。
上記コマンドを実行すると今まで使用した Container の一覧が表示される。 すでに停止している Container を全て削除するには を実行する。 prune…
実行中の Container を一覧表示させるには を実行する。 こんな感じの表組みで表示される。 Container ID を知りたいときによく使うコマンド。 と実行すると過去に実行した全ての Container が表示される。
上記コマンドを実行したときに、裏ではどういったことを行っているのかを見ていく。 docker run コマンドを実行すると Docker Client が命令を受け取り、Docker Server に hello-world を実行するよう指示する Docker Server…
稼働中の Container を停止する方法は2つある。 と 2つのコマンドの違い は正常終了のイメージ。終了するために必要な手順を踏んでから container を停止させる。なので停止するまで1…
Docker image にある Container の初期コマンドを上書きするには Container を作るときに行う必要がある。 あるいは となる。
Docker とは Container を作成・実行に必要なプログラムが集まったもの。 Docker Ecosystem Docker Client Docker Server Docker Machine Docker Images Docker Hub Docker…
何個かコミットを行ったあと、ちょっと前のコミットにまとめたい内容ができたときの対応方法。 でログを確認。 1行目の のコミットと のコミットをまとめたいとする。 まとめたいコミットの古い方 の一つ前のコミット をコピーする。 と入力。 と表示される。 3行目の pick…
リモートにプッシュする前にローカルでコミットしたあと、そのコミットメッセージを修正したい場合は以下のコマンドでできる。 上記コマンドを入力して Enter…
GitHub の Issue を使って日報を書くようになったので、テンプレートを用意することにしました。 設定の手順 テンプレートを設定したいリポジトリにアクセス。 Settings をクリック。 Settings の画面に移動したら、スクロールして Features…
Jamstack に興味を持ったので公式サイトを眺めてみた
メニューアイコンの実装例として Apple のサイトを見てみます。
WordPressのテーマをカスタマイズするときなど Sass のコンパイルだけ行いたいときに、IntelliJ IDEA の Sass コンパイルを使うとお手軽なのでその設定方法を説明します。
環境構築が面倒なので PARCEL を使ってみました。
書き方を統一するため、CSS Properties の記述順も名前順に統一してみました。
IntelliJ IDEA で IdeaVim を使って Prettier の自動保存が効かずハマったので対処方法をメモしておきます。
Prettier の Option は全部で20個あります。Option をひとつずつ解説していきます。
パーミッション(権限)の表記を、権限の変更方法といっしょに説明します。
Git のバージョン管理を楽にするために Homebrew で Git をインストールしよう。
Vim でインサートモードから抜けるとき ESC キーだと手が小さいので届かずいつも悪戦苦闘します。なので手軽に抜けられるようにいつも jj を ESC の代わりに使えるようにしています。その設定方法です。
Terminal を使うときはコマンドを入力して実行します。 例えば と入力して実行すると実行したディレクトリにあるファイルとディレクトリの一覧を表示することができます。 この は ls というコマンドを実行しているということです。 では ls…
Terminal や iTerm2 でディレクトリを移動してそこから VS Code を起動したいときに便利なやり方です。
Netlify の Deploy が終わった通知を Slack に飛ばす方法
IntelliJ の vim モードで単語全体をシングルクォートで囲みたいときのショートカット
IntelliJ や VS Code の vim モードで単語全体をショートカットで選択したいときは viw と打てば良い。
Redux について自分なりにまとめてみました。2つの記事で説明していきます。この記事は Redux を React.js で実装する方法について説明しています。
Redux について自分なりにまとめてみました。2つの記事で説明していきます。この記事は Redux の概念について説明しています。