【App Router時代のスタイリング革命】 Zero-Runtimeの理解とvanilla-extractという選択肢

Slide 1

Slide 1 text

Slide 2

Slide 2 text

Slide 3

Slide 3 text

X のQRコード 1.自己紹介 ©BLUEISH Inc.All Rights Reserved. Flutterを使用したモバイルアプリ開対話型AIを使用した自社サービスの開 AWS、Amazon Bedrockなど、インフラ周りのキャッチアップにも注力 11月開催の“技術書典 17”に参加予定のため、現在執筆活動 Xのフォローお願いします！株式会社BLUEISH  System Engineer / Executive Assistant to CEO @osasasasa22 おささ

Slide 4

Slide 4 text

1.自己紹介（開発中のサービス①） ©BLUEISH Inc.All Rights Reserved. 【Omni Workspace （オムニワークスペース）】https://omni-workspace.com¥ エンタープライズ向けAI・LLMアプリ開発プラットフォーp 各ドメインに特化した実務レベルの専門性の高いワークフローを自動生成世界最大のデータセンター企業Equinixと協業。  Platform Equinix®でハイブリッド・マルチクラウド環境を容易に構築使用技術（フロント）  Next.js（App Router）× TypeScript × vanilla-extract × Storybook

Slide 5

Slide 5 text

1.自己紹介（開発中のサービス②） ©BLUEISH Inc.All Rights Reserved. 【AI am (アイアム)】https://ai-am-with.co µ 実在するタレントの個性を学習したAIと会話ができる対話型AIサービ· µ チャットに加え、親密度機能や投げ銭機能 µ 元乃木坂46の和田まあやさんとコラボした、  ”AI AM MAAYAクローズドβ版”を 8/10(土）にリリース予} µ 使用技術（フロント）  Next.js（App Router）× TypeScript × vanilla-extract × Storybook

Slide 6

Slide 6 text

Slide 7

Slide 7 text

Slide 8

Slide 8 text

Slide 9

Slide 9 text

Slide 10

Slide 10 text

Slide 11

Slide 11 text

Slide 12

Slide 12 text

Slide 13

Slide 13 text

Slide 14

Slide 14 text

Slide 15

Slide 15 text

Slide 16

Slide 16 text

Slide 17

Slide 17 text

Slide 18

Slide 18 text

Slide 19

Slide 19 text

Slide 20

Slide 20 text

Slide 21

Slide 21 text

© B LU E I S H I n c . A l l R i g h t s R e s e r ve d . TypeScriptとの完全な統合 vanilla-extractの実践【コンパイル時のエラー検出】  プロパティ名のタイプミスや無効な値の使用をコンパイル時に検出【コード補完】  IDEの自動補完機能により、有効なCSSプロパティと値を提案【リファクタリングの安全性】  型チェックにより、大規模なスタイル変更も安全に