青いやつの進捗日記。

メモとしてべんきょうのしんちょくをかいていきます。あとで自分が検索しやすいもん

VisualViewport.height がiOS15でおかしかった件、iOS15.1でだいたいは解消されたけどまだちょっとだめっぽい?

(2020/11/24現在知っている情報。もしかしたらもう治っているのかも) developer.mozilla.org zenn.dev iPhoneやAndroidでキーボードが表示されたとき、「画面の見えている部分の高さ」はwindow.heightでは取得できないvisualViewport.heightなら取得できる…

iOS Safariでキーボードを開いている際にposition: fixedの挙動がおかしい?

ちょっと明確なソースがあるわけではないので確証はない。 iOS Safariでキーボード(Virtual Keyboard)を開いている際にposition: fixedの挙動がおかしいっぽい。 iOS Safari Virtual Keyboardを開いている position: fixed; bottom: 0; の際に、 スクロール…

iOS Safari でCSSのcalcの中でvw,vhが使えない

www.seleqt.net なんかそういえばそういうのあったな…気づかなかった…しょうがないのでJSでwindow.innerWidthとか入れてそれでstyled-componentsで計算させた。 Safari で vw, vh などを calc() と一緒に使うとレスポンシブじゃなくなるバグまだ直ってないで…

【メモ】Reactでユーザーから見えていないコンポーネントへのパフォーマンス改善

場面としてはドロワーとか? ユーザから見えていないコンポーネントの描画を発生させなくさせてパフォーマンスを改善するライブラリ react-freeze。ドロワーとか多段する時とかが主なユースケースみたい、良さそう❄️https://t.co/S4JFBUIxCw— フロントエンド…

IE無視できるなら CSS 比較関数 はかなり使える… clamp() で最小と最大を設定

CSS

coliss.com developer.mozilla.org めちゃ便利。例えばwidthとかならmin-widthとかmax-widthがあるのですが、最小と最大が設定できたのってむしろ今までそれくらいで、大半は出来なかった。JSで無理やりどうにかするしかなかったと思う。(例えばleftとか) …

JavaScript String と toString ってなんか挙動違うの? → Stringはなんでも文字列にしてしまう

kk-web.link もうまんまこれが答えだった。 undefinedも文字列として"undefined"してしまうと。なんかasに近い。 なんか近いなと思ったのが、 developer.hatenastaff.com document.querySelector('.title') as HTMLElement; document.querySelector<HTMLElement>('.title'</htmlelement>…

JavaScriptの標準の機能で0埋めできるの今更知った padStart

最初、 qiita.com こんな感じで無理やりやるしかないと思っていた。どうやら上記のQiitaが書かれた段階では仕様提案中だったみたいだが、いまならどう考えても.padStartのほうが良い。 developer.mozilla.org 2桁の数字で0埋めしたかったら .padStart(2, '0')…

styled-componentsですごい頻度でpropsを更新し続けていたらattrsメソッドを使えと怒られた

react_devtools_backend.js:2842 Over 200 classes were generated for component Seekbar__Preview with the id of "Seekbar__Preview-sc-16onun1-1". Consider using the attrs method, together with a style object for frequently changed styles. Exam…

iOS Safari, Android Chrome 実機デバッグ

www.yoheim.net qiita.com applech2.com iOS15でSafariに拡張機能を入れられるようになり、Webインスペクターを使える拡張機能もあるらしい。使えそう

ブラウザの向きとか、向き固定とかまわりを調べた(主にスマホ) Fullscreen APIとかScreen Orientation APIとか

スマホを画面の向きを縦向きにロックしている状態でブラウザは横向きに回転したりとか出来るのかを調べていた。 CSSのメディアクエリのorientation(画面の縦横比で判断)以外の方法を探す。(ロックしていると問答無用でportrait判定なので) まず、ブラウ…

【メモ】Next.jsの参考リンク

qiita.com

【メモ】AWS Amplify・AppSync・GraphQLまわりの参考リンク

qiita.com medium.com

TypeScriptでReturnをそのままtypeとして使うReturnTypeってのがある

tech-1natsu.hatenablog.com 上記の記事でいける。初めて知りました

Git: remote: Support for password authentication was removed on August 13, 2021. Please use a personal access token instead.

そういえばそうでした。メール来てたねずっと。 で、httpsでcloneしてtoken貼ればいいのはわかるのだが、問題なのが既にclone済みのもの、どうすればいいのかと。再度cloneし直すの面倒じゃん。 でもVSCodeでコマンドパレットでset personal access tokenと…

Gitで大文字と小文字の変更を検知する

Git

qiita.com こういうのがあったのか〜〜〜最近地味にこれにやられた経験あったので…