この記事は古くなっており、今後更新されません。新しい React 日本語ドキュメントである ja.react.dev をご利用ください。 JSX とは、つまるところ React.createElement(component, props, ...children) の糖衣構文にすぎません。例として、次の JSX コードを見てみましょう。
最近、Webのフロントエンドの世界ではReactを使っているプロジェクトがたくさんあってよく目にします。npmのトレンドで見ても圧倒的って感じではありますね。 今回は、Atomic DesignとReactの相性は結局いいのか。みたいなところとかどう言う辛さが待っているか、どのようにすればエンジニアもAtomic Designを使いやすくできるかみたいなことを記事にできたらと思います。 Atomic DesignでのReactコンポーネントコンポーネント思考が当たり前になりつつあるこのフロントエンドの業界の中、Atomic Designでコンポーネントの管理を行っているプロジェクトは少なくないと思います。 しかし、もともとエンジニアに向けて作られたものではないので実装面で少し辛いところがあったりもするかと思います。 例えば、atomsにselectを作ったとします。selectは指定された
フロントエンドの中でも、JS書くプログラマと、CSSを書くマークアップと、デザインカンプを作るデザイナで、コンポーネントという概念がズレる。だいたいこれらが一人だったり兼任だったりで1~2レイヤーの開発ステップになるが、完全分業だったり人が多くなると混乱の元になる。 誰かが決定的に間違ってるというつもりはない。正直、どっちかというと本来のデザイナ側の用語定義に倒した方がいい気がしているが、プログラム上の都合もいろいろ混ざってきて、話が簡単ではない。 自分の理解が間違ってる可能性もある。この記事はレビューをもらうために書いている側面もあり、指摘されたら追記していく。 読んだもの。 Atomic DesignとCSS設計 - Atomic Designとは何か | CodeGrid Atomic Designの考え方と利点・欠点 – wkr. Atomic Design の大雑把な理解 基本的
Enigmo Advent Calendar 2018の4日目の記事です。 この記事の目的 Enigmoが運営しているBUYMAでは古代から運用しているjQueryの他に、2016年頃から一部ページのフロントエンドをReact/Reduxで構築しています。 私自身もEnigmoに入社してからの約三年間でReact/Reduxアプリケーションの開発に多数携わってきましたので、そこで培った知見を共有したいと思います。 React/Reduxの利点 まずはじめに、ReactとReduxを使うメリットを再確認しておきたいと思います。 それぞれのメリットをしっかりと認識しておくことで、実装する際どう書くか迷ってしまった場合などにそのメリットを最大限活かす選択をすることができます。 Reactの利点 コンポーネント化が容易で再利用性が高い 状態をDOMから分離できる(Stateless) Reduxの
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く