시종설_최종.pptx

시장조사
01
Webtoon Integration Platform
Webtoon Integration
Platform
2022 1학기 산업경영공학과 졸업발표
201801387 김한나
201801395 안태현
201701387 용길한
201801404 조수빈
시스템 종합 설계 프로젝트
일단 해보조

목차 a table of contents
01 프로젝트 배경 및 개요
02
03 프로젝트 상세
04 Demo & Plan
비즈니스 모델

플랫폼 PV 기반 순위
1 카카오웹툰 2
2 네이버웹툰 1
3 카카오페이지 4
4 투믹스 5
5 버프툰 8
6 탑툰 3
7 포스타입 7
웹툰 플랫폼 분석
웹툰 산업 규모 추정(단위: 억원)
Option
1) 한국 콘텐츠 진흥원
Market Trend
3,799
4,663
6,400
10,538
2019
2018
2017
2020
웹툰 산업의 매출액 규모는 약 1조538억원으로 전년대비 64.6% 증가했다.
웹툰 시장은 계속 커질 것으로 예상된다.
시장조사
01

특징
검색을 위한 키워드
존재
타 플랫폼 웹툰 작품 제공 키워드에 적합한 작품 추천
리디북스
Ridibooks
키워드 카테고리를 통한 사용자 취향
맞춤 작품 추천 서비스 제공
X X O
네이버웹툰
Naver webtoon
다양한 작품을 제시하는
전통적인 웹툰 플랫폼
X X X
마이셀럽스
Mycelebs
AI 기반 취향 검색 및 추천 솔루션 기업
여러 분야에 대한 검색&추천을 제공
X O X
다음 – 스마트 앤서
Smart Answer
사용자의 단답형 질문에 대한 답변을
통한 작품 추천 서비스 제공
X O O
키워드를 통해 다양한 플랫폼에 존재하는 웹툰을 사용자 기호에 맞게 검색 가능한 ‘웹툰 통합 검색 플랫폼’
Differentiation
웹툰플랫폼현황및실태
01

비즈니스모델
02

03
Architecture

03
Development – Frontend
 Axios 등의 다양항 라이브러리와 호환이 가능하다.
 화면 구성을 Component로 나눠서 구성하여 재사용 및 확장에 용이하다.
 Webpack이 코드의 페이지나 함수 모듈화를 통해 압축시켜 랜더링이 필요한 데이터 서빙을 빠르게 하고 자주 사용하는 기능들을 만
들어 사용한다.
 데이터 변경 시 Virtual Dom을 변경한 후 변경 된 부분만 실제 DOM에 적용 → 랜더링 시간 단축으로 사용자가 데이터를 더 빠르게
접근할 수 있다.
 창의 크기가 변하면 그에 따른 디자인이 자동으로 변경되고 휴대폰, 컴퓨터 어떤 환경에서든 접근 용이한 반응형 디자인으로 클라이
언트의 화면 접근성이 좋다.
REACT
사용자 접근성이 용이하고 호환성 및 코딩의 편의성이 뛰어난 REACT를 사용하였다.

03
Development - Backend
Backend
• 가볍고 상대적으로 많은
코드를 필요로 하지 않아
편리하다.
• MVC 패턴을 통한 API 관
리가 용이하다
• ORM을 이용한다.
• Main Logic?
Django
 Index를 저장
→ 검색 성능이 좋음
 한글 형태소 분석 가능
Elastic
 이미지를 저장
AWS S3 bucket
 NoSQL로 JSON 형식의
데이터를 저장
 데이터 형식에 규제받지
않고 저장가능
Mongo DB
웹툰 이미지와 작품 소개글과
같은 다양한 형식의 데이터를
한번에 관리

03
Development –
Backend(Django)
객체지향 프로그래밍은 클래스, 관계형 데이터 베이스는 테이블을 사용하여 불일치가 발생한다.
ORM은 객체 간의 관계를 바탕으로 SQL을 자동으로 생성해 객체 모델과 관계형 모델의 불일치를 해소한다.
ORM(Object-Relational Mapping)
 객체지향 코드를 이용해 직관적으로 로직에 집중하여 개발 가능
 재사용성 및 유지보수 간편화
 DBMS 종속성을 줄여줌
