Book! 빠지다 - IoT 책갈피를 이용한 독서 습관 형성 서비스(README.md)

🗓️ 프로젝트 일정

일정: 2023년 7월 10일 - 2023년 8월 18일 (6주)

🙂기획 배경

저희 서비스는 바쁜 일상과 미디어의 즉각적인 즐거움으로 성인 독서율이 하락하는 현상에 주목했습니다. 대부분의 현대인들이 독서의 중요성을 인지함에도 불구하고 그 습관 형성에 어려움을 겪고 있습니다. 'BOOK!빠지다' 프로젝트는 이러한 상황을 인지, 페이지 단위로 간편하게 독서 기록을 남기고 독서를 지속할 수 있는 사용자 중심의 서비스를 제공하자는 목표에서 출발했습니다. 기존 어플들의 '권' 단위 기록을 극복하고 페이지 단위를 중심으로 사용자들 독서 습관을 형성하는데 도움을 주며, 특히 IOT 책갈피를 통해 기록 행위를 편리하고 매력적으로 느낄 수 있는 방법을 제시하면 어떨까 라는 아이디어에서 시작한 서비스입니다.

🐳서비스 개요

“IoT 책갈피를 이용한 독서 습관 형성 서비스, BOOK!빠지다”

‘BOOK!빠지다’는 사용자가 독서 습관을 형성하는 것을 돕는 새로운 방식의 서비스로, IoT(사물인터넷) 기술을 활용한 스마트 책갈피를 제공합니다. 이 스마트 책갈피는 조도 센서와 압력 센서로 구성되어 있어 사용자가 이 책갈피를 이용하여 책을 읽는 행위만으로 독서 시점 및 진행율 데이터를 수집하고, 이를 기반으로 사용자의 독서 기록(히스토리)을 자동으로 생성합니다. 더불어 수집된 데이터를 활용하여 다양한 통계 정보를 제공하고, 독서 습관을 리마인드하는 알림 서비스를 제공합니다.

👩‍👧‍👦타겟층 및 목표

타겟층

바쁜 일상으로 독서에 시간을 내기 어려운 직장인 및 학생
책을 사랑하지만 독서 기록을 효과적으로 관리하고 싶은 사람

목표

책을 읽고자 하는 사람들을 대상으로, 독서를 더욱 편하고 재밌게 기록할 수 있는 서비스를 제공하여 독서의 즐거움을 극대화하고자 하는 것이 목표입니다. 책을 읽게 만들기보다는 책을 읽기 시작한 사람들이 지속적으로 독서를 유지할 수 있도록 도움을 주고, 그 독서 데이터를 분석하여 새로운 인사이트와 가치를 창출하는 것을 목표로 합니다.

🎇서비스 화면 및 기능소개

1. 로그인/로그아웃 화면


로그인 화면	로그아웃 화면

오른쪽 상단 햄버거 메뉴를 누르면 로그아웃과 회원 정보 수정이 가능합니다.

2. 닉네임 변경


닉네임 수정 화면	닉네임 수정 완료 화면	닉네임 변경 실행화면
닉네임을 수정 할 수 있습니다.	변경한 이름인 북!빠지다 확인 가능

3. 메인 페이지 및 책갈피 튜토리얼


메인 화면	책갈피 튜토리얼 실행화면
위에서 부터 책갈피 ON/OFF 상태표시(고래 아이콘), 블루투스 연결/미연결 표시, 등록된 책 표시 를 나타냅니다.	책갈피를 처음 이용하는 사람들을 위해 책갈피 튜토리얼을 볼 수 있습니다.

4. 블루투스 책갈피 연결


책갈피 미연결 화면	페어링 과정 실행 화면
	블루투스 책갈피를 연결하기 위해서 페어링 중입니다. 페어링을 최초 1번만 실행하면 됩니다.

5. 블루투스 책갈피를 이용한 자동 독서 기록


책을 읽고 있지 않을 때 화면	책을 읽고 있을 때 화면
연결 이후, 책갈피가 책에 들어가 있을 때(책을 읽고 있지 않을 때) 모습입니다.	연결 이후, 책갈피가 책에서 빠져 있을 때(책을 읽을 때) 모습입니다.

6. 자동 독서 기록과 완독 축하 컨페티


책갈피 이용한 책 기록 실행 화면	완독시, 축하 컨페티 실행 화면
책갈피를 이용해서 자동으로 독서 기록 생성하기	완독 버튼을 눌렀을 때의, 화면입니다

7. 책 등록하기(3가지 방식)


읽을 책 등록 화면
읽을 책 등록은 3가지 방식으로 가능합니다. (검색, 바코드, 기존 책장)

8. 책 등록 - 저자 및 제목 검색으로 등록


책 검색 화면	책 검색하여 등록 화면	책 검색 실행화면

9. 책 등록 - 바코드 촬영 등록, 기존 책장 등록


바코드 촬영 화면	바코드로 인식된 책 등록 화면	책장에서 등록 화면

10. 나의 책장 : 책 상태 분류/정렬 기능


