Upgrade to Pro — share decks privately, control downloads, hide ads and more …

20210801 - build an mini-app ecosystem for LINE developers

20210801 - build an mini-app ecosystem for LINE developers

LINE Sponsor Booth LIFF session by Jason Lee @ COSCUP 2021
Event page: https://coscup.org/2021/zh-TW/venue

2102a6b8760bd6f57f672805723dd83a?s=128

LINE Developers Taiwan
PRO

August 01, 2021
Tweet

Transcript

  1. LINE Front-end Framework (LIFF) LINE Kyoto UIT 1 李致賢 (a.k.a

    Jason Lee) 2020/08/01 build an mini-app ecosystem for LINE developers
  2. Jason Lee LINE Frontend Engineer • Base on Japan/Kyoto •

    Present LIFF developer • Love Typescript/React…etc
  3. 01 02 03 04 05 06 Today’s Agenda Brief introduction

    for LIFF framework Why LIFF? Use case and examples Challenges Future of LIFF Q & A
  4. • LINE Front-end Framework • Web application • Javascript SDK

    (Typescript supported) • Integration with LINE platform • Authentication • Interaction API with LINE • Get user profile, send a message…etc • In-App mode / external browser mode Brief introduction for LIFF framework
  5. • LIFF 推出前的歷史 • 誰在使⽤ LIFF? • LINE Family Service

    • LINE Mini App • ⼀般開發者 • 簡單易⽤ • 直觀,簡潔的 API 設計 • 開放與安全性 • 減少 Native bridge 的使⽤ Why LIFF?
  6. • 無須安裝,立刻使⽤ • 使⽤ Web 開發 • 想要與 LINE App

    整合 • 取得使⽤者基本資訊 Use case
  7. • 申請 LINE Channel,建立 LIFF App • https://developers.line.biz/ • Install

    JS SDK • Via NPM • Via CDN • LIFF Starter • https://github.com/line/line-liff-v2-starter Example
  8. • 跨平台 • LINE App • iOS • Android •

    External Browser • Chrome • PC / Mobile • Safari • PC / iOS Challenges
  9. • Technical stack • Typescript • 只⽤到為數不多的 library • Jest

    • Webpack • CircleCI • 公司內部的 Analytics tool Challenges
  10. • Developer experience • Enhance supporting for Typescript • Static

    type checking • Hint from Typescript LSP Challenges
  11. • User experience • Inconsistent UI Design • UI Library

    (LUI) • Bounce rate • Incremental Channel Permission Challenges
  12. Future of LIFF • 提升可維護性 • 改善 QA 流程 •

    改進 unit test 的架構 • Internal OSS • Pluginize • Monorepo • 改善開發者體驗 • Debug Tool • LIFF Mock • LIFF Emulator
  13. Q & A

  14. THANK YOU