スポンサーリンク
CSS

CSS Tips | 超実務コアCSSテクニック:レイアウト基礎 - flex-grow活用

flex-grow を理解すると「余った幅の配分」が思い通りになるflex-grow は、Flexbox の中でも 「余ったスペースをどの子要素にどれだけ渡すか」 を決めるプロパティです。「このボック...
CSS

CSS Tips | 超実務コアCSSテクニック:レイアウト基礎 - align-items全パターン

align-items を理解すると「縦方向の揃え」が一気に気持ちよくなるalign-items は Flexbox の中で、「交差軸(メイン軸と直角の方向)の揃え方」を決めるプロパティです。横並びな...
CSS

CSS Tips | 超実務コアCSSテクニック:レイアウト基礎 - justify-content全パターン

justify-content を理解すると「横方向の配置」が思い通りになるjustify-content は Flexbox の中でも、「子要素を横方向にどう並べるか」を決める超重要プロパティです。...
CSS

CSS Tips | 超実務コアCSSテクニック:レイアウト基礎 - Flexbox縦並び

Flexbox 縦並びを理解すると「縦方向レイアウト」が一気に整理されるFlexbox は横並びだけじゃなく、縦方向のレイアウト(縦積み・上下の余白調整・フッターを下に押し下げる)にもめちゃくちゃ強い...
CSS

CSS Tips | 超実務コアCSSテクニック:レイアウト基礎 - Flexbox横並び

Flexbox 横並びを理解すると「並べる・揃える・余白を配る」が一気に楽になる横並びレイアウトは、ナビメニュー、カード一覧、ボタンの並びなど、どのサイトでも必ず出てきます。Flexbox を使うと、...
C#

C# Tips | コレクション・LINQ:件数カウント

はじめに:「件数カウント」は“システムの現状を数字でつかむ道具”業務システムでは、常に「いま何件あるか?」が問われます。未処理の件数エラー件数今日登録された件数これをコードで表現するのが「件数カウント...
C#

C# Tips | コレクション・LINQ:グルーピング

はじめに:「グルーピング」は“バラバラの明細を、かたまりにまとめる技”業務システムでは、こんなことをよくやります。「部署ごとに社員をまとめたい」「顧客ごとに売上を集計したい」「日付ごとにアクセス数を集...
C#

C# Tips | コレクション・LINQ:フィルタリング

はじめに:「フィルタリング」は“欲しいデータだけをすくい取る作業”業務システムの一覧画面って、だいたいこういう条件がありますよね。「部署=営業だけ」「状態=未処理だけ」「金額が 10,000 円以上だ...
C#

C# Tips | コレクション・LINQ:ページング

はじめに:「ページング」は“データを一口サイズに切り分ける技”業務システムの一覧画面で、「1ページ 20件」「次へ」「前へ」といった UI をよく見ますよね。これが「ページング」です。データは何千件・...
C#

C# Tips | コレクション・LINQ:カスタムソート

はじめに:「カスタムソート」は“業務ルールをそのまま並び順にする技”「優先度は High → Middle → Low の順」「ステータスは 未処理 → 処理中 → 完了 の順」「部署コードは A, ...
C#

C# Tips | コレクション・LINQ:逆順ソート

はじめに:「逆順ソート」は“優先度の高いものを先頭に持ってくる技”業務システムでは「新しい順」「金額の大きい順」「重要度の高い順」のように、“大きいほう・新しいほうを先頭にしたい”場面がとても多いです...
C#

C# Tips | コレクション・LINQ:ソート

はじめに:「ソート」は“人間が読みやすい順番に並べ替える作業”業務システムでは、一覧画面・帳票・CSV 出力など、「同じデータでも、どの順番で並んでいるか」がものすごく大事になります。社員一覧なら「社...
C#

C# Tips | コレクション・LINQ:重複除去

はじめに:「重複除去」は“データをきれいに整えるフィルター”業務システムでは、同じ ID のレコードが二重に入っていたり、同じメールアドレスが何度も出てきたりと、「重複データ」がよく紛れ込みます。この...
C#

C# Tips | コレクション・LINQ:空List生成

はじめに:「空List生成」は“安全な初期値”を手に入れるテクニック業務コードでよくあるパターンとして、List<string> names = null;// ここで落ちるint count = n...
C#

C# Tips | コレクション・LINQ:null安全List

はじめに:「null安全List」は“落とし穴を先に埋めておく道具”業務コードでありがちな例として、List<string> names = null;// ここで落ちるforeach (var n ...
CSS

CSS Tips | 超実務コアCSSテクニック:ボックスモデル - 複数背景指定

