네이버 웹툰
- 제작 목적 : 실제 서비스 되고 있는 서비스를 제작함으로써 실사용자가 필요로 하는 기능을 인지 및 학습한 기술 적용
- 역할 : 기획, 풀스택, 문서화
- 제작 기간 :
2024.02.19 ~ 2024.05.29
| 로그인 | 회원가입 |
|---|---|
| 웹툰 랭킹 |
|---|
순위 기준: 가장 최근에 등록된 총 10개의 회차에 받은 '좋아요' 수를 합산한 값을 기준으로 매겨집니다.별점 대신 '좋아요': 1~10점의 점수를 매길 수 있는 별점 대신, '좋아요'을 사용하여 독자들이 작품을 평가하는 것이 아닌 응원하는 마음이 담기도록 기획했습니다.최신 10개의 회차: 가장 최신 10개의 회차를 기준으로 삼아 언제든지 새로 등록된 웹툰이나 최근 들어 인기를 얻게된 웹툰도 순위에 오를 수 있도록 기획하였습니다.자동 업데이트: 웹소켓을 사용하여 별도의 새로고침없이 일정한 시간에 자동으로 업데이트됩니다.
| 웹툰 랭킹 표시 | 업로드 표시 |
|---|---|
- 상승 또는 하강한 작품에는 각각 빨간색 ▲, 파란색 ▼ 표시됩니다.
- 회차가 업로드될 경우 UP 글자로 표시됩니다.
| 사용자 맟줌 장르 필터 |
|---|
- 홈화면에서 원하는 장르의 웹툰을 고를 수 있습니다.
[사용자 스토리] 로맨스, 일상 웹툰을 좋아하고, 스릴러 웹툰을 무서워하는 독자로서, 스릴러 웹툰은 숨기고, 로맨스, 일상 웹툰만 보고싶다.- 사용자가 원하는 웹툰만을 노출시킴으로써 홈화면에서의 거부감을 제거하도록 기획했습니다.
| 신규 작품 등록 |
|---|
- 썸네일 이미지 등 입력 양식을 채운 후 등록 버튼을 클릭합니다.
- 등록된 웹툰은
도전만화에 노출됩니다.
| 신규 회차 등록 (1) |
|---|
회차 번호: 등록할 작품 선택 시 회차 번호는 자동으로 입력됩니다.회차명,대표 이미지,원고로 사용될 이미지들을 업로드합니다.
| 신규 회차 등록 (2) |
|---|
미리보기: 업로드한 이미지들을 확인할 수 있습니다.이미지 이동 버튼: 이미지를 선택한 후 4가지 이동 버튼(맨위,위,아래,맨아래)을 통해 이미지의 순서를 변경할 수 있습니다.전체 미리보기: 이미지들을 하나로 이어붙인 최종 원고를 확인할 수 있습니다.- 확인 버튼을 통해 최종적으로 회차를 업로드합니다.
| 페이징 |
|---|
| 메뉴바 트랜지션 |
|---|
원고 내부 진입: 자동으로 메뉴바가 사라집니다.원고 내부: 화면을 클릭 시 메뉴바가 나타나거나, 사라집니다.원고 밖: 자동으로 메뉴바가 나타납니다.
| 웹툰 관람 |
|---|
- 다음의 4가지 관련 기능을 제공합니다.
목차 미리보기스크롤 맨 위 / 맨 아래 이동 버튼메뉴바 트랜지션좋아요
| 댓글 등록 |
|---|
로그인후 댓글을 등록할 수 있습니다.BEST 댓글: 가장 많은 '좋아요'와 가장 적은 '싫어요'를 받은 상위 4개의 댓글은 BEST 댓글로 등록됩니다.
| 댓글 삭제 |
|---|
- 본인이 작성한 댓글의 한해서
삭제 메뉴 버튼이 활성화됩니다.
| 댓글 좋아요, 싫어요 |
|---|
- 댓글에
'좋아요'또는'싫어요'를 통해 반응을 남길 수 있습니다.
| 대댓글 등록 | 대댓글 삭제 |
|---|---|
댓글의 댓글을 등록 및 삭제할 수 있습니다.- 대댓글 또한
'좋아요','싫어요'을 통해 반응을 남길 수 있습니다.
| 요일별 웹툰 |
|---|
| 장르별 웹툰(도전만화) |
|---|
| 검색 |
|---|
작가 이름또는작품 이름으로 검색할 수 있습니다.
| 프로필 이미지 변경 |
|---|
프로필 이미지또는사용자 정보를 변경할 수 있습니다.
| 자동 로그아웃 |
|---|
- 일정 시간동안 미사용시
세션이 만료되어 자동으로로그아웃됩니다.
- HTML5, CSS3, ES6
- Vue
2.6.14 - Vuex
3.6.2 - Vue-router
3.5.1 - axios
1.6.7 - eslint
7.32.0, prettier2.4.1 - sockjs
1.6.1
- Java
17 - SpringBoot
3.2.3 - Hibernate
- Gradle
- MySQL
8.0.36
- IntelliJ
- VSCode
- Github
- Figma
- erdcloud