Line Liff Patterns
Skill Profile
(Select at least one profile to enable specific modules)
Overview
LINE LIFF (LINE Front-end Framework) enables building web apps that run within the LINE app, with direct access to LINE APIs like profile, share messages, and send messages to chat. This is critical for the Thai market where LINE is the dominant platform.
Why This Matters
- Thailand #1: LINE has 50M+ users in Thailand
- Native Experience: Web apps run seamlessly within LINE
- Rich Features: Access LINE APIs, share, payments
- No App Install: Users don't need to install a separate app
Core Concepts & Rules
1. Core Principles
- Follow established patterns and conventions
- Maintain consistency across codebase
- Document decisions and trade-offs
2. Implementation Guidelines
- Start with the simplest viable solution
- Iterate based on feedback and requirements
- Test thoroughly before deployment
Inputs / Outputs / Contracts
- Inputs:
- LIFF ID from LINE Developers Console
- Channel ID and Channel Secret
- Access Token for LINE Messaging API
- Entry Conditions:
- LINE Developer account
- LIFF app created in LINE Developers Console
- Callback URL configured
- Outputs:
- User profile data
- Access tokens for API calls
- Flex messages for rich content
- Artifacts Required (Deliverables):
- LIFF client implementation
- React hooks and providers
- LINE login backend routes
- Flex message templates
- Acceptance Evidence:
- LIFF app loads in LINE
- Login flow completes successfully
- Profile data retrieved correctly
- Success Criteria:
- LIFF initializes in < 2 seconds
- Login success rate > 95%
- Flex messages render correctly
Skill Composition
- Depends on: LINE Developer account, OAuth 2.0 implementation
- Compatible with: LINE Messaging API, LINE Pay, LINE Beacon
- Conflicts with: Non-LINE authentication systems
- Related Skills: promptpay-integration
Quick Start / Implementation Example
- Review requirements and constraints
- Set up development environment
- Implement core functionality following patterns
- Write tests for critical paths
- Run tests and fix issues
- Document any deviations or decisions
# Example implementation following best practices
def example_function():
# Your implementation here
pass
Assumptions / Constraints / Non-goals
- Assumptions:
- Development environment is properly configured
- Required dependencies are available
- Team has basic understanding of domain
- Constraints:
- Must follow existing codebase conventions
- Time and resource limitations
- Compatibility requirements
- Non-goals:
- This skill does not cover edge cases outside scope
- Not a replacement for formal training
Compatibility & Prerequisites
- Supported Versions:
- Python 3.8+
- Node.js 16+
- Modern browsers (Chrome, Firefox, Safari, Edge)
- Required AI Tools:
- Code editor (VS Code recommended)
- Testing framework appropriate for language
- Version control (Git)
- Dependencies:
- Language-specific package manager
- Build tools
- Testing libraries
- Environment Setup:
.env.example keys: API_KEY, DATABASE_URL (no values)
Test Scenario Matrix (QA Strategy)
| Type |
Focus Area |
Required Scenarios / Mocks |
| Unit |
Core Logic |
Must cover primary logic and at least 3 edge/error cases. Target minimum 80% coverage |
| Integration |
DB / API |
All external API calls or database connections must be mocked during unit tests |
| E2E |
User Journey |
Critical user flows to test |
| Performance |
Latency / Load |
Benchmark requirements |
| Security |
Vuln / Auth |
SAST/DAST or dependency audit |
| Frontend |
UX / A11y |
Accessibility checklist (WCAG), Performance Budget (Lighthouse score) |
Technical Guardrails & Security Threat Model
1. Security & Privacy (Threat Model)
- Top Threats: Injection attacks, authentication bypass, data exposure
2. Performance & Resources
3. Architecture & Scalability
4. Observability & Reliability
Agent Directives & Error Recovery
(ข้อกำหนดสำหรับ AI Agent ในการคิดและแก้ปัญหาเมื่อเกิดข้อผิดพลาด)
- Thinking Process: Analyze root cause before fixing. Do not brute-force.
- Fallback Strategy: Stop after 3 failed test attempts. Output root cause and ask for human intervention/clarification.
- Self-Review: Check against Guardrails & Anti-patterns before finalizing.
- Output Constraints: Output ONLY the modified code block. Do not explain unless asked.
Definition of Done (DoD) Checklist
Anti-patterns / Pitfalls
- ⛔ Don't: Log PII, catch-all exception, N+1 queries
- ⚠️ Watch out for: Common symptoms and quick fixes
- 💡 Instead: Use proper error handling, pagination, and logging
Reference Links & Examples
- Internal documentation and examples
- Official documentation and best practices
- Community resources and discussions
Versioning & Changelog
- Version: 1.0.0
- Changelog:
- 2026-02-22: Initial version with complete template structure
Converted and distributed by TomeVault — claim your Tome and manage your conversions.
1---2name: line-liff-patterns3description: LINE LIFF (LINE Front-end Framework) enables building web apps that run Use when this capability is needed.4---56# Line Liff Patterns78## Skill Profile9*(Select at least one profile to enable specific modules)*10- [ ] **DevOps**11- [x] **Backend**12- [ ] **Frontend**13- [ ] **AI-RAG**14- [ ] **Security Critical**1516## Overview17LINE LIFF (LINE Front-end Framework) enables building web apps that run within the LINE app, with direct access to LINE APIs like profile, share messages, and send messages to chat. This is critical for the Thai market where LINE is the dominant platform.1819## Why This Matters20- **Thailand #1**: LINE has 50M+ users in Thailand21- **Native Experience**: Web apps run seamlessly within LINE22- **Rich Features**: Access LINE APIs, share, payments23- **No App Install**: Users don't need to install a separate app2425---2627## Core Concepts & Rules2829### 1. Core Principles30- Follow established patterns and conventions31- Maintain consistency across codebase32- Document decisions and trade-offs3334### 2. Implementation Guidelines35- Start with the simplest viable solution36- Iterate based on feedback and requirements37- Test thoroughly before deployment383940## Inputs / Outputs / Contracts41* **Inputs**:42 - LIFF ID from LINE Developers Console43 - Channel ID and Channel Secret44 - Access Token for LINE Messaging API45* **Entry Conditions**:46 - LINE Developer account47 - LIFF app created in LINE Developers Console48 - Callback URL configured49* **Outputs**:50 - User profile data51 - Access tokens for API calls52 - Flex messages for rich content53* **Artifacts Required (Deliverables)**:54 - LIFF client implementation55 - React hooks and providers56 - LINE login backend routes57 - Flex message templates58* **Acceptance Evidence**:59 - LIFF app loads in LINE60 - Login flow completes successfully61 - Profile data retrieved correctly62* **Success Criteria**:63 - LIFF initializes in < 2 seconds64 - Login success rate > 95%65 - Flex messages render correctly6667## Skill Composition68* **Depends on**: LINE Developer account, OAuth 2.0 implementation69* **Compatible with**: LINE Messaging API, LINE Pay, LINE Beacon70* **Conflicts with**: Non-LINE authentication systems71* **Related Skills**: [promptpay-integration](file://90-thai-integrations/promptpay-integration/SKILL.md)7273---7475## Quick Start / Implementation Example76771. Review requirements and constraints782. Set up development environment793. Implement core functionality following patterns804. Write tests for critical paths815. Run tests and fix issues826. Document any deviations or decisions8384```python85# Example implementation following best practices86def example_function():87 # Your implementation here88 pass89```909192## Assumptions / Constraints / Non-goals9394* **Assumptions**:95 - Development environment is properly configured96 - Required dependencies are available97 - Team has basic understanding of domain98* **Constraints**:99 - Must follow existing codebase conventions100 - Time and resource limitations101 - Compatibility requirements102* **Non-goals**:103 - This skill does not cover edge cases outside scope104 - Not a replacement for formal training105106107## Compatibility & Prerequisites108109* **Supported Versions**:110 - Python 3.8+111 - Node.js 16+112 - Modern browsers (Chrome, Firefox, Safari, Edge)113* **Required AI Tools**:114 - Code editor (VS Code recommended)115 - Testing framework appropriate for language116 - Version control (Git)117* **Dependencies**:118 - Language-specific package manager119 - Build tools120 - Testing libraries121* **Environment Setup**:122 - `.env.example` keys: `API_KEY`, `DATABASE_URL` (no values)123124125## Test Scenario Matrix (QA Strategy)126127| Type | Focus Area | Required Scenarios / Mocks |128| :--- | :--- | :--- |129| **Unit** | Core Logic | Must cover primary logic and at least 3 edge/error cases. Target minimum 80% coverage |130| **Integration** | DB / API | All external API calls or database connections must be mocked during unit tests |131| **E2E** | User Journey | Critical user flows to test |132| **Performance** | Latency / Load | Benchmark requirements |133| **Security** | Vuln / Auth | SAST/DAST or dependency audit |134| **Frontend** | UX / A11y | Accessibility checklist (WCAG), Performance Budget (Lighthouse score) |135136137## Technical Guardrails & Security Threat Model138139### 1. Security & Privacy (Threat Model)140* **Top Threats**: Injection attacks, authentication bypass, data exposure141- [ ] **Data Handling**: Sanitize all user inputs to prevent Injection attacks. Never log raw PII142- [ ] **Secrets Management**: No hardcoded API keys. Use Env Vars/Secrets Manager143- [ ] **Authorization**: Validate user permissions before state changes144145### 2. Performance & Resources146- [ ] **Execution Efficiency**: Consider time complexity for algorithms147- [ ] **Memory Management**: Use streams/pagination for large data148- [ ] **Resource Cleanup**: Close DB connections/file handlers in finally blocks149150### 3. Architecture & Scalability151- [ ] **Design Pattern**: Follow SOLID principles, use Dependency Injection152- [ ] **Modularity**: Decouple logic from UI/Frameworks153154### 4. Observability & Reliability155- [ ] **Logging Standards**: Structured JSON, include trace IDs `request_id`156- [ ] **Metrics**: Track `error_rate`, `latency`, `queue_depth`157- [ ] **Error Handling**: Standardized error codes, no bare except158- [ ] **Observability Artifacts**:159 - **Log Fields**: timestamp, level, message, request_id160 - **Metrics**: request_count, error_count, response_time161 - **Dashboards/Alerts**: High Error Rate > 5%162163164## Agent Directives & Error Recovery165*(ข้อกำหนดสำหรับ AI Agent ในการคิดและแก้ปัญหาเมื่อเกิดข้อผิดพลาด)*166167- **Thinking Process**: Analyze root cause before fixing. Do not brute-force.168- **Fallback Strategy**: Stop after 3 failed test attempts. Output root cause and ask for human intervention/clarification.169- **Self-Review**: Check against Guardrails & Anti-patterns before finalizing.170- **Output Constraints**: Output ONLY the modified code block. Do not explain unless asked.171172173## Definition of Done (DoD) Checklist174175- [ ] Tests passed + coverage met176- [ ] Lint/Typecheck passed177- [ ] Logging/Metrics/Trace implemented178- [ ] Security checks passed179- [ ] Documentation/Changelog updated180- [ ] Accessibility/Performance requirements met (if frontend)181182183## Anti-patterns / Pitfalls184185* ⛔ **Don't**: Log PII, catch-all exception, N+1 queries186* ⚠️ **Watch out for**: Common symptoms and quick fixes187* 💡 **Instead**: Use proper error handling, pagination, and logging188189190## Reference Links & Examples191192* Internal documentation and examples193* Official documentation and best practices194* Community resources and discussions195196197## Versioning & Changelog198199* **Version**: 1.0.0200* **Changelog**:201 - 2026-02-22: Initial version with complete template structure202203---204> Converted and distributed by [TomeVault](https://tomevault.io/claim/amnadtaowsoam) — claim your Tome and manage your conversions.205<!-- tomevault:4.0:skill_md:2026-04-13 -->