azukiazusa.dev

#JavaScript

Firebase③ Cloud Storage

Firebase3週目の記事です。 今回は、主に画像などのデータを保存するストレージ機能を提供するCloud Storageを取り扱います。 Vue.jsを利用したブログにサムネイル画像を設定する機能をもとに説明していきます。

JSONオブジェクトのあれこれ

`JSON`オブジェクトはJavaScriptにおいて、JSONをパースしたり値をJSONに変換するためにもっぱら使われます。 普段使っている`JSON.stringify()`や`JSON.parse()`にはオプショナルな引数を渡すことによってその振る舞いを変更することができます。

Array.prototype.with() とは

`Array.prototype.with()` は、非破壊的に配列の要素を置き換えるためのメソッドです。非破壊的とは、元の配列を変更せずに新しい配列を返すということです。`arr` に対して `with()` を実行しても、`arr` は変更されず、新しい配列のコピーが返されます。

イマドキのJavaScriptの書き方

JavaScriptはES2015以降から言語自体が大きく変化しました。 ES2015以降も、毎年JavaScriptはアップデートが行われており、最新の使用はES2020となっています。 このように、JavaScriptという言語は日々進化を遂げています。ES2015より前の書き方の多くが非推奨となっており、過去のWebや本の情報は現在ではあまり役に立たなくなっています。 そんなJavaScriptのイマドキの書き方を見ていきましょう。

Firebase④ Cloud FireStore

Cloud FireStore(以下FireStore)とは、FireBaseの提供するドキュメント指向型 のNoSQLデータベースです。 NoSQLとしての特徴としてのスキーマレス、スケーラブルといった特徴のほかにリアルタイムアップデート、セキュリティルール、オフラインサポートといった独自の特徴を備えており、特にバックエンドを介さずにクライントサイドから直接操作できるという点が大きなポイントです。 また、β版から正式リリースされたのが2019年2月ということもあり、比較的新しい技術です。

ユーザーにヒントを表示するための `popover=hint` 属性

ポップオーバー API は 2024 年の Baseline に組み込まれており、主要なブラウザでサポートされています。Chrome Beta 133 では 3 番目の値として `hint` が追加されました。`popover=hint` はユーザーに対してヒントを表示する「ツールチップ」として動作します。この記事では `popover=hint` 属性について詳しく見ていきます。