複数背景指定を理解すると「1つの要素に何層ものデザイン」を重ねられるCSS の 複数背景指定(multiple backgrounds) は、1つの要素に 複数の背景画像・グラデーション・パターンを重...
CSS

CSS Tips | 超実務コアCSSテクニック:ボックスモデル - background-clip:text

background-clip:text を理解すると「文字にグラデーションを流し込む」表現ができるbackground-clip: text は、CSS の中でも“映えるデザイン”を作るための強力な...
CSS

CSS Tips | 超実務コアCSSテクニック:ボックスモデル - 背景クリッピング

background-clip(背景クリッピング)を理解すると「背景の見え方」を自在にコントロールできる背景クリッピング(background-clip)は、背景色や背景画像を“どこまで表示するか”を...
CSS

CSS Tips | 超実務コアCSSテクニック:ボックスモデル - outline活用

outline を使いこなすと「枠線とは違う強調」ができるoutline は border と似ていますが、ボックスモデルの外側に描画される“外枠”です。フォームのフォーカスリング、アクセシビリティ対...
CSS

CSS Tips | 超実務コアCSSテクニック:ボックスモデル - box-shadowパターン

box-shadow パターンを理解すると「立体感・奥行き・質感」が一気にプロレベルになるbox-shadow は、ただの影ではありません。UI の雰囲気・奥行き・軽さ・重さ・浮遊感をコントロールする...
Java

Java | Web 基礎・HTTP・REST:Web 全体像 - SPA と MPA

SPA と MPA を一言でいうとSPA は Single Page Application(シングルページアプリケーション) の略で、「最初に 1 つのページを読み込んだあと、画面の中身だけを Ja...
Java

Java | Web 基礎・HTTP・REST:Web 全体像 - フロントエンド / バックエンド

フロントエンド / バックエンドを一言でいうとフロントエンドは「ユーザーの目に見える“表側”」。バックエンドは「見えないところで動いている“裏側の頭脳と心臓”」。あなたが Java で書くのは、基本的...
Java

Java | Web 基礎・HTTP・REST:Web 全体像 - 3 層アーキテクチャ

3 層アーキテクチャを一言でいうと3 層アーキテクチャは、「Web アプリを 3 つの役割にきれいに分けて作ろう」という設計の型 です。プレゼンテーション層(画面・API の入り口)アプリケーション層...
Java

Java | Web 基礎・HTTP・REST:Web 全体像 - 動的コンテンツ

動的コンテンツを一言でいうと動的コンテンツは、「リクエストのたびにサーバー側で中身を“その場で作って返すコンテンツ」 です。誰がアクセスしたかいつアクセスしたかどんな条件でアクセスしたかによって、返す...
Java

Java | Web 基礎・HTTP・REST:Web 全体像 - 静的コンテンツ

静的コンテンツを一言でいうと静的コンテンツは、「サーバー側で中身が変わらないファイルを、そのままブラウザに配るもの」です。HTML、CSS、画像(PNG/JPEG)、JavaScript ファイル、P...
Java

Java | Web 基礎・HTTP・REST:Web 全体像 - アプリケーションサーバー

アプリケーションサーバーを一言でいうとアプリケーションサーバーは「ビジネスロジックを本気で動かすための“Java 実行プラットフォーム”」だと思ってください。Web サーバーが「HTTP を受け取って...
Java

Java | Web 基礎・HTTP・REST:Web 全体像 - Web サーバーとは

Web サーバーを一言でいうとWeb サーバーは、「ブラウザ(クライアント)からの HTTP リクエストを受け取り、HTTP レスポンスを返す“受付兼配達係”」です。ブラウザが「このページください」「...
Java

Java | Web 基礎・HTTP・REST:Web 全体像 - ブラウザの役割

ブラウザの役割を一言でいうとブラウザは、「人間と Web の世界をつなぐ“通訳兼プレイヤー”」です。人間が URL を入力したりボタンを押したりすると、ブラウザがサーバーに HTTP リクエストを送り...
Java

Java | Web 基礎・HTTP・REST:Web 全体像 - クライアントとサーバー

クライアントとサーバーを一言でいうとクライアントとサーバーは、「お願いする側」と「応える側」です。ブラウザやスマホアプリが クライアント、そのリクエストを受け取って処理するのが サーバー。Web の世...
Java

Java | Web 基礎・HTTP・REST:Web 全体像 - Web アプリの仕組み

Web 全体像をざっくりつかむまずは「ブラウザで URL を開くと、裏で何が起きているのか」をイメージでつかみましょう。あなたがブラウザに と入力して Enter を押すと、ブラウザは「サーバー」に対...
スポンサーリンク