発行
ブラウザにデータを保存する仕組みであるWeb Storageを利用すると、オフライン状態でのデータの保持や前回アクセス時の画面状態の再現など、ユーザーのひと手間を省くUIを実装できます。その仕様と、その使用例を見てみましょう。
Cloudflare Workersのランタイムで利用できるAPIのうち、基本となるfetchイベントとHTTPリクエストのハンドリングについて解説します。
親コンポーネントが管理するコンテンツを、子コンポーネントの特定の場所へ差し込めるスロットについて解説します。これまでのデータの受け渡しだけでは処理しきれないケースを例に、活用場面を考えてみましょう。
発行
details要素やsummary要素の色を変えたり、アイコンをカスタマイズしてみます。また、実際にdetails要素が使われている例を見て、どのような場合に利用できるか、考えてみましょう。
コストを支払ってでもライブラリを導入する必要があるのかということは、いろいろな要素を踏まえて検討する必要があるでしょう。今回は、そんなときの検討材料の一つとなる「You Don't Need」というプロジェクトを紹介します。
今回は、実際にWorkerをデプロイするまでの一連の流れと、ローカル環境での開発に便利なツール、ビルド方法について紹介します。
発行
Cloudflare社が提供するサーバーレスの実行環境、Cloudflare Workersについて解説していきます。従来のFaaSにもある特徴に加え、Cloudflare Workersならではの特徴を見てみましょう。
ルビ周りのCSSにおいて、制作者がコントロールできる機能を紹介します。ルビ文字列の配置指定や割付、結合などがあります。
provideとinjectを利用したデータ連携について解説します。適切にデータの制御を行わないと、不要な依存関係を生み出してしまうので、注意が必要です。
発行
details要素は、開閉状態を持ち「開く」状態になったときにのみ、その中身の情報が表示される要素です。「詳細折りたたみ要素」と呼ばれたりもします。まずはdetails要素そのものについての理解を深めましょう。
一通り動くようになったコードを、コードを読む側の意識を考えながら、わかりやすく読めるように書き換えていきます。どうしてそう書き直すほうがいいのか、そのポイントを理解することが大切です。
第2回で作成したDropdown Menuにアニメーションをつけていきます。Headless UIはアニメーションの部分だけがTransitionコンポーネントとして分離されているので、Menuコンポーネント自体は、シンプルな設計を維持することができます。