Upgrade to Pro — share decks privately, control downloads, hide ads and more …
Sign up for free

TrainLCD v10リリース記念 TrainLCDを支える技術

Sponsored · Your Podcast. Everywhere. Effortlessly. Share. Educate. Inspire. Entertain. You do you. We'll handle the rest. →
Avatar for Tsubasa SEKIGUCHI Tsubasa SEKIGUCHI
January 23, 2026
Programming
620
1

TrainLCD v10リリース記念 TrainLCDを支える技術

React Tokyo #13 にて発表させていただいたスライドです。

Avatar for Tsubasa SEKIGUCHI

Tsubasa SEKIGUCHI

January 23, 2026

More Decks by Tsubasa SEKIGUCHI

See All by Tsubasa SEKIGUCHI
個人開発基盤をまるごとCloudflareに引っ越して爆速で総合的体験を向上させた話
Avatar for Tsubasa SEKIGUCHI tinykitten
0
210
エンジニアでも捗る デザイナー的思考入門(bitA Edit 新ver)
Avatar for Tsubasa SEKIGUCHI tinykitten
1
570
React Native × GraphQLで TanStack Queryを 選んだ理由
Avatar for Tsubasa SEKIGUCHI tinykitten
0
84
第3木曜LT会 #28
Avatar for Tsubasa SEKIGUCHI tinykitten
0
180
スモールスタートでいこう 自作テレメトリシステム概論
Avatar for Tsubasa SEKIGUCHI tinykitten
0
78
公共交通オープンデータ × モバイルUX 複雑な運行情報を 『直感』に変換する技術
Avatar for Tsubasa SEKIGUCHI tinykitten
0
320
初めてのハッカソンを「紙芝居」で終わらせた話
Avatar for Tsubasa SEKIGUCHI tinykitten
0
86
これならできる！個人開発のすゝめ
Avatar for Tsubasa SEKIGUCHI tinykitten
0
620
今日から使える AI駆動開発のすゝめ
Avatar for Tsubasa SEKIGUCHI tinykitten
1
140

Other Decks in Programming

See All in Programming
動作中のプログラムの中身をリアルタイムに覗く / Realtime Debugger for CSharp with Roslyn
Avatar for Prota prota
1
1.4k
カツオ、ご期待ください
Avatar for saku_totomi suneo3476
0
100
20260914 AIエージェント時代のPlatform Engineering　LLM基盤とプロダクトの責務境界線
Avatar for Taiki Kanzaki kanfab1
7
2.2k
アクセシビリティから考える情報設計
Avatar for high-g high_g_engineer
0
410
thread_parallel_with_free-threaded_Python_and_NumPy.pdf
Avatar for Riku Sakamoto riku_sakamoto
0
360
半永久的に提供し続けられるプライベートクラウドを目指して ― 利用者の認知負荷を抑えるAPI抽象化とハードウェア世代交代の基盤設計
Avatar for Tomofumi Kondo tomokon
0
100
仕様駆動開発による爆速プロダクト開発 / Bakusoku Spec Driven Development
Avatar for Keisuke Kobayashi kobakei
0
140
iOSDC2026登壇資料.pdf
Avatar for RioFujimon riofujimon
0
190
更なる可用性を求めて、5年間運用したKotlinのアプリケーションをGoでリプレイスする話
Avatar for Kensuke Taguchi ken_tunc
0
370
Webの地図
Avatar for Yosuke Furukawa yosuke_furukawa
PRO
6
4.8k
一人だけ、Kiroが静止する日
Avatar for Hideyuki Nagata hideg
0
130
フロントエンドUIフレームワークのこれまでとこれから
Avatar for TOMIKAWA Sotaro ssssota
5
2.9k

Featured

See All Featured
Dominate Local Search Results - an insider guide to GBP, reviews, and Local SEO
Avatar for Greg Gifford greggifford
PRO
0
340
Dealing with People You Can't Stand - Big Design 2015
Avatar for Cassini Nazir cassininazir
367
27k
What Being in a Rock Band Can Teach Us About Real World SEO
Avatar for Ade Holder 427marketing
0
1.1k
Jess Joyce - The Pitfalls of Following Frameworks
Avatar for Tech SEO Connect techseoconnect
PRO
1
420
The MySQL Ecosystem @ GitHub 2015
Avatar for Sam Lambert samlambert
251
13k
Become a Pro
Avatar for Speaker Deck speakerdeck
PRO
31
6.3k
Writing Fast Ruby
Avatar for Erik Berlin sferik
630
63k
Designing for humans not robots
Avatar for Tammie Lister tammielis
254
26k
Fireside Chat
Avatar for paigeccino paigeccino
43
4k
Primal Persuasion: How to Engage the Brain for Learning That Lasts
Avatar for Mike Taylor tmiket
0
490
DBのスキルで生き残る技術 - AI時代におけるテーブル設計の勘所
Avatar for soudai sone soudai
PRO
68
58k
Building Applications with DynamoDB
Avatar for Matt Wood mza
96
7.2k

