開発 メモアプリ開発③ ドラッグ&ドロップ【dnd kit】
メモアプリ「Simpl」の開発手順をまとめるシリーズ第3弾はメモのドラッグ&ドロップ機能です。 dnd kitライブラリを使用してメモの表示順を変更できるようにします。 これまでの学習内容や開発記録については以下の記事にまとめています。 【...
開発 
ガジェット M2からM2Proへ買い替え！重要な2つの考え方
この度、1年間愛用してきたM2 MacBook Airから型落ちのM2Pro MacBook Proに買い換えました。 今回の買い替えを例に紹介しながら、 MacBookの買い替え候補の選び方 買い替え候補の比較基準 について解説します。 ...
ガジェット 【図解】イラストを描く上でのiPad AirとiPadの違い
今回は以下の記事をさらに深掘りしてiPad AirとiPadの違いを解説します。 「これさえ抑えれば80点」な大事なポイントに絞って解説しています。 iPad AirとiPadは兄弟 アプリを起動するときに感じる処理性能においてiPad A...
開発 メモアプリ開発② メモ機能
メモアプリ「Simpl」の開発手順をまとめるシリーズ第2弾はメモ機能です。 ユーザーと紐づけたメモを扱います。 これまでの学習内容については以下の記事にまとめています。 はじめに 今回追加する機能は以下のとおりです。 メモの取得 メモの作成...
開発 メモアプリ開発① アカウント機能
メモアプリ「Simpl」の開発手順をまとめるシリーズ第1弾はアカウント機能です。 （膨大な量になってしまったので目次利用を推奨します。） これまでの学習内容については以下の記事にまとめています。 はじめに 今回追加する機能は以下のとおりです...
ガジェット 初心者が買うべきMacBook Airの選び方
MacBookを選ぶとき、専門用語に戸惑うことがありますよね。CPU性能やリフレッシュレートなど... 先日「初心者向けの初Macはどれが良い？」と相談を受けました。結論、M1モデルのMacBook Airをおすすめしたので、その時の考えを...
開発 【React】Context APIの使い方
作成してきたメモアプリにグローバル状態管理を導入します。 これまでの学習内容については以下の記事にまとめています。 グローバルな状態管理の利点 それぞれのコンポーネントは状態という「データ」を持つことができます。しかし、コンポーネントが複雑...
開発 【Jest/React Testing Library】Reactテスト入門【コンポーネントの振る舞い編】
初めてReactのテストフレームワークを触るので簡単なテストを行った内容をまとめます。 これまでの学習内容については以下の記事にまとめています。 テストについて フロントエンドのテストは、アプリケーションの異なる観点で品質を確保するために以...
開発 【JavaScript】非同期処理を簡単な例を使って理解する
「こう書けば動く」という状態でJavaScript/TypeScriptの非同期処理を実装してきました。 今回は「よく分からず使っている」を「なんとなく分かる」にするため、できるだけ簡単な例を作成して基本を整理します。 本記事で掲載している...
開発 【React/TypeScript】コンポーネント指向【ステップ解説】
前回まで最低限のアプリケーションをAWSにデプロイする内容で更新してきましたが、今回はフロントエンドのトピックです。 今回は、実際のプログラムを使ってコンポーネントの整理を行ってみたいと思います。 手順はReact公式「React の流儀」...