Hatena Blog Tags
はてなブログ トップ
Storybook
このタグでブログを書く
言葉の解説
ネットで話題
関連ブログ

Storybook

このタグの解説についてこの解説文は、すでに終了したサービス「はてなキーワード」内で有志のユーザーが作成・編集した内容に基づいています。その正確性や網羅性をはてなが保証するものではありません。問題のある記述を発見した場合には、お問い合わせフォームよりご連絡ください。
ホワイトヘルスケア - テックブログ•2ヶ月前

MSWを使ってStorybookにダミーデータを表示しようとしてS3ホスティングでハマった話

はじめに 🧪 背景：開発中はMSWでモックデータを表示 🌐 問題：S3にStorybookをホスティングしたら動かない 🧩 原因：Service Workerのパスがローカルとホスティングで異なっていた ✅ 対処法：ローカル開発とホスティング時のパスの統一 📝 まとめ 採用情報 採用情報詳細 はじめに ホワイトヘルスケア エンジニアの林です。 今回はReact開発で便利なモックサーバーツール「MSW（Mock Service Worker）」を使っていて、StorybookをS3でホスティングしたときに発生した問題とその対処法について共有します。 🧪 背景：開発中はMSWでモックデータを表示 …

#MSW

ネットで話題

もっと見る
346ブックマーク【レビュー】小説作成ソフトで論理的に物語を構成 - オープンソースソフト「StorYBook」 (1) StorYBookの概要とインストール | パソコン | マイコミジャーナル筋の練られた小説を読んだり、ドラマを見たりして感心させられることも多いだろう。中には、自分でも小説を書きたいと思う人もいるかもしれない。また、ケータイ小説への投稿も流行っている。そんな小説作りに最適かもしれないソフトが、オープンソースで開発され、提供されている「StorYBook」である。「StorYBook」で...journal.mycom.co.jp
315ブックマークStorybookを書くだけでリグレッションテストが 実行される世界へようこそspeakerdeck.com
238ブックマークFigma + Storybook + PlaywrightのMCPを使ったフロントエンド開発speakerdeck.com
160ブックマークStorybook: Frontend workshop for UI developmentstorybook.js.org
131ブックマーク[Next.js]フロントテストのコストはStorybookで削減出来るzenn.dev
130ブックマークStorybook First な開発のススメblog.ojisan.io
127ブックマークStorybook for Vueでエンジニアとデザイナーの協業を加速させる - Studio Andystudio-andy.hatenablog.com
117ブックマークMOONGIFT: » 目指せ小説家！「StorYBook」:オープンソースを毎日紹介www.moongift.jp
116ブックマークReact Storybook で変わるUI開発フロー (Redux Flavor) - Qiitaqiita.com

関連ブログ

弁護士ドットコム株式会社 Creators’ blog•4ヶ月前

クラウドサインUIコンポーネントライブラリ delta-wing-ui の9つの設計観点

はじめに こんにちは。 弁護士ドットコム株式会社でクラウドサインという電子契約サービスのフロントエンドを担当しています、神戸と言います。 クラウドサインでは、delta-wing-ui という社内で利用するための UI コンポーネントライブラリを開発しています。 その delta-wing-ui について、今回はどのような設計観点で作成しているかを少しご紹介します。 はじめに delta-wing-uiとは 設計観点 デザインシステムの仕様書に準拠していること コーディングルールを満たしていること モダンな書き方になっていること Web 標準のセマンティック要素を使用していること（アクセシビリ…

#UIコンポーネント#Vue.js#Vite#Storybook#デザインシステム
AIを使ってしたい100のこと•4ヶ月前

SoraとGeminiで作る、AI絵本の世界

最近、AIを使ったクリエイティブな活動がどんどん手軽になっています。今回は、OpenAIの動画生成AI「Sora」でプロンプトから動画を作成し、さらにその動画と同じプロンプトを使って、Google GeminiのGem「Storybook」で絵本を作成してみました。 AIが描く物語の世界を、ぜひ一緒に体験してみてください。 STEP 1：Soraで動画を生成 まずは、Soraに以下のプロンプトを入力しました。 An animated shot of a cute creature with snow leopard-like fur, walking gently through a snow…

#Storybook#絵本#読み聞かせ#Sora#動画生成AI
APC 技術ブログ•4ヶ月前

GeminiのGemで「絵本」を作ってみた！クリエイティブなアイデアを形にする製作過程

こんにちは！今回のブログでは、Google Geminiの便利な機能「Gem」を使って絵本を制作した際の舞台裏を、皆さまにご紹介します。 クリエイティブな活動に興味があるけれど、「アイデアがなかなかまとまらない…」「どうやって形にしたらいいかわからない…」といった悩みをお持ちの方に、ぜひ読んでいただきたい内容です。 今回は、漠然としたアイデアから、ストーリー、そしてアートスタイルまで、Gemがどのように私の創作活動をサポートしてくれたのか、その全貌を公開します。 創作の始まり：一つの動画から生まれたアイデア 今回の絵本制作のきっかけは、私が以前Soraで制作した、猫がグラフィティアートを描く動…

