すべての記事

ReactでTodoアプリを作る #4 編集機能
読了 9分

ReactでTodoアプリを作る #4 編集機能

項目をダブルクリックするとインライン編集モードに入り、Enterで保存 / Escapeでキャンセルする編集機能を作りながらuseRefも初めて使ってみます。

ReactでTodoアプリを作る #3 フィルタリング
読了 6分

ReactでTodoアプリを作る #3 フィルタリング

全部 / 未完了 / 完了フィルタを追加し、完了項目の一括削除のような一括処理機能まで作ってみます。

ReactでTodoアプリを作る #2 完了トグルと統計
読了 6分

ReactでTodoアプリを作る #2 完了トグルと統計

各項目にチェックボックスをつけて完了をトグルし、視覚的に区別し、残り/全件数を表示する統計を追加します。

ハードウェア基礎 #9 クラウドインスタンスのスペックの読み方 — ワークロードに合わせて選ぶ
読了 6分

ハードウェア基礎 #9 クラウドインスタンスのスペックの読み方 — ワークロードに合わせて選ぶ

c5.xlarge のようなインスタンス名をファミリー・世代・サイズに分解し、vCPU・メモリ・ストレージ・ネットワークでスペック表を読んで、ワークロードに合った種類を選ぶ順序を整理します。シリーズが積んだ 4 つのリソースの知識を一か所に集めます。

クラウドとは結局のところ他人のコンピュータを借りること
読了 7分

クラウドとは結局のところ他人のコンピュータを借りること

クラウドを専門外の人にもわかる目線で定義し、なぜサーバーを買わずに借りるのか、AWS のようなサービスにどうつながるのかまで噛み砕いて説明します。

ReactでTodoアプリを作る #1 開始と追加/削除
読了 7分

ReactでTodoアプリを作る #1 開始と追加/削除

基礎講座で学んだReactで本物のTodoアプリを作ってみます。最初の記事は要件定義、コンポーネント設計、そして追加/削除機能までを作ってみます。

ハードウェア基礎 #8 クラウド — 所有から賃借へ、オンプレミスから IaaS / PaaS / SaaS まで
読了 6分

ハードウェア基礎 #8 クラウド — 所有から賃借へ、オンプレミスから IaaS / PaaS / SaaS まで

ハードウェアを所有から賃借へ変えた変化、オンプレミスとコロケーションとクラウドの違い、そして IaaS・PaaS・SaaS がハードウェアをどこまで隠すかまで。クラウドをハードウェアの所有と賃借の観点から整理します。

React基礎講座 #15 ルーティング概要 (React Router)
読了 11分

React基礎講座 #15 ルーティング概要 (React Router)

SPAのルーティング概念とReact Routerの基本的な使い方、動的経路/ナビゲーション/ネストルートまでを一度に見ていきます。

ハードウェア基礎 #7 仮想化とコンテナ — 物理サーバー 1 台が複数台になる仕組み
読了 6分

ハードウェア基礎 #7 仮想化とコンテナ — 物理サーバー 1 台が複数台になる仕組み

ハイパーバイザーがハードウェアを分ける方式、仮想マシンとコンテナがリソースを共有する仕組みの違い、そしてクラウドの性能がばらつく原因であるオーバーコミットまで。1 台の物理サーバーが複数台になる仕組みを整理します。

React基礎講座 #14 パフォーマンス最適化 (memo / useMemo / useCallback)
読了 9分

React基礎講座 #14 パフォーマンス最適化 (memo / useMemo / useCallback)

React.memo、useMemo、useCallbackを使ったパフォーマンス最適化の方法と、これらのツールをいつ使うべきで、いつ使うべきでないかを整理します。

ハードウェア基礎 #6 ネットワーク — 帯域幅とレイテンシ、NIC からデータセンターまで
読了 6分

ハードウェア基礎 #6 ネットワーク — 帯域幅とレイテンシ、NIC からデータセンターまで

運用でもっともよく混同される帯域幅とレイテンシの違い、距離が作るレイテンシの限界、NIC から始めて同じ AZ とリージョン間とインターネットがなぜ違うのかまで。ネットワークを速さの一言ではなく 2 つの軸に分けて理解できるよう整理します。

React基礎講座 #13 カスタムフック
読了 8分

React基礎講座 #13 カスタムフック

コンポーネント間でロジックをエレガントに共有するツール、カスタムフックの作り方とよく使われる例を見ていきます。