@lifehacker

スポンサーリンク
CSS

CSS Tips | 超実務コアCSSテクニック:ボックスモデル - overflow制御

overflow の仕組みを理解すると「はみ出し」「スクロール」「切り抜き」が自在に扱えるoverflow は 「要素の中身が、要素のサイズを超えたときどう扱うか」 を決めるプロパティです。ボックスモ...
CSS

CSS Tips | 超実務コアCSSテクニック:ボックスモデル - display:block / inline / inline-block

display:block / inline / inline-block を“動きの違いから理解する”display は 要素がどのように並び、どれだけの幅・高さを持つかを決める CSS の根本的な...
CSS

CSS Tips | 超実務コアCSSテクニック:ボックスモデル - paddingと高さの関係

padding と高さの関係を“正しく理解するとレイアウトが安定する”padding は「内側の余白」ですが、高さ(height)とどう関係するかを理解していないと、要素が思ったより大きくなったり、逆...
CSS

CSS Tips | 超実務コアCSSテクニック:ボックスモデル - margin相殺の理解

margin 相殺(マージンの重なり)を“直感で理解できるようにする”margin 相殺は、CSS のボックスモデルの中でも初心者が最もつまずきやすいポイントです。「なぜ margin が効かないの?...
未分類

CSS Tips | 超実務コアCSSテクニック:ボックスモデル - スコープ分離設計

box-sizing: border-box を“理解するとレイアウトが一気に安定する”box-sizing: border-box は、CSS レイアウトの中でも 最重要級のプロパティです。初心者が...
JavaScript

JavaScript Tips | 文字列ユーティリティ:生成 - CSV 行生成

「CSV 行生成」でやりたいことをはっきりさせるここでのゴールは、「配列やオブジェクトの値から、正しい形式の1行分の CSV 文字列を生成するユーティリティ」を作ることです。見た目はただのカンマ区切り...
JavaScript

JavaScript Tips | 文字列ユーティリティ:生成 - 単語数カウント

「単語数カウント」で何を数えたいのかを決めるまず、ここをはっきりさせたいです。「単語数を数える」と言っても、言語や用途で意味が変わります。英語の文章なら、スペースで区切られた「単語」を数えたい。日本語...
JavaScript

JavaScript Tips | 文字列ユーティリティ:生成 - 文字数カウント

「文字数カウント」で本当に数えたいものは何かまず、ここをはっきりさせたいです。「文字数を数える」と言っても、実は意味が分かれます。画面上で「何文字入力されたか」を知りたい。DBのカラム制限(バイト数)...
JavaScript

JavaScript Tips | 文字列ユーティリティ:生成 - 行数カウント

「行数カウント」で何をしたいのかをはっきりさせるここでの「行数カウント」は、文字列の中に「何行分のテキストがあるか」を数えるユーティリティのことです。テキストエリアに何行入力されているか知りたい。ログ...
JavaScript

JavaScript Tips | 文字列ユーティリティ:生成 - 省略文字列

「省略文字列」で何をしたいのかをはっきりさせるここでの「省略文字列」は、長すぎる文字列を「…」などで途中カットして、画面に収まる形にするユーティリティのことです。テーブルのカラム幅に収まらないタイトル...
JavaScript

JavaScript Tips | 文字列ユーティリティ:生成 - 伏字変換

「伏字変換」でやりたいことを言葉にしてみるここでの「伏字変換」は、特定の単語やNGワードを、画面に出すときだけ隠す(置き換える)処理のことです。ログにはそのまま残したいけど、ユーザーには見せたくない。...
JavaScript

JavaScript Tips | 文字列ユーティリティ:生成 - マスク文字列

「マスク文字列」で何をしたいのかをはっきりさせるまず、「マスク文字列」でやりたいことを言葉にしてみます。画面に本物の値は出したくないけれど、「それっぽく」見せたい。例:******** や ****-...
JavaScript

JavaScript Tips | 文字列ユーティリティ:生成 - トークン生成

まず「トークン生成」で何を作りたいのかを決めるトークンと言っても、用途はいろいろあります。API トークンパスワードリセット用の一時 URL トークンメール認証用のワンタイムトークンCSRF トークン...
JavaScript

JavaScript Tips | 文字列ユーティリティ:生成 - パスワード生成

まず「パスワード生成」で絶対に外せない前提ランダム文字列と違って、パスワード生成は最初から「セキュリティ前提」で考える必要があります。ここを曖昧にすると、一見それっぽく動くけど「簡単に総当たりされるパ...
JavaScript

JavaScript Tips | 文字列ユーティリティ:生成 - ランダム文字列

ランダム文字列ユーティリティで何をしたいか決める「ランダム文字列」と一口に言っても、目的で“正解の実装”が変わります。短い一時トークン(画面遷移の一時キー)テストデータ用の適当なIDユーザーに見せる仮...
JavaScript

JavaScript Tips | 文字列ユーティリティ:検証 - 絵文字検出