#生成AI#Storybook
PLAY DEVELOPERS BLOG•7ヶ月前

GitHub Copilot を活用して社内 UI コンポーネントの Storybook カタログを作った話

こんにちは。テックリードの丸山 @maruyamaworks です。最近は Claude Code に全部賭けています。 弊社も生成 AI を活用することで開発効率を圧倒的に高めるべく、さまざまなツールの検証や導入、社内ルールの整備などを急ピッチで進めています。また、実際に開発支援系 AI を活用してうまくいった事例もいくつか出てきています。今回はその中から、GitHub Copilot を活用して社内 UI コンポーネントのカタログを作った話をご紹介したいと思います。 社内 UI コンポーネントについて Storybook を利用した UI カタログの整備 Story ファイルを作成してもら…

#GitHub Copilot#生成AI#LLM#Storybook
らいふうっどの閑話休題•9ヶ月前

2025.04.27 覚書 / 2025.04.27 memo's

2025.04.27 覚書 / 2025.04.27 memo's 自分が参考になったブログの紹介します。 / Here are some blogs that I found helpful. Angular dev.to Angularでのリソース管理をグループ化して効率化する新しいアプローチ「ResourceByGroup」の導入について解説。 複数リソースを効果的に操作し、コードをより明確に保つ方法を学べます。 dev.to AngularでのCRUD操作におけるリクエストとステータストラッキングを改善する方法を紹介。 RxJSのgroupByを活用して効率的なリクエスト管理を実現しま…

#Angular#Storybook
LayerX エンジニアブログ•9ヶ月前

Storybook Play functionでAHA testingのすゝめ

バクラク事業部でソフトウェアエンジニアをしている @ta1m1kam です。 フロントエンド開発において「どのテストをどれだけ書くべきか？」という問いは、誰もが一度は悩むテーマです。ユニットテスト？E2Eテスト？ビジュアルリグレッション？それぞれに役割があり、バランスが求められます。 Testing Trophy そんな悩みに対する一つの指針として、Kent C. Dodds氏が提唱した 「Testing Trophy（テスティング・トロフィー）」 という考え方あります。（提唱自体は2021年ごろなので、今では割と一般的になっているかなと感じています。） kentcdodds.com ポイント…

#フロントエンド#Storybook#react#フロントエンドテスト#testing
ITANDI Engineer Blog•10ヶ月前

デザインシステム「ITANDI BB UI」とそれを支えるStorybookの紹介

こんにちは！イタンジのFrontend Unit所属の薄羽です。2024年3月に中途入社しました。好きなnpmパッケージは @emotion/react です。 イタンジのFrontend Unitには主務で薄羽と西野が在籍しており、デザインシステム「ITANDI BB UI」の開発とプロダクトのフロントエンドを横断的に見ること*1を主な仕事としています。 今回はITANDI BB UIとそれを支える「Storybook」を紹介します。 ITANDI BB UI イタンジには、物件管理や申込管理など、様々な機能が存在します。それらの機能は別々のチームで開発されており、同じ見た目や振る舞いのコン…

#デザインシステム#Storybook#TypeScript#フロントエンドテスト
青いやつの進捗日記。•10ヶ月前

storybook、なにもしていないのに急にFailed to fetch dynamically imported moduleって言われた が、結局キャッシュ消してリロードしたら解決した

Failed to fetch dynamically imported module: http://localhost:6006/node_modules/.cache/storybook/1c3385a5d25e538d10b518b310c74d3ca2690b6aaffeadccd74da79736171f86/sb-vite/deps/@storybook_addon-interactions_preview.js?v=ca377e5c The file does not exist at "/Users/[ユーザー名]/Documents/git/[プロジェクト名]/node_m…

#Storybook
アドグローブブログ | 渋谷のIT会社•1年前

UI開発を効率化！Storybookでコンポーネントの「見える化」＆管理をラクに！

こんにちは。 株式会社アドグローブ ソリューション第一事業部の清水です！ 突然ですがフロントエンド開発で、こんなお悩みありませんか？ 「コンポーネントが増えて、どんなコンポーネントがあるか把握できない...😥」 そんな悩みを解決してくれるのが Storybook です！特に、フロントエンド開発でコンポーネント管理に課題を感じている方におすすめです。 この記事では、Storybookの導入方法やメリットを紹介します！ Storybookとは？ Storybookを導入するメリット 導入方法 起動 Storybookにコンポーネントを追加する インタラクションテストを導入する ドキュメントページを…

#Storybook#UI開発