📜 효율적인 공지 서비스, 가정통신문 📜

대학생들의 더욱 효율적인 의사소통을 위한 공지 서비스 (PWA)
goormnotification.vercel.app

🔍 Introduction

기획 배경 & 특징

'공지사항'에 있어, 대학생들의 다양한 불편함을 접하였습니다.
니즈를 충족하고자, 이를 해소하는 '문제점 → 해결방안'을 바탕으로 한 서비스를 기획하게 되었습니다.

• 언제든지 다시 읽을 수 있기에 "흘려 읽을 가능성"  →  열람 기간 제한을 걸어두는 "제한성"
  
• 누가 읽었는지 알 수 없는 "익명성"  →  공지 확인/미확인 인원을 보여주는 "실명성"
  
• "업무와 일상의 분리"를 위한 서비스 필요  →  일상 중 "실시간 PWA 웹푸시 알림"을 통한 "공지용 서비스"
  
  

📹 Demo

서비스 소개

기능

실시간 PWA 웹푸시 알림 전	실시간 PWA 웹푸시 알림 후

💻 Architecture

💡 Tech Stack

Frontend	Backend	Deployment	Other

- Frontend : Next.js, Recoil, TypeScript
- Backend : Spring Boot, Java, Spring Security, JSON Web Token
- Database : MySQL
- Deployment : Vercel, AWS Elastic Beanstalk, Github Actions
- API Documentation : Swagger
- Notification : Firebase Cloud Messaging

🗂️ Database

📂 Directory Structure