絵文字検出で「何をしたいか」を先に決めるまずゴールをはっきりさせましょう。ここでやりたいのは、文字列の中に「絵文字が含まれているかどうか」を判定するユーティリティを作ることです。業務だと、例えばこうい...
JavaScript

JavaScript Tips | 文字列ユーティリティ:検証 - カタカナ判定

「カタカナ判定」で何をチェックしたいのかまずゴールをはっきりさせます。カタカナ判定には、大きく二つのニーズがあります。「この文字列は“全部カタカナだけ”かを判定したい」「この文字列に“カタカナが1文字...
JavaScript

JavaScript Tips | 文字列ユーティリティ:検証 - ひらがな判定

「ひらがな判定」で何をチェックしたいのかまずゴールをはっきりさせます。ひらがな判定には、大きく二つのニーズがあります。「この文字列は“全部ひらがなだけ”かを判定したい」「この文字列に“ひらがなが1文字...
JavaScript

JavaScript Tips | 文字列ユーティリティ:検証 - 日本語判定

「日本語判定」で本当に知りたいことは何かまずゴールをはっきりさせましょう。ここでやりたいのは、「この文字列は“日本語を含んでいるか?”を判定するユーティリティを作ること」です。もう少し分解すると、よく...
JavaScript

JavaScript Tips | 文字列ユーティリティ:検証 - 数字のみ判定

「数字のみ判定」で本当に知りたいことは何かまずゴールをはっきりさせます。ここでやりたいのは、「この文字列は“数字だけ”でできているか?」を判定するユーティリティを作ることです。例えば、こんな要件が典型...
JavaScript

JavaScript Tips | 文字列ユーティリティ:検証 - 英数字判定

「英数字判定」で何をチェックしたいのかをはっきりさせるまず最初に決めておきたいのは、あなたがやりたいのは次のどちらかです。「文字列が“全部”英数字だけかどうかを判定したい」「文字列の中に“英数字が含ま...
JavaScript

JavaScript Tips | 文字列ユーティリティ:検証 - URL 判定

「URL 判定」で本当にやりたいことは何かまず、「URL 判定」と聞くと、「正規表現で http から始まるかどうかをチェックする」みたいなイメージを持ちがちですが、それだとだいたい痛い目を見ます。業...
JavaScript

JavaScript Tips | 文字列ユーティリティ:検証 - 郵便番号判定

郵便番号判定で「何をしたいか」を先に決めるまずゴールをはっきりさせましょう。ここでやりたいのは、「日本の郵便番号として“それっぽいか”を判定するユーティリティを作ること」です。日本の郵便番号は、基本的...
JavaScript

JavaScript Tips | 文字列ユーティリティ:検証 - 電話番号判定

まず「電話番号判定」でやりたいことをはっきりさせる最初に決めておきたいのは、「どこまで厳しく判定するか」です。電話番号って、現実にはいろんな形で入力されます。03-1234-5678090-1234-...
JavaScript

JavaScript Tips | 文字列ユーティリティ:検証 - メールアドレス判定

「メールアドレス判定」はどこまでやるべきか最初に一番大事なことを言います。メールアドレス判定は「完璧」を目指さないほうがいいです。RFC に完全準拠しようとすると、正規表現が怪物みたいになりますし、現...
VBA

Excel VBA | 超初心者(Excel操作+マクロ体験):基本文法 - InputBox

InputBox は「ユーザーに一言入力してもらうための小さな窓」InputBox は、ユーザーに文字や数字を入力してもらうためのダイアログです。MsgBox が「VBA → 人間への一方通行のメッセ...
VBA

Excel VBA | 超初心者(Excel操作+マクロ体験):基本文法 - MsgBox

MsgBox は「VBAが人間に話しかけるための吹き出し」MsgBox は、「メッセージボックス(小さなダイアログ)」を表示するための命令です。VBAが「ちょっと一言伝えたい」「確認したい」「結果を見...
VBA

Excel VBA | 超初心者(Excel操作+マクロ体験):基本文法 - Now関数

Now 関数は「今この瞬間の“日付+時刻”をくれる関数」まず一言でいうと、Now 関数は「今この瞬間の“日付と時刻”を、まとめて Date 型で返してくれる関数」です。今日が何日か(年月日)何時何分何...
VBA

Excel VBA | 超初心者(Excel操作+マクロ体験):基本文法 - Date関数

Date 関数は「今日の日付だけをくれるシンプルな関数」まず一言でいうと、Date 関数は「今日の日付(年月日だけ)」を返してくれる関数です。時刻は含みません(0:00 相当)戻り値の型は Date ...
VBA

Excel VBA | 超初心者(Excel操作+マクロ体験):基本文法 - 日付型

日付型ってそもそも何者?まず一番大事なところからいきます。VBAの「日付型(Date)」は、「見た目は日付や時刻だけど、中身は“日付・時刻として計算できる数値”」です。セルに「2026/02/23」と...
スポンサーリンク