GitHub - mbasso/react-cssom: Css selector for React ComponentsYou signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session. You switched accounts on another tab or window. Reload to refresh your session. Dismiss alert
ReactコンポーネントとCSSコンポーネントは1対1なのか問題について
React Meetup #4 でのLT資料です。
Reactと一緒に使う時のCSS in JSのライブラリ選定とか所感とか - Qiita
CSS in JSの基礎 原点はこちらのスライドがよく挙げられる。 いわゆる「CSSのあらゆる問題をJSで解決する」という感じのもの。 先行の記事としてはこのような感じ CSS in JS(Elm)したら想像以上に良かった Free-Style のススメ ~ CSS Modules は解決策ではない とりあえず今回はReactと一緒に使う前提のことを考える CSS in JS ライブラリの実装系統 CSS in JSライブラリもかなり色々あるが、だいたい下記の観点で分類できそうだった。 スタイルの再現に関する実装 <style>タグを生成して、<head>にinsertする実装パターン 昨今のスタンダードなライブラリの使っている手法 CSSの疑似要素や@media queryもだいたい使える InlineにCSSを展開する実装パターン わりと絶滅危惧種っぽい（開発止まっていたり） そもそも
Inline CSS at Khan Academy: Aphrodite
By Jamie Wong I won’t ramble in this post about the maintenance woe that is CSS, as others have said it better in the past. In particular, Christopher “vjeux” Chedeau sparked much of this discussion in his talk React: CSS in JS. Instead, I’d like to discuss Aphrodite, the inline styling solution we’ve developed at Khan Academy, the constraints that led to it, and its use in production today. Page
reBEM: React ♥ BEM
It’s been about a year since me and Kir Belevich started using React at Lazada Group for some internal admin interfaces. We learned a lot during that time and our minds have been heavily shifted by that one-way data-flow philosophy React pushes. Since React is not exactly a framework, but just a view library, we have both freedom of choice and a burden of responsibility, like: how to structure you
2016-03-08のJS: React v15.0 RC、Reactパフォーマンス調査、DDD
JSer.info #269 - React v15.0 RC1がリリースされました。 React v15.0 Release Candidate | React New Versioning Schemeで書かれているように、Reactの次のメジャーバージョンはv0.14 -> v15.0となります。 v15.0 RC1ではdata-reactidがクライアントサイドのレンダリングではなくなる、nullをコメントとしてレンダリングするようになるなどレンダリングに関する変更がおこなわれています。 React v0.14でreactとreact-domにパッケージが分けられ、それぞれでメソッドも分離されたため非推奨となっていたメソッドがありました。 v15.0ではこれらの非推奨メソッドの削除や警告メッセージの改善などが行われています。 Performance Engineering with
Designing in React: Why and How
FRONTEND CONFERENCE 2016 http://kfug.jp/frontconf2016/
React meetup 3_eight
20. Button Component • typeでレイアウトやテーマを指定する • PRIMARY(_MINI) → submitやOKなどの青系のボタン • SECONARY(_MINI) → キャンセル用の灰色のボタン • htmlのbuttonタグのように使えて、ボタンとしての見た目や振 る舞いが揃う • 機能追加、改善フェーズに入るとこういう細かいところの共通 化で開発効率がだいぶ上がる <Button onClick={registration} disabled={alreadyRegistred} type=“PRIMARY” /> 21. CSSは？ • rails上でsass使ってます • Componentの階層構造に合わせて命名 • js:components/common/button.js • css: “.common-button” • 階層は”-”で表
Reactとcss-loader
ReactとCSSを書いた後にRadiumを使ってみたのだけど、いまいち微妙な感じだった。 CSSをJSのオブジェクトで書いて、頑張ってタグのひとつひとつにstyle属性を書いていく、というふうなことになって普通にCSSを書くよりもかなり残念な感じになった。 （もしかすると自分のRadiumの使い方がおかしいのかもしれないのだけど） 数日前たまたまcss-loaderのリポジトリを見ていたら、ローカルスコープ風にCSSが書ける、というような記述があって気になって試してみた。 webpack.config.coffee webpack.config.jsからwebpack.config.coffeeを読み込むように書いて、webpack.config.coffeeに以下の様な設定を書く。 module: loaders: [ { test: /\.css$/, loader: 'style!
ReactでBEMなclassNameを書きやすくするBemmerというライブラリを作った - axross blog
2015-03-15 ReactでBEMなclassNameを書きやすくするBemmerというライブラリを作った JavaScript React BEM npm 作った JSX ReactとBEMはすごく相性がよくて、ずっとBEMで書いている。 ReactのComponentという単位、性格にはmodule.exports対象にするような再利用性のあるUI部品をBEMのBlockという単位に結びつけると、非常に扱いやすくなる。 ファイル名もxxx-xxx-xxx.jsx``xxx-xxx-xxx.lessのようにして、クラス名もxxxXxxXxxのようにすると、名前が競合する危険性がゼロになり、それが再利用可能であることを示唆できる。 背景 で、そんな中React.createClass()でJSXのclassName属性を設定する際、困ったことがあって、Modifierに弱いという問題
React: CSS in JS
TypeScript だけを書いて Tauri でデスクトップアプリを作ろう / Tauri with only TypeScript
React Bootstrap | React Bootstrap
React-Bootstrap replaces the Bootstrap JavaScript. Each component has been built from scratch as a true React component, without unneeded dependencies like jQuery. As one of the oldest React libraries, React-Bootstrap has evolved and grown alongside React, making it an excellent choice as your UI foundation. Built with compatibility in mind, we embrace our bootstrap core and strive to be compatibl
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
GitHub - Wildhoney/Interpose: Apply stylesheet variables to your React components for use in your stylesheets. Interpose reduces the clutter of React components by bridging the gap between JS and CSS without resorting to complicating your components with
GitHub - yocontra/react-responsive: CSS media queries in react - for responsive design, and more.
GitHub - pocotan001/react-styleguide-generator: Easily generate a good-looking styleguide by adding some documentation to your React project.
GitHub - MicheleBertoli/css-in-js: React: CSS in JS techniques comparison
Loading...
Radium - A React Component Styling Library
GitHub - js-next/react-style: UNMAINTAINED