Slide 1

Slide 1 text

2019 DevDay Backend Architecture for LINE LP Production Tool > Daisuke Matsushita > LINE Growth Technology Development Department Server Side Engineer

Slide 2

Slide 2 text

LINE LP Production Tool = LPGen

Slide 3

Slide 3 text

Agenda > Self Introduction > What’s LPGen From Backend > LPGen Backend Architecture

Slide 4

Slide 4 text

Self Introduction

Slide 5

Slide 5 text

About me Daisuke MATSUSHITA LINE Growth Technology Co., Ltd. Developer Department Development Center Server Side Engineer Self Introduction

Slide 6

Slide 6 text

What’s LPGen From Backend

Slide 7

Slide 7 text

What’s LPGen From Backend > Landing Page Generator > developed and operated by LINE Growth Technology Co., Ltd. > In-house service in LINE group LPGen Overview

Slide 8

Slide 8 text

What’s LPGen From Backend Screenshot of Making LP

Slide 9

Slide 9 text

What’s LPGen From Backend LPGen’s Good Points Only Frontend … ?

Slide 10

Slide 10 text

The Answer Is No!

Slide 11

Slide 11 text

What’s LPGen From Backend LPGen’s Good Points Design Rules/SEO Quick Deploy Simple UI/UX

Slide 12

Slide 12 text

What’s LPGen From Backend LPGen’s Good Points Backend Contribute Design Rules/SEO Quick Deploy Simple UI/UX

Slide 13

Slide 13 text

LPGen Backend Architecture

Slide 14

Slide 14 text

LPGen Backend Architecture LPGen Using Technology Vue.js Verda Object Storage Spring Boot

Slide 15

Slide 15 text

LPGen Backend Architecture > VOS is an object storage server in Verda. > In LPGen, VOS is used for image files and the place to deploy LP. > Verda is LINE internal private cloud environment. About Verda Object Storage(VOS)

Slide 16

Slide 16 text

Server Models LPGen Backend Architecture Web API Web API LB LB Image VOS LP VOS DB

Slide 17

Slide 17 text

LPGen Backend Architecture > This server proxies requests to the API server. > This server has an authentication module called NSS. > This server returns HTML of LPGen. About Web Server

Slide 18

Slide 18 text

LPGen Backend Architecture > For LPGen login, users can use ID/PW they usually uses.
 → Simple > NSS authenticated a user and add authentication information to requests. > NSS is Single Sign On system for NAVER and its group companies. 
 About NSS

Slide 19

Slide 19 text

API Call Routing LPGen Backend Architecture Authentication Web Server (NSS module) API Server Authorization API Server

Slide 20

Slide 20 text

LPGen Backend Architecture > Only API server accesses the database and VOS. > When users publish LP, this server receives contents of HTML, makes a HTML file and deploy it to VOS. → Quick Deploy > We designed API as RESTful API. About API Server

Slide 21

Slide 21 text

LP Build and Deploy Flow LPGen Backend Architecture API Server ᶃ Client Calls API With LP HTML Image VOS ᶄ Get Image Used in LP LP VOS ᶅ Deploy LP Html File and Image

Slide 22

Slide 22 text

LP View Route LPGen Backend Architecture Reverse Proxy CDN VOS Browser Client

Slide 23

Slide 23 text

LP View Route LPGen Backend Architecture LP Reverse Proxy CDN VOS Browser Client

Slide 24

Slide 24 text

LP View Route LPGen Backend Architecture Caching LP Reverse Proxy CDN VOS Browser Client

Slide 25

Slide 25 text

LP View Route LPGen Backend Architecture SEO Caching LP Reverse Proxy CDN VOS Browser Client

Slide 26

Slide 26 text

LP View Route LPGen Backend Architecture SEO Caching LP Reverse Proxy CDN VOS Browser Client

Slide 27

Slide 27 text

LPGen Backend Architecture > It is high cost that a proxying route is via internet. > We will use not Verda CDN but an internal cache server. > Verda CDN internally uses AWS Cloud Front and Akamai. Future Task

Slide 28

Slide 28 text

Thank You