これは何 使い方 メモ webpack で 複数 HTML ページ コミット時に Lint チェックしたい Babel + TypeScript の設定 browserslist ESLint + prettier の設定 stylelint の設定 Jest の設定 CSS 読み込み ビルド時のファイル名をどうするか パスの解決 環境変…

8月に調べたことのメモです。 Vue 関連 基礎 ちょっと応用 Angular 関連 JavaScript その他 その他 Vue 関連 基礎 Vue.js 学習メモ - ryotah’s blog Vuex 学習メモ - ryotah’s blog Nuxt.js 学習メモ - ryotah’s blog How to redirect with vue-router? · Is…

6月に調べたことのメモです。 Angular 関連 ngrx 関連 ngrx 実装メモ 結果 Actions Reducers Effects Container CSS 関連 Angular 関連 (WIP) Angular Testing メモ - ryotah’s blog Angular のドキュメント + テストに関する前提知識（用語、Jasmine使い方…

2月に調べたことのメモです。 リサイザー Show More/Less コンポーネント ドラッグアンドドロップ（dnd） Googleスプレッドシート的なスクロール AngularのDIに関して Ruby, Rails関連 VS CodeでRubyを書く その他 リサイザー angular-resizer - StackBlitz …

11月に調べたことのメモです。 ngrx関連 各Feature Module（Page Module）のステートを、画面遷移時にリセットする Angular関連 Component/Directive関連 アプリケーションに依存するデータを表示するコンポーネントのインターフェース（@Input）について Fo…

こんな感じでコンテンツを左右(上下)に配置する時に便利。 以下のような問題（仕様）があるので、Flexboxを入れ子にした場合かつ、上下揃えをした場合は注意が必要。 css - Chrome / Safari not filling 100% height of flex parent - Stack Overflow キャプ…

ブロック要素内のaタグを、要素いっぱいに広げる text-indent: -999px; などでテキストを非表示にする必要がある シンプルにaタグでブロック要素を包む ブロック要素内のテキストがリンクテキストと同じスタイルにならないように調整する（必要ならば） a { …

ブラウザが限られている(Safari, Chrome) そのうち使えなくなるかもしれない heightで制限しているので、対象ブラウザ以外でもレイアウトが崩れることはない、はず .note { font-size: 16px; line-height: 1.25; width: 100px; border: 1px solid #000; over…

例えば#ff0000をrgb(255,0,0)に変換したい場合。 カラーコード（文字列）を2文字ずつに分ける 16進法を10進法に変換する import compose from 'lodash/fp/compose'; import map from 'lodash/fp/map'; function hexToRgb(hex: string): string { return comp…

css - Resize to fit image in div, and center horizontally and vertically - Stack Overflow transformとposition: absoluteを利用します。 前の記事のアスペクト比を保つcssを利用するとこんな感じです。 object-fitというプロパティを利用すればもっと…

「padding-topに%を設定すると、包括しているブロックの幅を基準にする」という仕様を利用します。 padding-top - CSS | MDN 以下のコードは、アスペクト比を4:3にする場合。 .a43 { border: 1px solid #000; width: 160px; position: relative; } .a43:befo…

重なり順の制御をしているときに、スタック文脈というものを理解していなかったことに気づきました。 以下の記事がわかりやすかったです。MDNにはいつもお世話になります。ありがたい。 CSS の z-index の理解 - CSS | MDN z-index なしのスタック : デフォ…