책 상태에 따른 분류 화면	여러 기준에 따른 책 정렬 화면
책장에서는 이때까지 읽은 책, 읽고 있는 책 등을 확인할 수 있습니다. 책을 클릭하면 각각의 책에 대한 기록을 볼 수 있습니다.	책은 여러 기준으로 정렬할 수 있습니다. 등록순, 저자순, 제목순, 진행률 순으로 정렬 가능합니다.

11. 책 상태 관리


읽는 중인 책 상세 화면	읽기 중단인 책 상세 화면	읽는 완료인 책 상세 화면

각각의 책의 상태는 총 3가지로, 현재 읽고 있는 책(파랑), 읽다 멈춘 책(노랑), 다 읽은 책( 빨강)입니다.

12. 책 상세 화면 : 책기록 조회 수정 및 삭제


책 기록 화면	책 기록 수정 실행 화면
책갈피를 이용해서 자동으로 쌓인 책 기록들이 쌓여 있는 모습을 볼 수 있고, 내가 등록한 한줄평을 살펴보고, 수정할 수 있습니다.

13. 독서 통계


독서 통계 캐릭터 화면	독서 통계 기록 화면	독서 통계 실행화면
나만의 독서 통계를 확인할 수 있습니다. 캐릭터 유형은 총 8가지 유형입니다. 통계에서는 독서와 관련된 여러 통계를 확인할 수 있습니다.	스크롤을 내리면 지난주와 비교해서 얼만큼 많이 읽었는지 그래프를 통해서도 확인 가능합니다.

14. 독서 리마인드 알림


독서 알림 화면
일정 기간 독서를 하지 않았을 경우, 리마인드시키는 알림을 발송합니다.

📜프로젝트 산출물

요구사항 정의서	디자인 시안(Figma)

ERD	아키텍쳐

API 명세서

⚒️기술스택

대분류	소분
Frontend	VS Code(1.81.1), React(18.2.0), Node.js(18.16.1), Recoil(0.7.7), Recoil-persist(5.1.0)
Backend	Intellij(2023.1.3), Java(1.8.0_192), SpringBoot(2.7.14), Gradle, ORM (JPA), Spring Security, java-jwt(4.2.1), Swagger(2.9.2)
CI/CD	AWS EC2, Nginx(1.18.0), Ubuntu(Ubuntu 20.04 LTS), Docker(24.0.5), Jenkins(2.401.3)
Cooperation	Notion, MatterMost, Discord, Webax, Figma, Git-Flow, Github
Database	MySQL : (8.0.33), Firebase
IoT	압력센서, 블루투스 모듈, 아두이노(Bluno Beetle), 조도센서

IOT

책갈피 회로도	책 갈피 내부 구조	책갈피 완성품

협업 관리

그라운드룰	노션 기반 진행상황 공유

데일리 스크럼 및 주간 회고	Gitflow 전략 및 통일된 커밋 메시지

지라를 사용한 일정 관리	깃랩을 통한 코드 형상 관리

📂프로젝트 구조

프론트엔드

📂src
  ├─📂api
  ├─📂assets
	│  ├─📂font
  │  └─📂img
  │      ├─📂home
  │      ├─📂login
  │      ├─📂search
  │      └─📂statistic
  ├─📂components
  │  ├─📂bookInfo
  │  ├─📂bookSearch
  │  ├─📂bookShelves
  │  ├─📂character
  │  ├─📂common
  │  ├─📂home
  │  ├─📂login
  │  ├─📂navBar
  │  └─📂userStatistics
  ├─📂pages
  ├─📂recoil
  │  ├─📂book
  │  ├─📂bookmark
  │  ├─📂history
  │  └─📂user
  ├─📂styles
  │  ├─📂bookSearch
  │  ├─📂home
  │  └─📂navBar
  └─📂utils
      └─📂bluetooth

백엔드

└─📂src
  └─📂main
    ├─📂java
    │  └─📂com
    │      └─📂reboot
    │          ├─📂book
    │          │  └─📂dto
    │          ├─📂config
    │          ├─📂fcm
    │          │  └─📂dto
    │          ├─📂history
    │          │  ├─📂dto
    │          │  └─📂entity
    │          ├─📂statistics
    │          │  ├─📂dto
    │          │  └─📂entity
    │          ├─📂user
    │          │  ├─📂controller
    │          │  ├─📂dto
    │          │  ├─📂entity
    │          │  ├─📂jwt
    │          │  ├─📂oauth2
    │          │  │  ├─📂handler
    │          │  │  ├─📂service
    │          │  │  └─📂userinfo
    │          │  ├─📂repository
    │          │  └─📂service
    │          ├─📂userbook
    │          │  ├─📂dto
    │          │  └─📂entity
    │          └─📂utils
    └─📂resources
         └─📂templates

💙팀원 역할 분배

백엔드

	김광표(팀장)	정명진	차민준
