Storybook for Vueでエンジニアとデザイナーの協業を加速させる - Studio Andy
この記事はCAMPHOR- Advent Calendar 2017の23日目の記事です。 はじめに アプリケーションの機能を「カプセル化」、「コンポーネント化」しようというのは、フロントエンド/バックエンド問わずに近年のWeb開発におけるトレンドのひとつです。 Web業界も5年もの、10年ものと呼ばれるシステムが増える中で「最初から完璧なシステムを作ることなんて無理なんじゃないか」と多くの人が気づきはじめました。 その流れを受けて「どうせ改修が必要なら、小さなスコープで新しいものに置き換え可能な仕組みを作ろうぜ！」というのが「カプセル化」、「コンポーネント化」の大きなモチベーションであると、個人的には理解しています。 Vue.jsとコンポーネント JavaScriptのフレームワークであるVue.jsも、例に漏れずコンポーネントドリブンな開発に適した仕組みの1つです。 SFC(Singl
Storybookがなぜ必要か？(Vue.js編) - Qiita
まさあき(@masaaakikunsan)です。 最近よく、「Storybookを導入しよう」「Storybookがいい」と言う話は聞きますが、意外となぜ必要なのか、どう使うのか、という記事がみつからなかったので、基本的な使い方をサンプルと共に紹介します。 TL;DR StorybookでUIコンポーネントのカタログを作ることができる カタログのおかげでデザイナーと認識の齟齬が生まれなくなる アドオンを追加するとStorybookがかなり便利アイテムになる Storybookとは ざっくり言うとコンポーネントのカタログです。 コンポーネントライブラリの参照ができ、各コンポーネントの様々な状態の表示などができるものとなります。 また、アプリ外で実行されるため、UIコンポーネントを単独で開発でき、コンポネの再利用、テストの容易性、開発スピードを向上させることができるのが魅力です。
Storybook for Vue 入門 - Qiita
はじめに 筆者が今携わっているプロジェクトでは Vue.js（以後は Vue）が使われています。 そのプロジェクトで一度 「Storybook」 というツールを導入しようとしたことがありました。結局導入は見送ることになりましたが、その時に Storybook に良い手応えを感じたため、あらためて簡単なプロジェクトを作り Storybook を試してみました。 下記がデモです。 デモ 1（プロジェクト） デモ 2（プロジェクトの Storybook） Storybook 自体まだまだ新しいプロジェクトのため、ネット上にも情報は多くありません。この記事を読み Storybook に興味を持ってくれる人が増え、ネット上に Storybook の情報が増えていけばいいな、と思います。 この記事の対象読者 Vue を使って開発をしている人 / する予定のある人 / 興味のある人 Vue のプロジェク
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
