Frontend Monthly #1 CSS Painting Order 基本的にStacking Contextを形成しているものは一塊で扱われるので、その間にContextの外にいるものが挟まることはない。一方で、CSSは…奥深いので全くできないわけではない。今回はpreserve-3dとtransformで再現さ…

WIC Speed Hackathon Online webpack-mergeをinstallするとdev用とprod用などでconfigを分けられる とりあえずmoment -> dayjs jqueryを置き換えたいけど、bodyにどうこうしたい時React的には何が正しいお作法なんだろうか FB.XFBML: parse()を呼んでその場…

SVGのcircleやecllispseをpathにconvertできるツール : 円に沿ってTextPathを配置したいときに便利

Testing JavaScript Static Analysis Testingってなんのこといってるのかと思ったらESLintの話だった。なるほど ignoreファイルとして任意のファイル (gitignore)とかを指定できる

モバイルだと、アドレスバーの高さの分100vhを設定しても高さがずれてしまうため画面ぴったりにしたい時はカスタムのCSS変数を設定する方が良い。window.innerHeightあたりをJSでとって100で割ったものを指定してあげる。

GPT-3の衝撃 今更トレンドにキャッチアップしようと思って少し調べてみたらいきなり文からReact生成してて目を疑う。 悪用を懸念してAPIのみが公開されているらしい これ、サービスのサポートとかに入れたらかなり便利になるんじゃないだろうか GPT-3 Expect…

Testing JavaScript 関数のmockの話。一番単純にやるなら、まず自前で特定のメソッドを上書きすることができる。（Monkey Patching) それだと、mockが代わりに実行されるので中身に依存しないテストがしたい場合はまず目標が達成される。でも、同時にそのmoc…

zelda-botw-starter setStateで作った変数をcontext.Providerのvalueで指定して他の場所で使う。valueと言うのは何も文字通りvalueだけじゃなくてもいいので、setStateで生成した更新用の関数も合わせてObjectで渡すとバケツリレーを回避できる。取り出すと…

zelda-botw-starter 初Tailwind。チートシートあっても結構覚束ない。慣れたら便利そうだけど、慣れるまでに結構時間がかかるんじゃないのかな、そうでもないのかな。クラス名が多くなってしまった時に見にくくならないかがきになるけど、そのレベルまでいっ…

Async Clipboard APIはChromeのBackgroundScriptでは動かないので拡張開発には使えない

簡易的なHTTPサーバーを実装しようと思ったら、 - ソケット通信の確立 - ひたすら接続待機 - 入ってきたら仕様にしたがってヘッダーの解釈 - リクエストラインはスペース区切りなので正規表現で解釈 - 同じように仕様にしたがってリクエストを返却 とか大体…

Wev.dev LIVE: Implementing Structure data with JavaScript Google検索した時に一覧ページでも商品の詳細情報とかが綺麗に表示されていることがあるけど、あれを出すために何をしているかと言う話。RichResultだかRichContentだか言ってた。基本的にはJSON…

Web.dev Wrap up 最適なビルドツールを教えてくれるツールができたらしい。思ったらいつもAngularかReactだからビルドツールで悩んだことないな Spectreと言う脆弱性がある。これは、あるタブで悪意のあるスクリプトが走っているとたとえオリジンが違っても…

Testing JavaScript どのテストでエラーが投げられたのかわからないと役に立たないし、エラーが投げられた段階でテストの実行が終わっちゃっても役に立たない。 テスト関数をcallbackとして受け取ってtry catchの中で走らせることでこの問題を解決する。 Asy…

Testing JavaScript expect().toBe()は function expect(){ return { toBe(){ }, toEqual(){ } } } みたいになってるんだなあ、なるほど TikTokやSnapchatが覆す、アプリデザインの「常識」 TikTokやSnapchatなども若者向けモバイルファーストアプリは従来の…

Devtool ExperimentalのCSS Overviewが楽しい。テーマカラーがちゃんと設定されているサイトとそうでないサイトで結構差が出そう。参考

MXレコードはAレコードがある前提で設定されるもの