Fusicフロントエンド座談会 from 雅 2023/07/28

TL;DR

• Shorebirdも着々とアップデートされて良くなってるよ
• Android 13のプッシュ通知変な挙動がある
• Firebase App Tester便利だよ
• Figma Dev Modeはアツい！
• iOSの衝撃検知機能大変そう
• TurborepoがGoからRustへ！？
• MetaのQuest Pro生産終了
• MetaのDan氏の離脱
• React 18になってパフォーマンス改善されてるよ
• AIアプリ作るためのライブラリ色々出てる→TypeChat、Vercel AI SDK
• Androidのミラーリングにscrcpy便利だよ
• React Nativeのオープンソースのみでビデオ通話アプリ！？
• ナレッジワークさんのReact/Next.js勉強会よき
• Angularも悪くないぜ
• ペチコン福岡のアーカイブ見てね
• Expo公式のadmobライブラリがなくなったよ
• iOSのプッシュ通知テストはPush Notifications Consoleが便利
• Vision Proほしい
• Vite 4.4でまたビルド速くなりそう
• shadcn/ui良さげ
• エッジでフロントエンド動かすと輝く
• Xamarinお疲れさまでした
• Wasmer Edgeわからん...
• モバイルアプリのE2EはMaestro良いよ
• ECMAScriptで良さそうなプロポーザルでた
• REACT.ggでReact学べる
• メルカリのデザインシステムすごい

議事録

Shorebirdアップデート情報

• CI対応されてGitHub ActionsでCode Pushを自動化できるようになった！
• Expoのダッシュボード的なのが実装されてアカウント情報とか利用状況がWebで確認できるようになった！
• iOSのCode Push（OTAアップデート）がアルファ版で使えるようになった！

Android 13のプッシュ通知の挙動について

• 通知許可アラートの表示回数
• 通知許可をしない→タスクキル→起動でもう1回許可モーダルが出てしまう
• 2回目以降は出ないという挙動

Firebase App Tester（App Distribution）が便利

• https://firebase.google.com/docs/app-distribution/get-set-up-as-a-tester?platform=android&hl=ja
• iOSのTestFlightみたいに使える（実際はapkが降ってくるぐらい）

Figma Dev Modeについて

• これについては話すと長くなってしまうので後でやろう！（わいわい）

iOSの衝撃検知機能について

• 知らぬ間の119番にご注意！スマホで衝撃検知、夏の行楽でも　誤通報、都内で7割超・東京消防庁
• 投げた衝撃だけで反応してしまうので大変そう...

TurborepoがGoからRustに移植している話

• How Turborepo is porting from Go to Rust
• そもそも何でGoからRustに移行するんだっけ？の記事
• エコシステム強い？開発者が嬉しい？

MetaのQuest Pro生産終了の話

• Meta、「Quest Pro」の生産終了か--次期モデルの開発も中止
• プロジェクト終わるだけで事業は続きそう？

Dan氏のMeta離脱について

• ツイート
• MetaやめるだけでReactチームには残りそう

React 18のパフォーマンス改善について

• How React 18 Improves Application Performance
• React 18以前はメインスレッドでall-or-nothingな処理をしていた
• React 18以降はレンダリングするコンポーネントに優先度つけて並列に処理している感じ
• この仕組みを理解した上でuseTransitionを使っていきたい

TypeChat

• https://github.com/microsoft/TypeChat
• シュッと TypeChat を使ってみたのだ
• プロンプトの結果が普通は自然言語だがスキーマに調整し生成してくれてプログラムで扱いやすくなる
• どっかで試しに使いたい

scrcpy(スクリーンコピー)

• https://github.com/Genymobile/scrcpy
• PC/MacからAndroid端末を操作できるツール「scrcpy」が音声転送に対応
• androidのミラーリングどうしてる？
• Vysor使うのが多数だけどこれでできるよ

ReactNative等のオープンソースのみでビデオ通話アプリ

• ツイート
• OSSだけで作れるのすごい
• 作りたい…（かも？）

ナレッジワークさんのレポ

• Encraft #4「React/Next.js 最前線」開催レポート
• Next.jsの展望だったりを話してた
• React Query（TanStack Query）のsuspenseオプションを活用してる

Angularも捨てたもんじゃないぞ

• 実は進化してる！Angularを使う理由をお話します
• バージョンのアップグレードが手厚い
• メンテコストが低め

ペチコン福岡のアーカイブ

• これとか話題になってたっぽい
• YouTubeにアーカイブ配信あったよ。見てねー

Expo公式のadmobライブラリがなくなったよ

• Migrate expo-ads-admob to react-native-google-mobile-ads
• ReactNative用のライブラリを突っ込む必要がある
• Expoも公式で色々ネイティブのライブラリ管理するの大変だよね

Push Notifications Console

• Introducing the Push Notifications Console
• これでぽちぽちでiOSのPush通知テストできる

visionOS SDK

• visionOS SDKが利用可能に
• Vision Proほしい

Vite 4.4

• ツイート
• Lightning CSSに対応（ビルド速いやつ、Rustで書かれてる）
• https://lightningcss.dev/

shadcn/ui

• https://ui.shadcn.com/
• ReactのUIコンポーネント生成ライブラリ
• スタイルのあたったコンポーネントコードが生成されるので、カスタマイズできる
• ヘッドレスUIの実装が含まれる
• RadixやTailwindには依存してる感じ

エッジで輝くフロントエンド（cloudflareを使う話）

• https://speakerdeck.com/chimame/etuzidehui-kuhurontoendo
• 画面RemixでAPIはHono
• おしゃれな構成

Xamarin終了

• https://forest.watch.impress.co.jp/docs/news/1509919.html
• Flutterが出る前はReact Nativeか？Xamarinか？だったよなー
• 2024年に終了

Wasmer Edge

• https://www.publickey1.jp/blog/23/webassemblywasmer_edge.html
• WebAssembly系の話むずいよね

Maestro

• https://speakerdeck.com/kgmyshin/uitesutohamoumaestrodeiinokamosirenaihua
• モバイルアプリのE2Eが爆速でできる
• 案件で使い始めたよ

ECMAScript Explicit Resource Management

• https://github.com/tc39/proposal-explicit-resource-management
• cleanup処理が要らなくなりそうなやつ

Vercel AI SDK

• Introducing the Vercel AI SDK
• AIアプリ系のUIとかを簡単に作れるSDK
• React/SvelteでAIアプリが簡単に作れるようになりそう

REACT.gg

• https://react.gg/
• 前にチームで話題にあがったけど、今度リミテッドベータ版がリリースされた
• Reactのチュートリアル的なやつ
• React以外にも色々なコースがありそう
• 値段もなかなか（値段ページ消えた？）

メルカリのデザインシステムの話

• https://note.com/mercari_design/n/na159427a730f
• デザインをAndroidとiOSで合わせたい話
• 合わせない方がいいこともあるよね
• 意図的にOSごとのUI差分を採用した
• どのタイミングデザインシステムを最適化する？