Frontend

 ┣ 📂.github
 ┃ ┣ 📜ISSUE_TEMPLATE.md
 ┃ ┗ 📜PULL_REQUEST_TEMPLATE.md
 ┣ 📂public
 ┃ ┣ 📂icons
 ┃ ┃ ┣ 📜icon-192x192.png
 ┃ ┃ ┣ 📜icon-256x256.png
 ┃ ┃ ┣ 📜icon-384x384.png
 ┃ ┃ ┗ 📜icon-512x512.png
 ┃ ┣ 📂img
 ┃ ┃ ┣ 📜ADbanner.png
 ┃ ┃ ┣ 📜ADbanner2.png
 ┃ ┃ ┣ 📜BasicImg.png
 ┃ ┃ ┣ 📜Group.png
 ┃ ┃ ┣ 📜Landing.png
 ┃ ┃ ┣ 📜PaperMan.png
 ┃ ┃ ┣ 📜PaperRun.png
 ┃ ┃ ┣ 📜defaultGroupProfile.png
 ┃ ┃ ┣ 📜fcmLogo.png
 ┃ ┃ ┣ 📜fcmLogo2.png
 ┃ ┃ ┣ 📜goorm.png
 ┃ ┃ ┣ 📜loadingSpinner.gif
 ┃ ┃ ┣ 📜nothingLogo.png
 ┃ ┃ ┣ 📜og_img.jpg
 ┃ ┃ ┣ 📜previewDefalut.svg
 ┃ ┃ ┣ 📜upload.png
 ┃ ┃ ┗ 📜시계맨.png
 ┃ ┣ 📜firebase-messaging-sw.js
 ┃ ┣ 📜sw.js
 ┃ ┣ 📜sw.js.map
 ┃ ┣ 📜workbox-e43f5367.js
 ┃ ┗ 📜workbox-e43f5367.js.map
 ┣ 📂src
 ┃ ┣ 📂apis
 ┃ ┃ ┣ 📜group.ts
 ┃ ┃ ┣ 📜login.ts
 ┃ ┃ ┣ 📜notice.ts
 ┃ ┃ ┣ 📜request.ts
 ┃ ┃ ┣ 📜search.ts
 ┃ ┃ ┣ 📜setting.ts
 ┃ ┃ ┣ 📜team.ts
 ┃ ┃ ┗ 📜test.ts
 ┃ ┣ 📂app
 ┃ ┃ ┣ 📂(detail)
 ┃ ┃ ┃ ┣ 📂[tab]
 ┃ ┃ ┃ ┃ ┗ 📂alert
 ┃ ┃ ┃ ┃ ┃ ┗ 📜page.tsx
 ┃ ┃ ┃ ┣ 📂groups
 ┃ ┃ ┃ ┃ ┗ 📂group
 ┃ ┃ ┃ ┃ ┃ ┗ 📂[id]
 ┃ ┃ ┃ ┃ ┃ ┃ ┣ 📂accept
 ┃ ┃ ┃ ┃ ┃ ┃ ┃ ┗ 📜page.tsx
 ┃ ┃ ┃ ┃ ┃ ┃ ┣ 📂post
 ┃ ┃ ┃ ┃ ┃ ┃ ┃ ┗ 📜page.tsx
 ┃ ┃ ┃ ┃ ┃ ┃ ┗ 📂setting
 ┃ ┃ ┃ ┃ ┃ ┃ ┃ ┗ 📜page.tsx
 ┃ ┃ ┃ ┣ 📂mypage
 ┃ ┃ ┃ ┃ ┣ 📂modify
 ┃ ┃ ┃ ┃ ┃ ┗ 📜page.tsx
 ┃ ┃ ┃ ┃ ┗ 📂setting
 ┃ ┃ ┃ ┃ ┃ ┗ 📜page.tsx
 ┃ ┃ ┃ ┣ 📂new
 ┃ ┃ ┃ ┃ ┗ 📜page.tsx
 ┃ ┃ ┃ ┣ 📂notice
 ┃ ┃ ┃ ┃ ┗ 📜page.tsx
 ┃ ┃ ┃ ┗ 📜layout.tsx
 ┃ ┃ ┣ 📂(main)
 ┃ ┃ ┃ ┣ 📂groups
 ┃ ┃ ┃ ┃ ┣ 📂group
 ┃ ┃ ┃ ┃ ┃ ┗ 📂[id]
 ┃ ┃ ┃ ┃ ┃ ┃ ┗ 📜page.tsx
 ┃ ┃ ┃ ┃ ┣ 📂search
 ┃ ┃ ┃ ┃ ┃ ┗ 📜page.tsx
 ┃ ┃ ┃ ┃ ┗ 📜page.tsx
 ┃ ┃ ┃ ┣ 📂home
 ┃ ┃ ┃ ┃ ┗ 📜page.tsx
 ┃ ┃ ┃ ┣ 📂mypage
 ┃ ┃ ┃ ┃ ┗ 📜page.tsx
 ┃ ┃ ┃ ┗ 📜layout.tsx
 ┃ ┃ ┣ 📂(other)
 ┃ ┃ ┃ ┣ 📂privacy
 ┃ ┃ ┃ ┃ ┗ 📜page.tsx
 ┃ ┃ ┃ ┣ 📂service
 ┃ ┃ ┃ ┃ ┗ 📜page.tsx
 ┃ ┃ ┃ ┗ 📜layout.tsx
 ┃ ┃ ┣ 📂lib
 ┃ ┃ ┃ ┗ 📜registry.tsx
 ┃ ┃ ┣ 📂login
 ┃ ┃ ┃ ┗ 📜page.tsx
 ┃ ┃ ┣ 📂onBoarding
 ┃ ┃ ┃ ┣ 📂leader
 ┃ ┃ ┃ ┃ ┗ 📜page.tsx
 ┃ ┃ ┃ ┣ 📂member
 ┃ ┃ ┃ ┃ ┗ 📜page.tsx
 ┃ ┃ ┃ ┗ 📜page.tsx
 ┃ ┃ ┣ 📂signup
 ┃ ┃ ┃ ┗ 📜page.tsx
 ┃ ┃ ┣ 📜globals.css
 ┃ ┃ ┣ 📜icon.png
 ┃ ┃ ┣ 📜layout.tsx
 ┃ ┃ ┣ 📜loading.tsx
 ┃ ┃ ┣ 📜manifest.webmanifest
 ┃ ┃ ┣ 📜page.tsx
 ┃ ┃ ┗ 📜recoilContextProvider.tsx
 ┃ ┣ 📂components
 ┃ ┃ ┣ 📂PostNotice
 ┃ ┃ ┃ ┣ 📜DatePick.tsx
 ┃ ┃ ┃ ┣ 📜Dropdown.tsx
 ┃ ┃ ┃ ┗ 📜Post.tsx
 ┃ ┃ ┣ 📂common
 ┃ ┃ ┃ ┣ 📜CardList.tsx
 ┃ ┃ ┃ ┣ 📜DetailHeader.tsx
 ┃ ┃ ┃ ┣ 📜Header.tsx
 ┃ ┃ ┃ ┣ 📜Loading.tsx
 ┃ ┃ ┃ ┣ 📜Logo.tsx
 ┃ ┃ ┃ ┣ 📜Modal.tsx
 ┃ ┃ ┃ ┣ 📜NavBar.tsx
 ┃ ┃ ┃ ┣ 📜NoneNoticeCard.tsx
 ┃ ┃ ┃ ┣ 📜NoticeCard.tsx
 ┃ ┃ ┃ ┣ 📜ProfileImg.tsx
 ┃ ┃ ┃ ┣ 📜SearchHeaderBar.tsx
 ┃ ┃ ┃ ┗ 📜UploadImg.tsx
 ┃ ┃ ┣ 📂groupCreate
 ┃ ┃ ┃ ┗ 📜Create.tsx
 ┃ ┃ ┣ 📂groupaccept
 ┃ ┃ ┃ ┗ 📜GroupAcceptPage.tsx
 ┃ ┃ ┣ 📂groupdetail
 ┃ ┃ ┃ ┣ 📜GroupCardList.tsx
 ┃ ┃ ┃ ┣ 📜GroupDetailPage.tsx
 ┃ ┃ ┃ ┗ 📜GroupNoticeSection.tsx
 ┃ ┃ ┣ 📂groupmain
 ┃ ┃ ┃ ┣ 📜AllCardList.tsx
 ┃ ┃ ┃ ┣ 📜GroupMainPage.tsx
 ┃ ┃ ┃ ┣ 📜GroupSection.tsx
 ┃ ┃ ┃ ┣ 📜UnreadNoticeSection.tsx
 ┃ ┃ ┃ ┣ 📜UserGroupCard.tsx
 ┃ ┃ ┃ ┗ 📜UserGroupList.tsx
 ┃ ┃ ┣ 📂groupsetting
 ┃ ┃ ┃ ┗ 📜GroupSettingPage.tsx
 ┃ ┃ ┣ 📂home
 ┃ ┃ ┃ ┣ 📜Footer.tsx
 ┃ ┃ ┃ ┣ 📜GroupList.tsx
 ┃ ┃ ┃ ┣ 📜HomeGroupCard.tsx
 ┃ ┃ ┃ ┣ 📜HomePage.tsx
 ┃ ┃ ┃ ┣ 📜InfoSection.tsx
 ┃ ┃ ┃ ┣ 📜IssuedNoticeSection.tsx
 ┃ ┃ ┃ ┣ 📜MyGroupStateSection.tsx
 ┃ ┃ ┃ ┣ 📜NewNoticeSection.tsx
 ┃ ┃ ┃ ┗ 📜homeinfo.css
 ┃ ┃ ┣ 📂landing
 ┃ ┃ ┃ ┣ 📜Btn.tsx
 ┃ ┃ ┃ ┗ 📜Landing.tsx
 ┃ ┃ ┣ 📂login
 ┃ ┃ ┃ ┣ 📜Kakao.tsx
 ┃ ┃ ┃ ┣ 📜KakaoLogin.tsx
 ┃ ┃ ┃ ┣ 📜Login.tsx
 ┃ ┃ ┃ ┗ 📜loginInfo.ts
 ┃ ┃ ┣ 📂mypage
 ┃ ┃ ┃ ┣ 📜AverageCard.tsx
 ┃ ┃ ┃ ┗ 📜MyPage.tsx
 ┃ ┃ ┣ 📂noticeview
 ┃ ┃ ┃ ┣ 📜CheckListModal.tsx
 ┃ ┃ ┃ ┗ 📜NoticeViewPage.tsx
 ┃ ┃ ┣ 📂onBoarding
 ┃ ┃ ┃ ┣ 📂LeaderOnBoarding
 ┃ ┃ ┃ ┃ ┗ 📜Leader.tsx
 ┃ ┃ ┃ ┣ 📂MemberOnBoarding
 ┃ ┃ ┃ ┃ ┣ 📜GroupCard.tsx
 ┃ ┃ ┃ ┃ ┗ 📜Member.tsx
 ┃ ┃ ┃ ┣ 📜OnBoarding.tsx
 ┃ ┃ ┃ ┗ 📜ShareBtn.tsx
 ┃ ┃ ┣ 📂search
 ┃ ┃ ┃ ┣ 📜GroupCard.tsx
 ┃ ┃ ┃ ┗ 📜SearchPage.tsx
 ┃ ┃ ┣ 📂service&privacy
 ┃ ┃ ┃ ┣ 📜Privacy.tsx
 ┃ ┃ ┃ ┗ 📜Service.tsx
 ┃ ┃ ┣ 📂settings
 ┃ ┃ ┃ ┗ 📜Settings.tsx
 ┃ ┃ ┣ 📂signup
 ┃ ┃ ┃ ┗ 📜Signup.tsx
 ┃ ┃ ┗ 📜Test.tsx
 ┃ ┣ 📂hooks
 ┃ ┃ ┗ 📜useSearchForm.ts
 ┃ ┣ 📂styles
 ┃ ┃ ┗ 📜commonStyle.css
 ┃ ┣ 📂types
 ┃ ┃ ┗ 📜request.d.ts
 ┃ ┗ 📂utils
 ┃ ┃ ┗ 📂constant
 ┃ ┃ ┃ ┗ 📜index.ts
 ┣ 📜.eslintrc.json
 ┣ 📜.gitignore
 ┣ 📜.prettierrc
 ┣ 📜README.md
 ┣ 📜next.config.js
 ┣ 📜package-lock.json
 ┣ 📜package.json
 ┗ 📜tsconfig.json

👨‍👩‍👧‍👧 Team

김지은	전세원	최재영	고민지	사현진	김지민
Project Manager	Designer	Frontend Developer	Frontend Developer	Backend Developer	Backend Developer