5分で完璧に分かる！CSS Gridの基本的な使い方を解説
CSS Gridは、今まで使用してきたレイアウトの実装とは大きく異なります。flexboxはアイテムを一つの軸に沿って並べるので、floatの延長としてあまり難しくはないと思います。しかし、CSS Gridは軸が一つではなく、縦と横の二つの軸でレイアウトします。 CSS Gridの基本的な使い方を分かりやすく解説します。 Learn CSS Grid in 5 Minutes by Per Harald Borgen 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様にライセンスを得て翻訳しています。 CSS Gridを始めよう！ 最初のグリッドレイアウト CSS Gridの列と行 CSS Gridのアイテムの配置 CSS Gridを始めよう！ グリッドレイアウトはWebサイトの設計において基本であり、CSS Grid モジュールはグリッドを作成するための最も強力で
CSS GridがBootstrapよりレイアウト作成に向いている理由（翻訳）
概要 原著者の許諾を得て翻訳・公開いたします。 英語記事: Why CSS Grid is better than Bootstrap for creating layouts 原文公開日: 2017/12/03 著者: Per Harald Borgen CSS GridはWebレイアウト作成の新しい手法です。ブラウザでネイティブに動作するまともなレイアウトシステムが登場したのはこれが初めてです。 CSS Gridのメリットは、かの有名なBootstrapと比較することでいっそう際立ちます。以前ならJavaScriptを導入しなければ到底不可能だったレイアウトを作れるようになっただけではなく、コードのわかりやすさやメンテのしやすさも向上します。 本記事でその理由を解説します。 筆者は現在無料のCSS Grid上級編講座の準備も進めており、12月中に立ち上げを予定しています。 今のうちに講
Railsでawesome_nested_setとjsTreeでインタラクティブにツリー構造を操作する - Rails Webook
インタラクティブに階層構造を操作できるjQuery pluginのjsTreeを使い、上記のようにUIを向上させます。 「Railsでawesome_nested_setを使って階層構造を作成する」の実施を前提にしています。 動作確認 Ruby 2.1.2 Rails 4.2.0 awesome_nested_set 3.0.2 jsTree 3.0.9 目次 1. jsTreeでクライアント側の動きを実装する 1.1. RailsにjsTreeをインストールする 1.2. jsTreeのプラグインでカテゴリーを移動できるようにする 1.3. カテゴリーの追加、リネーム、削除を追加する 2. jsTreeの各アクションとRailsのAPIを連携させる 2.1. カテゴリの初期データをサーバーから取得する 2.2. カテゴリの追加/リネーム/削除アクションを実装する 2.3. カテゴリの移動
Reactを使ったモジュラーCSS : CSS-in-JSとCSS Module | POSTD
Buffer のメンバーはReactが大好きで、フロントエンドの多くのコードベースを徐々にReactに移行させています。ReactにFluxを加えると、モジュラー形式の小さなアプリでできた複雑なプロダクトを構築するための、とても健全な方法になると思います。そこで、１つ１つの新しい小さなアプリと機能を、大規模な構造体に追加される、Reactの新しいブロックと考えます。 私は最近、このような新機能の１つに取り組んでいますが、React＋Fluxのアプリケーションを作るのがいかに簡単であるかと、その理由について、さらに夢中になってしまいました。Reactを使うと有意味なコンポーネントを集めてUIを宣言的に構築するのが楽になり、Fluxはその混成体に妥当なデータフローをもたらします。 複雑なアプリケーションを作るときに発生する課題について多くの考察がなされましたが、React＋Fluxの組み合わせ
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