ORM(Object-Relational Mapping)을 이용하는 장고를 활용하여 객체 모델과 관계형 모델의 불일치를 해소하였다.
동적 데이터를 서빙하는 django를 통해 상황에 맞는 데이터를 요청 및 응답할 수 있다.
같은 페이지임에도 다른 데이터가 필요할 수 있다. 이때, Django 서버에 데이터를 요청하면 상황에 맞는 데이터를 요청 및 응답한다.
동적 데이터 서빙[json]

03
Development – Backend(Elastic)
mongoDB의 데이터를 입력받아 기존 [id : data]관계의 데이터를 index로 저장하여 검색에 최적화된 구조를 갖춘다.
Elasticsearch
 특정 키워드에 대한 검색의 검색 성능을 높임
키워드에 대한 검색 성능을 높이는 Elasticsearch를 이용하여 Nori 분석기를 통해 한글 데이터를 형태소 단위로 분리하여
유의미한 데이터를 구분하여 분석하기 위해 Elasticsearch를 사용하였다.
Elasticsearch에서 사용가능한 한글 형태소 분석기로 한글 데이터에 대하여 Nori 토큰을 통해 한글 데이터를 형태소 단위로
분석한다.
Nori
 한글 데이터를 형태소 단위로 분리하여 유의미한 데이터를 구분하여 분석

03
Development – DevOps
HTTP 통신
 Web Server
 정적 데이터 서빙
 react build를 통한 랜더링 최적화
NGiNX
 Wisgi communication
 gunicorn  동적 데이터 서
빙
 Wisgi 통신
gunicorn
 REST API 표준 가이드라인
 복수형 사용
 _(언더바) 대신 -(대시) 사용
 Swagger를 통한 협업 용이

03
REST(ful) API
API 문서화: Swagger
Rest API 서버
 Rest란 네트워크 상에서 Client와
Server 사이의 통신 방식 중 하나
 HTTP URI(Uniform Resource
Identifier)를 통해 자원(Resource)을 명
시
 HTTP Method(POST, GET, PUT,
DELETE)를 통해 해당 자원에 대한
CRUD Operation을 적용하는 것을
의미한다.
URL 설계
백엔드 서버로 요청을 보낼 때,
미리 정의해둔 URL 주소로 요청을 보내야 함
 Swagger 문서를 이용하여 백엔드 API를 문서화할 수 있다.
 프론트 엔드 개발자가 참고하여 개발할 수 있다.
 적용하기 쉽고, 테스트하기 쉽다.
GET
PUT
POST
DELETE
/users
/users/51

03
 각종 HTTP 헤더 조작 가능
 GET, POST, PUT, PATCH, DELETE등 다양한 HTTP 메소드 지원
 Swagger API import 가능
Postman을 이용하여 간단한 API 테스팅 가능
Postman

03
 CRUD
Create Read
Update Delete

03
Development – Distribution
- Github
- 협업 용이
- 상태 관리
- 배포 용이
Docker-compose
- 독립된 개발환경
- 각 서버 컨테이너화
- AWS Lightsail
- 배포 환경 구축
- Docker
- 서버를 컨테이너화
 독립된 개발환경
- 통일된 개발 환경
 협업 용이

03
Development – Automation
 웹툰은 대부분 하루 주기로 변경 사항이 생김
 변경 시간마다 크롤링의 필요성이 느껴짐
 데이터베이스에 사용자가 요청을 보낸 시간을
기록
 새로운 요청의 시간이 마지막으로 요청한 시간
보다 하루가 지나있으면 크롤링을 하도록 구성

04
Demo

04
Plan
댓글/게시판 기능
웹툰에 대한 댓글 기능 및
게시판 기능을 통해
다양한 플랫폼의 작품에 관한 의견을
한 곳에서 교환할 수 있다.
웹툰 추천 기능
작품 추천을 통해 다양한 장르로
세분화 된 작품을
사용자의 니즈에 맞게 추천해주어
인지도가 낮은 플랫폼의 노출도를 높여
신규 기업의 진출 가능성을 높일 수 있다.
웹툰 원작의 다른 콘텐츠 IP 소개
해당 웹툰을 원작으로 하는 새로운 IP로
확장되었을 시 추가 정보를 제공한다.

시종설_최종.pptx

Empfohlen

Empfohlen

Weitere ähnliche Inhalte

Ähnlich wie 시종설_최종.pptx

Ähnlich wie 시종설_최종.pptx (20)

시종설_최종.pptx