역할	Leader, Back-end, Dev-ops	Back-end, IOT, QA	Back-end, IOT
구현	- EC2, Nginx, Docker, Jenkins를 사용해 CI/CD 구축 - 책갈피 작동 로직 개발 - Spring Boot와 JPA를 이용한 백엔드 API 개발 - 책 기록 통계 알고리즘 개발	- IOT 회로 구성 및 최적화 - IOT 웹 블루투스 실행 로직 개발 - 아두이노(디지털 책갈피) 실행 로직 개발 - Spring Boot와 JPA를 이용한 백엔드 API 개발 - 책 기록 통계 알고리즘 개발	- spring security, JWT, OAuth 2.0을 사용한 카카오 소셜 로그인 구현 - fcm을 활용한 푸시 알림 구현 - 납땜으로 디지털 책갈피 회로 구현 - Spring Boot와 JPA를 이용한 백엔드 API 개발
프로젝트 후기 (배운점 및 소감)	어려워 보였던 주제에 도전하고, 성공해 낼 수 있어 좋았다. 앞으로도 무엇을 하든 더 적극적으로 도전해 볼 수 있을 것 같다.	처음에는 말도 안되는 주제라고 생각했었는데, 구체화해나가는 과정을 통해서 결국에는 책갈피 인식 정확도를 올려서 어느정도 사용 가능한 수준으로 끌어 올리는 의미있는 경험을 할 수 있었다. 중간에 하드웨어적인 문제로 끊임없이 한계에 부딪혔지만, 해결하는 과정을 통해서 많이 성장한 프로젝트였다고 생각한다.	iot는 처음 해봤는데 학부때 배웠던 아두이노와 납땜 기술이 도움이 많이 됐다. 그리고 spring과 jpa를 사용하면서 기초를 많이 쌓을 수 있었다.
컨택	email: kkp0639@gmail.com github: Pangpyo	email: jmj2588547@naver.com github: eyi-jin	email: whwhdnfl2@naver.com github: whwhdnfl2

프론트

	양불회	유혜민	서이현
역할	Front-end, PM, Presenter	Front-end	Front-end, design
구현	- 통계 페이지 개발 - 북 캐릭터 알고리즘 기획 - UI/UX 기획	- 프론트엔드 Directory 구조 설계 - 메인 페이지, 검색 페이지, 히스토리 페이지 개발 - 무한 스크롤 구현	- 블루투스 통신 부분 로직 및 PWA 구현 - firebase cloud messaging 활용 푸쉬 알림 - 로그인 기능 및 책장 페이지 개발 - 서비스 디자인 및 css 구현
프로젝트 후기(배운점 및 소감)	개발에 대한 부담이 컸기 때문에 프로젝트에 대한 두려움이 많이 앞섰다. 그렇지만 좋은 팀원들을 만나 무사히 잘 마루리한 거 같다. 평소에 기획에 관심이 있고 잘할 수 있을 거라 생각했는데 생각보다 개발 기획은 내게 어려웠다. 앞으로 어떻게 더 좋은 기획을 할 수 있을지 고민을 해보고 싶다. 개발적인 부분도 리액트, 리코일 등 다 처음 접해보는 영역이라 두려움이 컸는데 막상 해보니까 익숙해지는 게 느껴졌다. 다음 프로젝트 때에는 새로운 것에 대한 두려움을 버리고 적극적으로 학습하는 태도를 지녀야겠다. 그리고 무엇보다 일정 관리에 더욱 힘써야할 거 같다.	개발 외적인 것에 시간이 많이 들었지만, 끊임없이 소통함으로써 결국 좋은 결과물을 만들어냈다고 생각합니다. 리액트, IoT 등 모두에게 새로운 도전이었는데 만족스럽게 끝내서 다음에도 두려워하지 않고 도전해 볼 수 있을 것 같습니다.	팀원 모두에게 도전적인 주제였는데, 그만큼 시행착오도 많이 겪었던 것 같습니다. 그럼에도 모두가 타협하거나 대충하지 않고 기획부터 구현까지 열심히 임해서 좋은 결과물이 나왔다고 생각합니다! 리액트, 리코일, pwa 등 사용 경험을 쌓을 수 있어서 좋았고, 이번 경험을 바탕으로 다음 프로젝트에서는 컴포넌트를 효과적으로 구조화하거나, 또 다른 방식의 상태관리 라이브러리에 도전해보면서 발전시키고 싶습니다. 렌더링 되기 전의 화면에 신경을 못쓴 것이 아쉬워요..! 더 성장할 수 있는 계기가 되는 프로젝트가 되었단 생각이 듭니다. 다들 너무 수고많았습니다ㅎㅎ!
컨택	github: zzarru	email: hyemco@gmail.com github: hyemco	email: tjwn1408@naver.com github: https://github.com/I-HYEON

Name		Name	Last commit message	Last commit date
Latest commit History 848 Commits
client/intobook		client/intobook
exec		exec
intobook		intobook
.gitignore		.gitignore
.gitmessage.txt		.gitmessage.txt
README.md		README.md

eyi-jin/IntoBook

Folders and files

Latest commit

History

Repository files navigation