端までスクロールした時の振る舞いを、CSSで指定できる、というものです。仕様：CSS Overscroll Behavior Module Level 1 対応状況：Can I use... Support tables for HTML5, CSS3, etc MDNが分かりやすいです： overscroll-behavior - CSS: カスケーディン…

こういうものを作りたい： 画面にぴったり収まってほしい（background-sizeのcontainみたいな） 画面が横長なら縦の余白がゼロ、縦長なら横の余白がゼロ 画面リサイズに応じてこちらもサイズが変わる 作ったもの： See the Pen Square grid by Yu Watanabe (…

いつもカラムが消せない！って調べることになるのでメモ。FOREIGN KEYが設定されたカラムを削除しようとするとエラーが出る。 ERROR 1217 (23000): Cannot delete or update a parent row: a foreign key constraint failsまずFOREIGN KEY を削除する必要が…

GitHubに、Code Climateのテストカバレッジのバッジを貼り付けていたのですが、気付いたら「？」になっていました。この部分： （「？」の状態をスクショし忘れてしまったけど、左のMaintenabilityは表示されてて、テストカバレッジだけ「？」に）CircleCIで…

HTMLにはprogress要素があり、HTMLのみでブラウザ上にプログレスバーを表示することができます。2020年7月時点では、どのブラウザでも問題なく利用できそうです。 ブラウザ対応状況：https://caniuse.com/#feat=progress WHATWG仕様（Living Standard）： ht…

チェックボックスを使ってます。 JavaScriptを使ったほうが表現力は高いですが、他にJS使う予定もないしとりあえず隠せればいいか…みたいなページでたまにやるやつです。 See the Pen Toggle content by CSS by Yu Watanabe (@yuw27b) on CodePen. 補足みた…

MySQLは、バージョン5.7からJSON型がサポートされています。 MySQL :: MySQL 5.7 Reference Manual :: 11.5 The JSON Data Type5.7のリリースは2015年なのでだいぶ前ですが、今さらながら使ってみました。 こういう入力フォームがあって： しかも増やせる： …

汎用コンポーネントも存在しますが、自作のミニマル実装コードです。ひとまずコード（スタイルなどは簡略化しています） import React from 'react'; import PropTypes from 'prop-types'; class ModalWindow extends React.Component { constructor(props) …

HTMLのvideoタグで動画を表示すると、Chromeで右下のメニューをクリックすると「ダウンロード」という項目があります。（他のブラウザでは確認できませんでした。） これは、controlslist属性に"nodownload"というパラメータを指定すると非表示になります。c…

HTTPSで通信していても、GETのクエリパラメータは暗号化されないので、見られたくないものを送信するときは、POSTで送るか、HTTPのリクエストヘッダーに入れるようにしています。クエリパラメータはURLの一部なので、https://example.com?page=1みたいな平文…

突然PHPのsession_id()が空白を返すようになってしまった もちろん本当に「突然」なのではなく、何かいじってしまったからですが。 PHPのセッション情報は、デフォルトではファイルに保存される ので、そのファイルの読み書きができなければセッションIDも発…

letter-spacingとテキストの中央揃えを併用すると、左右の空白がずれて見えるのでpaddingで調整することがよくある。例えばこんな見た目のボタンを作るのに、 padding: 5px; font-size: 16px; letter-spacing: 1em; text-align: center; /*〜略〜*/ とする。…

1日1回スクレイピングしてきてSlackに流してほしい、みたいな簡単なやつなので、Firebaseまではいらない。Cloud FunctionでランタイムにNode.jsを選択→package.jsonとindex.jsを登録しておき、Cloud Scheduler->Pub/Sub経由で呼び出せばOK。 プチハマりどこ…