안녕하세요.👋 UniUnity는 대학교 인근상권을 한눈에 보여주는 서비스입니다.
소상공인 상가 정보와 제휴혜택 정보를 제공하고, 대학교와 학생, 인근상권 상인에게 커뮤니티를 제공해요!
데모영상 보러가기 : https://youtu.be/dg2AahO6aq0
서비스 매뉴얼 보러가기 : https://drive.google.com/file/d/1VwAK1Bhoa43EM2uQWBX-gt_fz0IsjMLf/view?usp=sharing
서비스 사용해보기 : http://uniunity.store
-
사용한 언어/툴
- front-end : HTML,CSS, Javascript
- back-end : node-js/visual studio code, mysql, firebase-storage, Google Cloud Platform
- CI/CD : Jenkins, Docker, Kubernetes
-
CI/CD구축 발표자료 보러가기 : https://github.com/UniUnity-sungshin/UniUnity-CI-CD
-
Lead: 최애림
-
나은영, 박지현, 오영서
자세히
‘UniUnity’는 대학교 총학생회와 재학생, 그리고 대학/대학교 재학생과 인근 소상공인들 사이에 연결고리가 되어주는 서비스이다.
학생들은 일반적으로 공지사항, 안내, 홍보 등의 활동을 소식을 단과대별로 만든 ‘카카오톡’ 단체 채팅방이나 대학교 커뮤니티 애플리케이션 ‘에브리타임’의 게시글을 통해 교내, 교외 행사 정보와 학과 공지를 얻는다. 그러나 ‘카카오톡’ 서비스는 수많은 연락이 한 화면에 존재하고, 누구나 공지글을 게시가 가능하다는 특성상, 이전에 공지됐던 글을 재확인하기 위해서는 스크롤을 올려야 하며, 모든 공지된 게시글을 한눈에 확인하기 어렵다. 또한 자신이 원하는 카테고리만 따로 모아보는 기능이 없어 원하는 소식을 놓치는 경우도 발생하여 추가적인 정보를 찾기 위해서는 학교 홈페이지, 학과 홈페이지, ‘에브리타임’ 등 여러 플랫폼을 거쳐야 하는 번거로움이 발생한다.
이러한 번거로움은 학생들이 학교 내 소식들뿐만 아니라 학교 외 정보들을 파악할 때 더욱 체감되는데 대표적으로 제휴 혜택을 확인할 때이다. 학생들은 ‘카카오톡’, ‘에브리타임’등에서 여러 번 검색을 거쳐야 하기에 정보 확인에 있어 불편함이 발생하고, 소상공인들 입장에서는 홍보에 어려움을 겪어 매출에 타격을 입을 수 있다.
또한 ‘에브리타임’의 가장 큰 문제점은 아이디를 쉽게 사고 팔 수 있다는 점이다. ‘에브리타임’은 회원가입 시 대학교 합격증이나 학생증을 재학생 증명자료를 첨부해 본인인증을 거치게 되는데, 이후 아이디를 금전적으로 거래하여 간혹 재학생이 아닌 외부인이 들어오게 되어 종교 포섭 및 광고 목적의 게시글이 올라와 재학생들은 불편함을 겪고 있다.
이러한 불편함에 착안하여, 총학생회와 학생 간의 소통을 효율적이게 만들어주는 플랫폼 ‘UniUnity’을 기획하게 되었다. ‘UniUnity’에서는 총학생회 공지사항, 학교 소식, 제휴업체 위치 및 혜택, 학교 주변 소상공인 상가 공유 등 주요 카테고리별로 분류하여 자신이 필요로 하는 내용의 공지, 중요한 공지, 혜택 등을 놓치지 않고 언제든 들어와서 확인할 수 있다. ‘UniUnity’의 공지글 작성은 각 학교의 관리자격인 총학생회만 가능하도록 하여 사용자는 신뢰성 있는 정보를 확인할 수 있다. 또한 회원가입 시 재학생들에게만 주어지는 학교 이메일로 아이디를 생성함에 따라 외부인의 출입을 최대한 막아 안심하고 서비스를 이용할 수 있다.
‘UniUnity’은 성신여자대학교 외에 다른 대학교도 이용이 가능하도록 한다. 재학중인 학교 외에 타 대학교의 소식을 열람 가능하도록 하여 대학 간의 교류를 도모함으로써 시야를 넓히고 새로운 기회를 얻을 수 있다. ‘UniUnity’는 학교와 관련된 다양한 행사 혹은 활동에 참여하는 빈도를 높이고, 그에 따라 학생들이 다양한 경험의 기회를 접할 수 있도록 장려한다. 또한 ‘UniUnity’는 제휴에 관한 서비스를 지도를 사용하여 한 번에 확인이 가능하도록 하여 이러한 불편함을 해소시켜줄 수 있다. 더불어 대학교 인근 상가의 소상공인들이 자신의 가게를 홍보하거나 대학 총학생회에게 제휴를 요청하는 글을 자유롭게 올릴 수 있어 소상공인에게 직접적으로 도움이 될 수 있다.
-
학교와 관련된 다양한 행사 정보와 학과 공지를 한눈에 확인하고 싶은 대학생
-
학교와 제휴한 가게 위치, 학교 인근 소상공인 가게를 지도로 한눈에 확인하고 싶은 대학생
-
학교 인근 소상공인 가게와 소통할 수 있는 게시판이 필요한 총학생회
-
제휴업체 정보와 교내, 교외 행사정보를 재학생에게 효율적으로 보여주고 싶은 대학교 총학생회
-
홍보, 제휴를 목적으로 한 대학가 소상공인들
-
타 대학교의 행사 정보를 얻거나 타 대학과 교류하고 싶은 대학생
-
대학교 정보를 얻고 싶은 입시생
자세히
‘UniUnity’는 전국에 위치한 모든 대학생들, 대학가에 위치한 소상공인들을 대상으로 한다. 각 대학교들은 서비스를 이용하기 위해서 관리자 즉, 총학생회를 통해 본인의 학교를 서비스에 추가하여 플랫폼을 이용할 수 있다. 하나의 대학교 페이지는. 서비스 관리자의 인증 이후 해당 대학교의 총학생회가 관리하도록 하여 각 학교의 총학생회 이메일로만 공지글 게시 및 수정이 가능하도록 한다.
‘UniUnity’의 관리자 권한을 가진 각 총학생회들은 공지사항, 제휴 업체 등 자신의 대학에 대한 최신 정보들과 소식을 게시하여 학생들이 이 정보에 접근하여 댓글을 남기거나 자신의 학교 이벤트에 참여할 수 있도록 하는 효율적인 방법을 제공한다. 이 과정에서 총학생회는 학생들이 남긴 의견과 피드백에 응답하여 많은 학생들이 더 편리하고 쉽게 서비스를 이용할 수 있도록 하고 공동체 의식을 형성하도록 도움을 줄 수 있다. 또한 ‘UniUnity’는 학생들의 의견을 들을 수 있는 ‘학생 게시글 페이지’와 함께 소상공인들에게 직접 홍보의 기회를 제공할 수 있는 ‘소상공인 페이지’를 통하여 대학과 대학가 인근의 소상공인들간의 소통을 활성화하여 상권 홍보 효과를 기대할 수 있다.
자세히
‘UniUnity’는 학생들에게 대학별로 정보를 게시 및 열람할 수 있는 플랫폼을 제공함으로써 학생들은 학교 소식과 제휴 업체 정보를 검색할 수 있다. 이 과정에서 학생들은 정보를 얻기 위해 다른 여러 플랫폼을 거치기 않기 때문에 소비되는 시간과 노력을 아낄 수 있다.
기존에 학생회들은 제휴 업체를 선정하기 위해 처음부터 학생들에게 필요한 업체를 직접 일일이 찾아야 하는 어려움이 있었다. ‘UniUnity‘는 학생들이 제휴를 맺고 싶은 업체를 게시글로 올리고 여러 학생들이 공감 버튼과 댓글로 소통할 수 있다. 또한 소상공인들도 홍보성 글을 올리면 해당 업체에 관심 있는 학생들이 공감 버튼을 통해 표현할 수 있기 때문에 양방향으로 소통이 쉽게 이루어진다. 이를 통해 총학생회는 학생들과 소상공인들의 의견을 종합하여 전보다 쉽게 제휴 업체를 고를 수 있다.
지도 API를 이용하여 평소에 제휴 업체인지 확인하기 번거로웠던 점을 한 눈에 확인하도록 하여 기존의 SNS를 통해 느꼈던 불편함을 개선하였다. 기존의 SNS를 이용하여 위치를 알아냈을 경우에는 업체의 이름을 하나씩 검색해야 하기 때문에 여러 번의 검색 횟수가 필요했다면 지도 API를 제공함으로써 특정 학교와 제휴가 되어있는 모든 업체들의 위치를 한 번의 클릭을 통해 알아낼 수 있다. 또한, 관련 업종별 제휴 업체들만 모아서 볼 수 있기 때문에 학생들이 직접 제휴 업체의 이름을 인터넷 지도에 검색해보는 것보다 더 쉽게 위치를 확인할 수 있다.
뿐만 아니라 ‘UniUnity’에는 소상공인이 직접 글을 올릴 수 있도록 게시글 카테고리를 만들어 분리해 놓았기 때문에 소상공인은 자신의 가게를 홍보할 수 있는 효과를 기대할 수 있다.
또한, 총학생회가 교내 소식을 올려주면 각 대학 내의 공동체 의식을 형성하여 학생들이 교내에서 일어나는 소식을 듣고 온라인상에서도 동기, 후배, 선배들과 소통하고 교류할 수 있다. 학생들은 이 과정을 통해 학교 관련 주제에 대한 아이디어를 서로 공유할 수 있고 교내 학생들 간의 더 큰 협력을 만들어낼 수 있다.
자세히
학교에서 학생들에게 실질적으로 도움되는 정보를 제공할 수 있는 주체는 학생회이다. 학생들이 운영하는 학교의 공식적인 단체인만큼 공적인 정보를 제공하지만, 학생회는 대학교 홈페이지에 글을 게시할 권한이 없기 때문에 정보 제공은 대다수 ‘에브리타임’ 혹은 ‘카카오톡’ 서비스에서 이루어진다.
기존에 알고 있던 대학생 대표 커뮤니티 ‘에브리타임’의 경우, 해당 서비스는 각각의 대학교마다의 커뮤니티가 존재하여 인증만 한다면 익명으로 활동할 수 있는 공간이다. 따라, 해당 대학의 학생이면 누구든지 글을 올리고 정보를 공유할 수 있다는 장점이 있지만 반면에 개인이 올리는 게시글들의 신뢰성이 떨어질 수 있다는 문제점이 존재한다.
‘카카오톡’의 경우는 익명성은 존재하지 않지만 학교 생활을 제외하고도 많이 사용되는 채팅 서비스이다보니 ‘카카오톡’을 통한 소통은 학교 공식이라는 인식이 희미해질 수 있다는 단점이 발생한다. 또한 ‘카카오톡’은 채팅 서비스임에 따라 채팅에 알맞은 구조로 이루어졌기 때문에 공지 일정/홍보 등의 업무는 효율적으로 처리할 수 없다는 점이 존재한다.
따라서 ‘UniUnity’는 학생-학생 간의 소통은 물론, 학교(총학생회)-학생의 효율적인 소통, 더 나아가 학교와 인근 상가의 소상공인들간의 소통을 위해 기능한다. 서비스에서 정보를 제공하는 주체는 학교의 총학생회가 되어 소통이 이루어지기 때문에 사실이 아닌 내용이 기재되는 일이 없고, 각 학교마다 총학생회가 페이지를 운영하기에 총학생회가 제공하는 정보/소식에 집중할 수 있다.
‘UniUnity’는 대학교 총학생회와 재학생에게 인근 상가 정보를 제공을 통해 제휴 가능 및 잘 몰랐던 소상공인 상가 정보를 알려주며 편의를 제공한다. 이는 반대로 소상공인 상가 정보를 인근 대학교에 홍보할 수 있는 효과를 도모해 대학교 인근 상가에 활발한 경제활동을 유도할 수 있으며, 이는 나아가 지역상권 활성에 기여한다.
| 서비스명 | 에브리타임 | 카카오톡(단과대 단체 채팅방) | 대학교 홈페이지 | UniUnity |
|---|---|---|---|---|
| 서비스 목적 | - 에브리타임은 편리한 시간표 제작, 대학교 커뮤니티, 대학 관련 정보 공유를 목적으로 제작된 서비스 | - 연락처에 저장되거나 초대받은 사람만으로 구성하여 채팅 등의 기능을 통해 소통을 하도록 하는 서비스 | - 대학 홍보, 학생정보서비스, 학사행정, Q&A, FAQ 등을 제공하여 재학생은 물론이고 수험생에게 정보 제공하는 서비스 | -재학생들에게 제휴 정보와 소상공인가게의 위치와 정보를 한눈에 볼 수 있도록 제공하는 서비스 |
| 서비스 주요기능 | - 시간표 작성, 수업 일정 및 학업 관리, 학식, 셔틀버스 등 정보확인 - 같은 학교의 학생들과 소통하는 익명 커뮤니티 |
- 단과대학 행사 공지 - 학사 일정 공지 |
- 학사/장학 일정 공지 - 학생 정보 확인 - 학교 홍보 |
- 총학생회 공지, -소상공인가게 및 제휴한 가게 지도안내, -총학생회에게 소상공인 가게 정보 제공하며 소상공인과 소통하는 커뮤니티 제공 -같은 학교의 학생들과 소통하는 커뮤니티 |
| 서비스 대상 | 대학생 | 같은 과 대학생 | 대학생 | 대학생, 소상공인 |
| 주된 커뮤니티 방식 | 같은 캠퍼스 학생과 학생 | 같은 캠퍼스 학생회와 학생 | 같은 캠퍼스 학교와 학생 | 같은 캠퍼스 총학생회와 학생, 타대학교, 소상공인 |
| 게시글 신뢰성 | X | O | O | O |
| 타 대학 정보열람 및 교류 | △ | X | △ | O |
| 제휴업체 지도정보 제공 | X | X | X | O |
| 소상공인 가게정보 제공 | X | X | X | O |
- 안녕하십니까! 대학 공동체의 커뮤니티 유니유니티 발표 시작하도록 하겠습니다.
- 발표 순서는 유니유니티의 차별성과 필요성, 서비스의 내용과 의의, 작품 개발과정에 겪었던 어려웠던 점들과 해결방안순으로 진행하겠습니다.
- 먼저 유니유니티의 필요성과 차별성에 대해 소개하겠습니다.
- 저희는 일상 속 대화에서 아이디어를 얻어 기획하게 되었는데요, 제공되는 제휴 혜택은 많은데 제휴소식만을 모아서 볼 수 있는 곳은 찾기 어렵고, 카카오톡의 경우, 채팅 어플 플랫폼의 특성상 공지사항전달에는 적합하지 않으며, 또한 학교 홈페이지는 학교 내 소식만 알 수 있을 뿐, 그 외의 소식은 얻기 어렵다는 불편사항을 접수했습니다.
- 코로나 이후에 다시 대학 상권이 활발해짐에 따라 대학교 인근 상권 정보와 소식을 제공해주면 좋을 것 같다는 생각이 들었습니다.
- 이에 따라 인근 상권 상인들에게도 도움이 되는 플랫폼을 만들면 좋겠다는 의견이 나왔습니다. 장사의 신이나 골목식당 출연 이후 잘 되는 가게들의 특징이 뭔지 아십니까? 바로 홍보효과를 톡톡히 받았다는 것입니다. 가게 홍보도 함께 하게되면 상인들에게도 학생들에게도 서로 도움이 될 것입니다.
- 그렇게 탄생한 아이디어가 바로 uniunity입니다. 이는 university 와 unity의 합성어로 학생과 학생회, 소상공인! 대학과 대학가를 이루는 모두가 소통하며 공동체를 이룬다는 의미입니다.
- 타 플랫폼과의 비교를 통해 유니유니티만의 차별성을 알아보겠습니다. 학교 홈페이지의 경우 신뢰성은 물론 보장되나, 원하는 정보를 얻기 위해서 비교적 검색과정이 복잡하고, 소통이 일방향적입니다, 학교 밖 소식도 물론 알 수 없습니다, 카카오톡 과 공지방에서는 주로 학생회 임원들만 메세지를 전송하기에 신뢰성은 보장된다고 볼 수 있겠습니다. 다만 카카오톡 특성상 메세지가 쌓이기 쉽고, 한번에 원하는 정보를 찾기 어렵습니다. 역시 학교 밖 소식을 얻기에도 제한이 있습니다. 에브리타임의경우 누구나 글을 올릴 수 있는 익명인만큼 신뢰성과 안정성이 떨어진다고 볼 수 있습니다. 학생들간의 소통에는 효과적이나, 역시 학교 밖 소식을 얻기에는 제한이 있습니다. 이러한 단점을 보안하고자 저희 유니유니티는 회원가입시 모두 인증절차를 거치고, 별도의 인증절차를 거친 각 학교 학생회만 공지글 작성이 가능하게 하여 정보의 신뢰성을 보장하였습니다. 간편한 검색기능을 제공하며, 다방면으로 소통이 가능하고, 한번의 검색으로 대학가 인근 상가들의 소식과 위치까지 한번에 얻을 수 있어 편리하다는 장점이 있습니다.
- 기술적 차별화 요소로는 패스포트를 이용한 세션 로그인 기능 구현, Gmail API를 이용하여 회원 가입시 학교 이메일을 이용한 인증절차, 카카오 지도 API, 소상공인 공공데이터 API를 이용해 인근상권 정보를 지도로 한눈에 표시한것, ToastUI Editor와 Firebase Storage를 이용해 사용자가 에디터의 다양한 기능을 이용할 수 있도록 한 점을 꼽아보았습니다.
- 이제 본격적으로 uniunity의 내용과 의의에 대해 소개해드리도록 하겠습니다.
- Uniunity는 대학교 인근 상권을 한눈에 보여주는 서비스입니다, 소상공인 상가 정보와 제휴혜택을 제공하며, 대학교, 학생들, 인근 상권 상인들에게 커뮤니티를 제공합니다.
- 이제 기능들을 하나씩 소개해보도록 하겠습니다. 먼저 메인페이지입니다,
메인페이지에서 학교 검색을 통해 학교 페이지로 이동할 수 있습니다. 현재는 성신여대와 건국대학교만 서비스를 제공하고 있습니다
회원가입을 하지 않아도 대학교 인근 상권의 정보를 열람할 수 있습니다.
- 성신여대 학교페이지입니다.
소상공인의 가게 지도, 제휴지도, 게시글더보기 메뉴 클릭시 원하는 페이지로 이동됩니다.
학교 주요소식 게시글을 클릭하면 해당 카드뉴스 게시글을 확인할 수 있습니다.
- 대학 인근 소상공인 상가 모아보기 기능입니다.
지도를 살짝 움직여주면 가게 마커가 보이며, 더보기를 클릭하면 자세한 가게 위치와 가게정보를 볼 수 있습니다.
- 다음으로는 회원가입입니다. 회원가입기능 구현시에 지메일 API를 이용해 메일인증을 거칩니다. 이 때 학생들은 각 학교의 이메일로만 가입이 가능하며, 소상공인들은 지메일, 네이버메일도 가능합니다. 회원가입시 비밀번호는 해싱을 거쳐 안전하게 저장됩니다.
- 또한 저희는 약관동의 후에 회원가입이 가능합니다. 입력한 정보가 모두 정확하게 확인되어야 회원가입을 완료할 수 있도록 하여 품질성 높은 회원가입을 구현하였습니다.
- 다음은 로그인과 비밀번호 찾기 기능입니다. Passport.js를 이용해 세션로그인과 로그아웃을 구현했습니다. 로그인 기록이 세션에 남으므로 일정시간동안 로그인이 유지되며, 비밀번호 찾기를 누르면 이메일 인증 후 새 비밀번호를 설정할 수 있습니다.
- 다음은 마이페이지의 기능들을 소개하겠습니다. 먼저 내 정보와 정보 변경입니다. 로그인 후 마이페이지에서 내 정보를 확인할 수 있고, 닉네임 및 비밀번호 변경과 회원 탈퇴까지 가능합니다.
- 다음은 커뮤니티 기능입니다. 로그인 후 마이페이지에서 내가 작성한 게시글, 내가 댓글 단 게시글, 나의 스크랩, 나의 좋아요 게시글들을 모아서 볼 수 있습니다. 우측하단에 사진은 좋아요 누른 게시글이 없을 경우에 뜨는 문구를 예시로 넣어서 보여드렸습니다.
- 이제 소상공인 가게 지도 보여드리겠습니다, 지도의 마커를 선택하여 해당되는 대학 인근 상권의 소상공인 가게 정보를 볼 수 있습니다. 이 정보들은 소상공인 상가 공공데이터를 이용하여 표시했습니다.
- 제휴지도입니다.
지도의 마커 혹은 가게 목록을 클릭하면 가게 정보가 표시됩니다. 이 때 자세한 제휴 혜택, 위치, 제휴 기간까지 함께 알 수 있어 한번에 편리하게 제휴 관련 정보들을 얻을 수 있습니다.
- 다음으로 게시글 커뮤니티 기능에 대해 소개하겠습니다. 검색창이 있어 원하는 게시글을 손쉽게 찾을 수 있습니다.
검색창 아래에는 카테고리들이 분류되어있습니다. 제휴추천, 제휴제안, 총학생회 공지사항, 잡담, 가게홍보. 이렇게 5가지의 카테고리중에서 선택하여 해당되는 게시글만 한눈에 볼 수 있습니다.
게시글 보러가기를 클릭하면 게시글 상세 페이지로 이동합니다.
- 다음은 게시글 작성 기능입니다. ToastUI 라이브러리를 이용하여 게시글 작성 페이지를 구현하였습니다. 대학교 인근 상인들은 가게홍보, 제휴제안 게시글을 작성할 때 다양한 에디터기능을 통해 정보를 보다 효과적으로 전달할 수 있습니다. 게시글 이미지는 firebase storage 서비스를 이용해 저장하였습니다.
- 이렇게 게시된 게시글들은 수정, 삭제도 가능합니다.
- 게시글의 좋아요, 스크랩 기능입니다. 본문 좌측하단에 하트와 별모양 아이콘들이 각각 좋아요와 스크랩 기능을 담당합니다.
- 다음은 학생회만 등록 가능한 제휴가게 등록 기능입니다.
제휴를 맺은 가게의 정보를 입력하고, 등록하기 버튼을 누르면 제휴 가게가 지도에 새롭게 등록됩니다.
- 댓글기능입니다. 로그인 후에만 댓글을 작성할 수 있으며, 본인이 작성한 댓글은 삭제할 수 있습니다.
- 다음으로는 문의사항입니다.
학생회는 가입 후, uniunity공식 메일로 문의하여 별도의 학생회 인증을 거쳐 학생회 권한을 부여받습니다.
문의사항 페이지에서는 학생회 인증 및 자유로운 피드백 등록이 가능합니다.
- 지금까지 유니유니티의 서비스의 내용에 대해 살펴보았는데요, 그렇다면 유니유니티를 이용하면 어떤 기대효과를 누릴 수 있을까요?
먼저 상인들은 대학과 소통하며 가게 홍보 효과를 누릴 수 있을 것입니다. 업체에 대한 학생들의 의견을 접하고, 대학가 주변 상권 활성화까지 기대할 수 있겠습니다.
- 학생과 학교 입장에서는 어떨까요? 학생들은 다양한 제휴 혜택들을 한눈에 확인할 수 있습니다. 자유로운 소통으로 공동체 의식을 향상시킬수 있으며, 정보 제공도, 검색도 간편해질 것입니다.
- 다음으로 유니유니티 개발과정입니다.
- 우선 저희는 깃허브 팀 레퍼지토리를 이용해 코드를 공유하였고, 총 438커밋을 달성하였습니다.
- 서비스 아키텍쳐입니다. 크롬에서 요청을 보내면 DNS에서 응답을 받습니다. 프론트작업은 부트스트랩을 이용하였으며, 웹서버와 mySQL, firebase storage를 통해 DB요청을 주고받았으며, GCP VM을 통해 웹서버와 DB서버를 배포하고, Cloud DNS를 통해 도메인을 설정하였습니다.
- 개발과정에서 겪은 어려웠던 점들 소개하겠습니다.
먼저 일부 페이지에서 새로고침시 fetch함수를 통해 불러온 API가 호출이 안되는 것을 확인했습니다.
- 프론트엔드 fetch함수에서 발생한 것이라 생각했으나, 서버에서 DB에 접근해 쿼리문을 실행하고 데이터를 받아오는 과정에서 생긴 문제였습니다. 이에 대해 해당 문제가 커넥션리밋이 낮게 설정되어있어 새로고침시 횟수를 모두 사용하여 더이상 서버가 DB에 접근할 수 없게 되어 발생하는 문제였음을 인지하였습니다. 동시에 많은 DB접근이 발생할 때 커넥션은 한정되어있기에 쓸 수 있는 커넥션이 반납될때까지 기다려야 합니다. 많은 커넥션을 생성하면 많은 메모리를 차지하게 되고, 프로그램의 성능을 떨어트리는 원인이 된다는 것 여러분들도 함께 알아두시면 좋을 것 같습니다.
- 이 문제를 해결하기 위해 DB설정 코드에 connectionLimit 옵션을 추가하였습니다. 또한 모든 DB접근 함수에 쿼리 실행문 다음줄에 pool.releaseConnection()코드를 추가하여 커넥션을 반납하게 하여 오류를 해결하였습니다.
- 두번째는 toast ui를 이용해 게시글에 사진을 업로드시 insert가 안되는 문제입니다. 그 이유는 토스트 에디터에 이미지를 업로드하면 이미지는 자동으로 BASE64타입으로 저장되는데, 이미지 해상도가 높아질수록 문자열의 길이가 길어지기 때문입니다. 이를 해결하기 위해 varchar에서 longtext으로 타입을 변경했음에도 여전히 해결되지 않았습니다.
- 그래서 저희는 게시글 이미지만 파이어베이스 스토리지에 별도로 저장했습니다. Multer-firebase-storage모듈을 사용하여 이미지 저장 API를 작성하였고, Toast Ui editer Core옵션인 add- Image-blob-hook을 이용하여 프론트엔드에 이미지 저장 API를 연동했습니다.
- mysql-Post db에 post 이미지가 잘 저장된 모습을 볼 수 있습니다.
- 세번째로는 게시글 작성시 고용량 파일의 경우 이미지 저장 처리가 느려 올라가지 않는 것처럼 보여 어려움을 겪었습니다. 이는 이미지 업로드시 프론트에서 스피너를 이용해 로딩 처리하는것으로 수정했습니다.
- 저희는 지난 7일간 10명에게 베타테스트를 받았습니다. 실제로 사용자들이 이용해보며 오류를 발견하고, 후기를 받아 개선하였습니다.
- 저희는 추후 모바일 웹 크기 화면 UI를 수정하고, 더욱 많은 학교들을 대상으로 서비스를 제공할 예정입니다. 화면에 보이는 큐알코드를 통하여 유니유니티에 접속이 가능합니다. 다만 웹서비스인만큼 모바일보다는 PC로 접속해주시면 감사하겠습니다. 8/31일까지 접속 가능하도록 할 예정이니, 많은 관심 부탁드리며 오류 혹은 문의사항 있으시면 자유롭게 남겨주세요! 마지막으로 저희 실행영상 보시며 발표 마무리하겠습니다.
- 데모영상 보러가기 : https://youtu.be/dg2AahO6aq0
- 지금까지 학교 공동체들의 커뮤니티 유니유니티였습니다. 감사합니다!
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent