Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
フロントエンドとバックエンド非同期連携パターンのセッションを見てきた話 / Talk abou...
Search
yayoi_dd
January 29, 2025
Technology
0
97
フロントエンドとバックエンド非同期連携パターンのセッションを見てきた話 / Talk about seeing a session on front-end and back-end asynchronous coordination patterns
弥生株式会社 もくテク
AWS re:Invent 2024 参加報告会(2025/01/29)
https://mokuteku.connpass.com/event/340760/
yayoi_dd
January 29, 2025
Tweet
Share
More Decks by yayoi_dd
See All by yayoi_dd
“お客さま視点”を手に入れろ!! / Get the Customer’s Perspective!!
yayoi_dd
0
100
プロジェクト改善、まずは“ネタ出しの文化”から / Improving Projects Starts with a Culture of Idea Generation
yayoi_dd
0
100
使いにくい仕様を改善した件 / How We Improved a Difficult-to-Use Feature
yayoi_dd
0
110
弥生のQAエンジニア 品質保証活動と今後の課題 / Yayoi QA engineers, Quality assurance activities and future challenges
yayoi_dd
0
150
【弥生】20250130_AWSマルチアカウント運用セミナー登壇資料
yayoi_dd
2
4.8k
Amazon OpenSearchのコスト最適化とZeroETLへの期待 / Amazon OpenSearch Cost Optimization and ZeroETL Expectations
yayoi_dd
1
150
reInventで学んだWebシステム運用のBadDayへの備え方 / How to Prepare for BadDay in Web System Operations Learned at reInvent
yayoi_dd
0
75
AWS reInventで感じた世界に見る生成AIの競争 / Competition in Generative AI as Seen Around the World at AWS reInvent
yayoi_dd
0
80
データの意味を適切に伝えましょう データ可視化のお手本/Conveying the Meaning of Data Appropriately: Exemplary Data Visualization
yayoi_dd
0
110
Other Decks in Technology
See All in Technology
AWS 잘하는 개발자 되기 - AWS 시작하기: 클라우드 개념부터 IAM까지
kimjaewook
0
120
Shirankedo NOCで見えてきたeduroam/OpenRoaming運用ノウハウと課題 - BAKUCHIKU BANBAN #2
marokiki
0
170
リーダーになったら未来を語れるようになろう/Speak the Future
sanogemaru
0
350
能登半島災害現場エンジニアクロストーク 【JAWS FESTA 2025 in 金沢】
ditccsugii
0
160
o11yで育てる、強い内製開発組織
_awache
3
130
Where will it converge?
ibknadedeji
0
200
成長自己責任時代のあるきかた/How to navigate the era of personal responsibility for growth
kwappa
4
300
職種別ミートアップで社内から盛り上げる アウトプット文化の醸成と関係強化/ #DevRelKaigi
nishiuma
2
160
Optuna DashboardにおけるPLaMo2連携機能の紹介 / PFN LLM セミナー
pfn
PRO
2
930
関係性が駆動するアジャイル──GPTに人格を与えたら、対話を通してふりかえりを習慣化できた話
mhlyc
0
130
[Keynote] What do you need to know about DevEx in 2025
salaboy
0
130
多様な事業ドメインのクリエイターへ 価値を届けるための営みについて
massyuu
1
470
Featured
See All Featured
GraphQLとの向き合い方2022年版
quramy
49
14k
XXLCSS - How to scale CSS and keep your sanity
sugarenia
248
1.3M
Templates, Plugins, & Blocks: Oh My! Creating the theme that thinks of everything
marktimemedia
31
2.5k
Let's Do A Bunch of Simple Stuff to Make Websites Faster
chriscoyier
507
140k
Large-scale JavaScript Application Architecture
addyosmani
514
110k
個人開発の失敗を避けるイケてる考え方 / tips for indie hackers
panda_program
114
20k
How To Stay Up To Date on Web Technology
chriscoyier
791
250k
Speed Design
sergeychernyshev
32
1.1k
Design and Strategy: How to Deal with People Who Don’t "Get" Design
morganepeng
132
19k
CSS Pre-Processors: Stylus, Less & Sass
bermonpainter
358
30k
Side Projects
sachag
455
43k
GraphQLの誤解/rethinking-graphql
sonatard
73
11k
Transcript
フロントエンドとバックエンド 非同期連携パターンの セッションを見てきた話 弥生株式会社 木村 風太 2025/01/29
自己紹介 • 名前: 木村 風太 (きむら ふうた) • 職歴: 入社
2年目 • 弥生Nextの会計Nextを開発 • 趣味: 子育て 、 コーヒー
re:Inventで参加したセッション たくさんのセッションに参加しました! • GameDay, Jam • サーバレス • マイクロフロントエンド •
生成AI • アーキテクチャ • セキュリティ
LT内容 • 参加したセッションの紹介 • Asynchronous frontends - Building seamless event-driven
experiences • Youtube (https://youtu.be/uqu7D6q1h34?si=3mXQrdOUwDhFo4yV) • 非同期的に画面更新されるパターン • リアルタイムで画面更新されるための実装例 5+1つ • 会計Nextの紹介
会場風景
非同期的に画面更新されるパターン • リアルタイムのイベント処理 • Polling • サブスクリプション • ブロードキャスト と
point-to-point • 長時間プロセス • プッシュ通知 • Web • モバイル通知
Polling
サブスクリプション
ブロードキャスト と point-to-point
リアルタイムイベント処理の 実装例 5+1つ 1. WebSocket 2. GraphQL 3. Direct to
GraphQL 4. GraphQLを使用しないイベント 5. Fire-and-Forget 6. MQTT
WebSocket
GraphQL
Direct to GraphQL
GraphQLを使用しないイベント
Fire-and-Forget
MQTT
会計Nextの技術スタック フロントエンド • TypeScript • Next.js • ECS Fargate etc...
バックエンド • C#(.NET) • ECS Fargate • Aurora(MySQL)、DynamoDB etc...
会計Nextのアーキテクチャ概要 ※各マイクロサービスのGraphQLスキーマをGateWayに登録 クライアント GraphQL GateWay 仕訳 集計 固定資産 法人決算 …
etc
会計Nextで採用されているパターン • Polling • 銀行の取引データを取り込む処理 • インポート処理 • GraphQLのSubscription処理は 利用していない
• 会計の基本機能を揃えていく段階で 使用する箇所がなかった
まとめ • リアルタイムで画面が更新されるパターンにもいろいろある • 必要に応じて選択しよう
ありがとうございました