[B! storybook] uchiuchiyamaのブックマーク

uchiuchiyama id:uchiuchiyama

storybookに関するuchiuchiyamaのブックマーク (8)

VSCode snippet to create a Storybook story
uchiuchiyama 2022/11/30
vscode

storybook
リンク
Next.js v12 + Storybook v6.5でハマったところ
問題 tsconfigにパスエイリアスの設定をしたNext.js プロジェクトにStorybookを導入しようとしたところ、エイリアスを使用してのパスが解決できないエラー resolve '@/pages/index' in '(略)/src/stories/pages' Parsed request is a module using description file: (略)/package.json (relative path: ./src/stories/pages) Field 'browser' doesn't contain a valid alias configuration resolve as module...(略) ハマったところ愚直にエラー文の検索や「Next.js Storybook パスエイリアス」等で検索したところ、下記の解決方法と同じものが多く出て
uchiuchiyama 2022/11/29
next.js

storybook

development
リンク
Integrations | Storybook: Frontend workshop for UI development
A no config Storybook addon that makes Next.js features just work in Storybook Storybook Addon Next ⚠️ DEPRECATED ⚠️ This addon has been deprecated in favor of @storybook/nextjs which is the Storybook official addon for supporting Next.js features in Storybook. It supports everything storybook-addon-next does and much more! I even worked on developing this with them so you should be in good hands.
uchiuchiyama 2022/11/29
next.js

storybook

development

library

plugin
リンク
NextJS + StorybookJS + Material-UI + Jest + SWR
This is my favorite setup now for new apps and I think you will like it too. Frameworks like NextJS (https://nextjs.org/) helps you bootstrap a React application in seconds. You only need to install a couple of NPM packages, create a file, and voila you have your React application with exceptional features support and a huge ecosystem of solutions, examples, documentation, and developers ready to
uchiuchiyama 2022/11/29
next.js

storybook

material

tutorial
リンク
[Next.js] Storybook
TypeScriptベースのNext.js プロジェクトでStorybookを使ってコンポーネント主導開発をしてみましょう。概要今回のブログポストではTypeScriptをベースにしたNext.js プロジェクトにStorybookを入れてコンポーネント主導開発(Component Driven Development)をやってみましょう。 Storybookここで紹介するソースコードは下記のリンクで確認できます。 GitHub: https://github.com/dev-yakuza/study-nextjs/tree/main/6.storybookブログリストこのブログポストはシリーズで作成されています。次はNext.jsのシリーズリストです。 [Next.js] 始まる[Next.js] TypeScript[Next.js] Prettier[Next.js] 絶対パスでコンポ
uchiuchiyama 2022/11/29
next.js

storybook

react

typescript

development

tutorial
リンク
[Next.js] MUI
TypeScriptベースのNext.jsにUIライブラリであるMUI(Material UI)を追加して使う方法について説明します。概要今回のブログポストではTypeScriptをベースにしたNext.js プロジェクトでUIライブラリであるMUI(Material UI)をインストールして、使う方法について説明します。 MUIここで紹介するソースコードは下記のリンクで確認できます。 GitHub: https://github.com/dev-yakuza/study-nextjs/tree/main/8.muiブログリストこのブログポストはシリーズで作成されています。次はNext.jsのシリーズリストです。 [Next.js] 始まる[Next.js] TypeScript[Next.js] Prettier[Next.js] 絶対パスでコンポーネント追加[Next.js] テスト[
uchiuchiyama 2022/11/29
typescript

mui

material

ui

storybook

react

tutorial
リンク
ゼロから始めるStorybook入門(React編) | アールエフェクト
StorybookはアプリケーションからUIコンポーネントを切り離し、独立した状態でコンポーネントの開発、動作確認やテストを行うために利用することができるUIツールです。コンポーネントが持つpropsを変更することでブラウザ上でどのような表示になるかプレビューを行うことで動作確認することができます。この説明が最初は”?”の人でも本文書では公式のドキュメントよりもさらにシンプルなコードを利用して動作確認を行なっているのでStorybookの基礎的な利用方法や機能を短時間で理解することができます。 Storybookが利用できるJavaScriptのフレームワーク/ライブラリにはReact以外にもVue.js, React Native, Svelte, Amber, Angularなどがありますが本文書ではReactを利用しています。本文書で動作確認を行なっているStorybookのバージョ
uchiuchiyama 2022/11/29
storybook

react

development

design

ui
リンク
React Storybook で変わるUI開発フロー (Redux Flavor) - Qiita
SPAを考える会 (D3勉強会 2016.10.06) by @kitaly (twitter: @kita_ly) 自己紹介 @kitaly Twitter: @kita_ly ソフトウェアエンジニア REST API開発 (Scala/Play) SPA開発 (TypeScript, Angular.js, React.js) ビズリーチ HRMOS プロダクト開発部採用管理　(2016年6月リリース) 勤怠管理, 評価管理, その他HR系サービス (Coming Soon..) 過去の発表資料サーバサイドエンジニアが 1年間まじめにSPAやってみたビズリーチではDBFluteハンズオンやってますはじめに React / Redux / Webpack 前提の話ですが他のコンポーネント志向FWなどでも、ユースケースやワークフローは応用可能だと思っています新しいツール
uchiuchiyama 2017/06/06
storybook

react

development

node.js

tutorial
リンク
1