タグ コンポーネント設計
人気順 10 users 50 users 100 users 500 users 1000 usersUIコンポーネントの大きさは外から制御しよう - Qiita
昨今のフロントエンド向けUIライブラリでは、コンポーネントの設計が重要です。この記事では、コンポーネントのスタイリング、その中でもとくにコンポーネントの大きさに関わるコンポーネント設計について考えます。 私の考える結論は、むやみに大きさを指定できるpropを生やさずに、CSSで外から大きさを制御できるよう... 続きを読む
UIコンポーネントの大きさは外から制御しよう - Qiita
昨今のフロントエンド向けUIライブラリでは、コンポーネントの設計が重要です。この記事では、コンポーネントのスタイリング、その中でもとくにコンポーネントの大きさに関わるコンポーネント設計について考えます。 私の考える結論は、むやみに大きさを指定できるpropを生やさずに、CSSで外から大きさを制御できるよう... 続きを読む
UIコンポーネントの大きさは外から制御しよう - Qiita
昨今のフロントエンド向けUIライブラリでは、コンポーネントの設計が重要です。この記事では、コンポーネントのスタイリング、その中でもとくにコンポーネントの大きさに関わるコンポーネント設計について考えます。 私の考える結論は、むやみに大きさを指定できるpropを生やさずに、CSSで外から大きさを制御できるよう... 続きを読む
拡張性に優れた React Aria のコンポーネント設計
React Aria Components は Adobe によって提供されている Headless UI コンポーネントライブラリです。振る舞いや国際化に, アクセシビリティに関する機能を備えており、Button や Input, TextField, Label などのシンプルな要素から、DatePicker や ComboBox などの様々なコンポーネントが提供されています。 今回は Re... 続きを読む
Findy転職フロントエンドの開発生産性を向上させるためにやったこと - Findy Tech Blog
こんにちは、ファインディ株式会社でフロントエンドのリードをしております 新福(@puku0x)です。 この記事では、転職サービス Findy の開発チームにおける開発生産性の向上に対する取り組みをご紹介します。 以前の状況 モノリスの解体 開発基盤の刷新 コンポーネント設計の刷新 テストの拡充 CI の高速化 改善の効果 ま... 続きを読む
一休.com 宿泊管理システムのフロントエンド設計と改善の変遷 - Developers Blog - 一休.com Developers Blog
宿泊の管理システムについて 新しい管理システムについて 開発初期のフロントエンド設計 コンポーネントは4レイヤー方式を採用 UIのコンポーネントライブラリを採用 これ以上の設計、方針は決めなかった 初期ローンチ後の課題 改善した内容 1. コンポーネント設計の見直し ディレクトリ構成の変更 大きくなったコンポー... 続きを読む
加速するコンポーネント設計入門 / Component Design as an Accelerator
社内勉強会用 デザイナーとフロントエンドエンジニアの境界をなくし、UI開発を加速させるためのコンポーネント設計入門 ※フロントエンドエンジニア視点 [Keywords] - 共通認識としてのデザインシステム - 共通認識としてのコンポーネント設計 続きを読む
【React/Vue.js】コンポーネント設計の(個人的)ベストプラクティス | Offers Tech Blog
概要 こんにちは、Offers を運営している株式会社 overflow の Software Engineer(主戦場はフロントエンド)の Kazuya です。今回は、React や Vue.js などの SPA フレームワークにおけるコンポーネント設計について紹介します。 昨今のフロントエンド開発では、コンポーネント指向での開発がスタンダート化しつつあり... 続きを読む
CSSとコンポーネント設計に対する考察 - uhyo/blog
近年のフロントエンド開発にはコンポーネントという概念が付いて回ります。React・Vue・AngularといったViewライブラリでは、コンポーネントを定義してそれを組み合わせてアプリを作ります。また、いわゆるWeb Componentsとして知られる仕様群により、ライブラリに依存せずに“コンポーネント”を作ることもできるようにな... 続きを読む
【Vue.js】負債を返却しながら機能追加しなければならない状況で実践したフロントエンドのコンポーネント設計 - クラウドワークス エンジニアブログ
はじめに こんにちは! 社会人2年目を頑張っております、エンジニアの@b0ntenmaruです。 今年2月までリファクタリング専門チームにてcrowdworks.jpの技術的負債を返却するために奮闘しておりましたが、そこから現在まではユーザーの皆様に安心安全なサービスを提供するためにクラウドワークス 安心安全宣言のための施策... 続きを読む
useReducerの本質:良いパフォーマンスのためのロジックとコンポーネント設計 - Qiita
React Hooksの正式リリース(2019年2月)からそろそろ一年が経とうとしています。Hooksの登場によってReactのコンポーネントは関数コンポーネントが一気に主流になり、クラスコンポーネントが新規に作られる機会は激減しました。 また、React 17.x系ではConcurrent Modeの導入とともにさらに2種類の新フックが追加される... 続きを読む
Atomic DesignをVue.jsで実現するための構成と考え方 | Biscuetでの例をもとに - SMARTCAMP Engineer Blog
スマートキャンプのデザイナー/エンジニアの葉栗です。 弊社では8月1日、インサイドセールスに特化したCRM Biscuet(ビスケット という新サービスをリリースしました。 biscuet.jp Biscuetでは Vue.js + Atomic Design でコンポーネント設計をしています。今回はその構成と考え方・Biscuetチームでの運用について紹介し... 続きを読む
最近のフロントエンドのコンポーネント設計に立ち向かう - Qiita
ReactやVueなどコンポーネントベースで作っていくViewのライブラリが普及したことで、コンポーネント指向での開発が一般化してきた昨今のフロントエンドですが、このコンポーネントの設計に悩まれる方も多いのではないでしょうか。 コンポーネントをどの粒度、どんな状態で分割するのが良いのか、などなど、特にチームで開発する時に認識が揃っていないとカオスになりがちな部分であると思うので、自分なりの設計をす... 続きを読む
いまどきのコンポーネント設計をめぐる座談会 | CodeGrid
コンポーネント構造を考えるとき、さまざまな軸が考えられます。それらを踏まえてコンポーネントを切るとき、何に気をつけるべきなのでしょうか。また、デザイナーとエンジニアの関係についても考えます。 続きを読む
Atomic Designの概念に基づいたJavaScriptフレームワークのコンポーネント設計とは? - pixiv inside
テクノロジー Atomic Designの概念に基づいたJavaScriptフレームワークのコンポーネント設計とは? はじめに こんにちは。はてなブログとエモい話が何よりもすきな17新卒のエンジニアPotato4dです。 ひょんなことからこのpixiv insideに技術的な記事を書く機会に恵まれたので、JavaScript周りの話を書きたいと思います。 概要 モダンなJavaScript環境に慣... 続きを読む
amakan の React コンポーネント設計 - ✘╹◡╹✘
2017 - 03 - 15 amakan の React コンポーネント設計 説明用の図 例として、amakan anime のトップページ https://anime.amakan.net/ の構造を挙げながら説明する。 登場する コンポーネント 一覧 React.Component クラスを継承したクラスを コンポーネント と呼ぶ。上手に登場する コンポーネント は以下の通り。 Header... 続きを読む