Transcript

  1. Fullstack Creator Tsubasa SEKIGUCHI TrainLCD v10リリース記念 TrainLCDを支える技術 TrainLCD v10 Release

    Celebration: Technologies Powering TrainLCD 2026.01.23 | React Tokyo #13

  2. 2 2026.01.23 | React Tokyo #13 関口 翼 Tsubasa SEKIGUCHI

    aka TinyKitten / きったん 個人開発者 / クリエイター

  3. TinyKitten タイニーキトゥン aka 関口 翼 個人開発者 / クリエイター 3 2026.01.23

    | React Tokyo #13

  4. TrainLCD スマートフォンで使えるトレインビジョン 鉄道での移動中に迷いそうな時、 電車から降りれるか不安な時 きっとあなたの役に立つはずです 日本全国の鉄道路線で使える 新感覚ナビゲーションアプリ 4 2026.01.23 |

    React Tokyo #13

  5. 5 2026.01.23 | React Tokyo #13 縦画面対応 ストアリリース を含む TrainLCD

    v10アップデート
 しました！ 縦画面表示・プリセット機能 より高速になった経路検索をぜひお手元で お使いください。

  6. TrainLCDとは？ What is TrainLCD? 6 2026.01.23 | React Tokyo #13

  7. デザイン・実装・インフラ・運用… 一貫してほぼ一人で 開発をしています 割と使われています 毎日400〜500人くらいの ユーザーが使用しています ニッチな分野だからこそ 公共性の高いデザインを心がけて 設計されています 7

    2026.01.23 | React Tokyo #13 移動をちょっと 便利にするアプリ 作っているのは

  8. バックエンドの技術スタックは APIは基本的にRust BFFにはNode.jsを使用 SNSシェア用画像等 デザインの制作は Figmaを使用 フロントエンドの技術スタックは 基本的にReact Native 一部機能にSwift/Kotlinを使用

    8 2026.01.23 | React Tokyo #13 React Nativeなど モダンな技術や ライブラリを採用 技術スタックについて

  9. 9 2026.01.23 | React Tokyo #13 完全趣味なので 無料で配信中 TrainLCDを使ってみよう https://trainlcd.app

  10. 10 2026.01.23 | React Tokyo #13 v10の設計思想 Design philosophy of

    v10

  11. 11 2026.01.23 | React Tokyo #13 操作系の画面を 縦向き画面に 対応しました 直近の大改革(v10)

    旧操作系画面 「直感的に使い方がわからない」が大きな課題だった

  12. 12 操作系の画面を 縦向き画面に 対応しました 直近の大改革(v10) 2026.01.23 | React Tokyo #13

    新操作系画面 デザインを一新、スマホが縦向きでも使用可能に

  13. 13 操作系画面のデザインを再設計 デザインを先にFigmaで整理し、 縦画面対応UIを円滑に実装 パフォーマンスの最適化 BFFを別に用意し、上流をキャッシュ gRPC APIをGraphQL APIに変換 もはや鉄道以外にも対応

    東京都交通局が提供している GTFSの都営バスデータでバス対応 2026.01.23 | React Tokyo #13 今回の改修の 工夫ポイント 縦画面対応の哲学

  14. 14 2026.01.23 | React Tokyo #13 v10の実装ポイント Implementation episode of

    v10

  15. 2026.01.23 | React Tokyo #13 15 最初にFigmaで デザインを 整理したことにより、 開発が円滑化

    ポイント1 デザインファースト

  16. 2026.01.23 | React Tokyo #13 16 Figma Makeで React.jsで動く プロトタイプも

    作れる Figmaで良かった点 React.jsのコードを自然言語で生成できる

  17. 過度の期待はしないほうがいいかも？ 2026.01.23 | React Tokyo #13 17 Figma Makeや Figma

    MCPは 現状、再現度が あまり高くない Figmaで苦労した点

  18. 2026.01.23 | React Tokyo #13 18 BFFを新規開発し、 KVでキャッシュ、 gRPC APIを

    GraphQL APIに変換 ポイント2 パフォーマンス最適化 Cloudflare Workers + KVを使っています

  19. 2026.01.23 | React Tokyo #13 19 エッジでの処理 高パフォーマンス 待機コストゼロ Cloudflareで良かった点

    パフォーマンスが高く、安価に使える

  20. 2026.01.23 | React Tokyo #13 20 CPU時間制限 ベンダロックイン Wrangler設定の
 管理

    Cloudflareで苦労した点 制限が厳格なため、重い処理には不向き

  21. TrainLCD v10の都営バス対応(β) 2026.01.23 | React Tokyo #13 21 CC BY

    4.0のGTFS 都営バスデータを 試験的に導入 ポイント3 バス対応への挑戦

  22. 2026.01.23 | React Tokyo #13 22 簡単にDL可能 事業者公式データ GTFSで良かった点 標準的なバス情報フォーマット

  23. 実際の停車順と違うバグが残っている 2026.01.23 | React Tokyo #13 23 データが非線形 バックエンド必須 必要なデータが


    存在しないケース GTFSで苦労した点

  24. 2026.01.23 | React Tokyo #13 まとめ Conclusion 24

  25. デザインの強みを感じよう UI/UXは重要！ 個人開発でも意識しよう 0.4秒の壁(ドハディの閾値) ユーザーは案外待ちません パフォーマンスも意識しよう チャレンジしよう 新しい視点や発想は、 マンネリ化から個人開発を救う 2026.01.23

    | React Tokyo #13 25 生成AIで誰でも アプリを作れる時代 価値と発想で 生き抜いていこう まとめ

  26. ご清聴ありがとうございました！ Thank you for listening! 2026.01.23 | React Tokyo #13

    Fullstack Creator Tsubasa SEKIGUCHI