[レポート] What’s New in LINE Front-end Framework #linedevday_report

LINE Front-end Framework (LIFF) は、これまでLINEの中で様々なサービスで活用され新たなユーザー体験を提供してきました。新たに提供される LINE Front-end Framework v2 (LIFF v2) によりLIFFを使ったアプリケーションの可能性をさらに広げることが可能となります。本セッションでは、LIFFで追加される新たな機能と実装面でのノウハウ、事例、今後の展望についてお話しします。

スライド

レポート

LIFFとは
- Web application platform
- LINEサービスとインテグレーションされている
- ユースケースに応じて決定する、画面サイズが3つ用意されている
- QUICK GAMEはLIFFでできている
- In chat appがスタート（GIFを検索、送信するアプリ）
Advantage of LIFF v1
- ネイティブアプリケーションとの比較
  - HTML, CSS, JavaScriptで開発できる
  - アプリケーションサーバーがなくても開発できる
- インストールが不要
  - LINE上で動く
- LINEと統合できる
  - メッセージ、プロフィールなど
LIFF v2
- UX/DX（Developer Experience）にフォーカス
- モダンブラウザでのサポート
  - PCからでもLIFFが利用できる
  - LINEログインとの統合により基本的なAPIサポートが可能となったのでデバッグもしやすくなった
- 初期化した場合
  - v1はエラーになるが
  - v2は認証されていない場合はWebのLINEログインページヘ遷移する
Demo
Deeplink
- HTTPS Schemeのリンクがサポートされた
- v1は、LINEスキーマ（line://）だったがv2はHTTPS（https://liff.line.me/~~）に
- パスやクエリパラメータも認識できるようになった→ECサイトの詳細ページのシェアが可能のなった
Open ID Connect
- 管理コンソールでの変更でopenidが取得可能
Bot Link
- LIFF起動時に友だち追加を可能になる
LIFF v2 JS SDK
- Typescript
- Definition file
- チーム開発や型定義によるDXの向上
- npmモジュール化
New Feature
- QR Code Reader
  - チケットの読み取りなどで利用できそう
- ShareTargetPicker
  - LIFF v1では開いてるチャットへ送信できたが友だちや別のチャネルにメッセージ送信が可能になる
- 他にもログイン関連のメソッド追加やUser-Agentから取得する情報などが追加された
Advantage
- 通常のフロントエンド開発と同様になる
- HTTPS Schemaによりモダンブラウザでも使える
- LINEサービスの統合追加によりさらに連携できるようになった
事例
- LINE x 乗り換え案内（ジョルダン）
  - 乗換検索し友だちにシェアできる
  - 新しいLIFF View typeで機能を提供
- LINE MINI app
  - LIFF Platform technologyを利用しているが細かいところは追って公開
Future
- LUI
  - Web Component
  - Built-in LINE Design System
- Load Map
  - UX/DX
  - Fintech
  - AI

まとめ

日頃からたくさん利用させていただいているLIFF SDKの最新アップデートを再度確認できました。LINE MINI appもあるので、今後もどんどん機能拡張されるのが楽しみです。個人的にnpmモジュール化/Pay対応に期待しています！

[レポート] What’s New in LINE Front-end Framework #linedevday_report

What's New in LINE Front-end Framework

スピーカー

セッション概要

スライド

レポート

まとめ

関連記事

AWSで探す

注目のテーマ

プロダクトやサービスで探す

特集やシリーズから探す

EVENTS