활동내역.zip/Techeer

[Project : HQRoutine] 테커인의 낮, 즐거웠던 POC 중간발표의 날

728x90

2023 Series

[ 2023 ] CheckPoint, 2023년

2023년 동안 작성했던 의미있다고 생각하는 포스팅들을 모아 둔 게시글입니다 이 글은 2023년이 끝날 때까지 계속해서 업데이트 해 나갈 예정입니다 [ January ] - 변화의 시작, 1월 더보기 [2022WinterBoo

time-map-installer.tistory.com

들어가며

프로젝트의 첫 번째 분기점인 POC 단계가 모두 끝난 이후에

약 60여 명의 네트워킹 시간을 통해 진행상황을 공유하는 행사를 진행했습니다.

"테커인의 낮"이라는 이름의 이 행사를 통해 그동안 비대면으로만 봐 왔던 팀원분들과

다른 여러 개발자분들, 그리고 여러 스타트업과 기업에서 대표로 방문해 주신 분들을 만나 뵈었고,

그분들과 함께 이야기를 하며 더 넓은 세상을 만나볼 수 있었습니다.

이번 행사 때 욕심을 살짝 내어 HQRoutine에 관한 진행상황 및 고도화 방향성 소개 발표와

GPT에 대한 쉬어가는 세션까지 총 두 개의 발표를 무사히 진행하였는데요,

다들 잘 들어주시고 호응이 좋아서 그런지 떨지 않고 발표를 잘 해낼 수 있었습니다.

그리고 이 포스팅은 그중에서도 HQRoutine에 대해 발표하였던 내용을 담고 있습니다.

서론이 길었네요. 그럼 시작하도록 하겠습니다!

이 포스팅은 발표 당시 사용했던 자료와 대본을 활용하여 제작되었습니다.

공유하는 일상의 즐거움, HQ Routine

문제상황 파악

우리는 모두 바쁜 삶을 살면서 수많은 일정과 계획을 관리해야 합니다.

그러나 많아진 계획들이 제대로 관리되지 않아 종종 중요한 일들을 놓치기도 하고, 스트레스를 받기도 하죠.

맞습니다. 오늘 저희는 일상에서 많은 사람들과 많은 계획을 잘 세우고 실천해야 하는 사람들을 위한 프로젝트를 소개하려 합니다.

이 문제에서 저희는 이 서비스를 생각해 내었고, 기획하고, 개발을 진행하였습니다.

그래서 저희가 준비한 서비스는 공유하는 일상의 즐거움, HQ Routine입니다

서비스 간단 소개

HQ Routine의 일정 공유 기능

HQ Routine은 다양한 일정 관리 기능을 제공하며, 그중에서도 특히 일정 공유 기능은

많은 사용자들에게 유용하게 사용되고 있습니다.

이 기능은 개인과 개인 간의 일정 공유뿐만 아니라, 공식적으로 기업에서 진행 중인

이벤트 일정까지 받아서 본인의 일정 목록에 손쉽게 추가할 수 있는 기능을 제공합니다.

이를 통해 사용자들은 일정 관리를 더욱 효율적으로 할 수 있을 뿐만 아니라,

서로의 스케줄을 확인하며 더 원활한 커뮤니케이션을 할 수 있습니다.

예를 들어, 단체로 하는 모임이나 참여하는 행사가 많은 경우, 일정을 공유하여

서로의 스케줄을 비교하고 조율할 수 있습니다.

또한, 자신이 좋아하는 그룹의 일정을 받아보기 쉬워서 놓치지 않고 참여할 수 있습니다.

이처럼 HQ Routine의 일정 공유 기능은 다양한 상황에서 사용자들에게 유용하게 활용될 수 있습니다.

일정 관리에 어려움을 느끼는 사용자들은 이 기능을 통해 더욱 효율적으로 일정을 관리해 보세요!

Demo Movie

실제로 이 서비스가 어떻게 돌아가는지 알아보아야겠죠?

System Architecture

HQ Routine 시스템 아키텍처는 React 기반의 프런트엔드와 Spring 기반의 백엔드로 구성되어 있습니다.

프런트엔드는 Next.js를 활용하여 더 빠른 페이지 로딩을 지원하고, 백엔드는 다양한 기능과 모듈을

제공하는 Spring을 활용하여 안정적인 서버를 구축합니다.

이를 통해 사용자들은 안정적으로 서비스를 이용할 수 있습니다.

고도화 계획 - 프런트엔드

HQ Routine의 UI/UX 및 렌더링 개선

HQ Routine은 사용자들이 보다 편리하게 서비스를 이용할 수 있도록 UI/UX 및 렌더링 개선을 계획 중입니다.

먼저, UI/UX 개선을 위해 스토리북을 활용하여 효율적인 컴포넌트 개발을 목표로 하고 있습니다.

스토리북은 컴포넌트의 디자인 및 개발을 빠르고 간편하게 할 수 있는 도구로,

전반적인 디자인 개선을 통해 사용자 만족도를 높일 계획입니다.

또한, 렌더링 개선을 위해 Next.js에서 제공하는 적절한 렌더링 방식을 활용하여 각 컴포넌트와

페이지 별로 최적화된 방법을 채용할 예정입니다.

이를 통해 사용자들은 더욱 빠르고 부드러운 페이지 로딩 속도를 경험할 수 있습니다.

또한, lighthouse를 이용하여 렌더링 개선 작업 전후 차이를 측정 & 비교하여

실질적인 수치가 개선되었다는 점을 증명할 예정입니다.

적절한 렌더링 방식을 통해 SEO 개선 작업도 계획 중입니다.

검색 엔진 최적화를 위해 사이트의 렌더링 속도가 중요한 요소가 되고 있으며,

적절한 렌더링 방식을 활용하여 SEO 효과를 극대화할 계획입니다.

HQ Routine은 사용자들의 편의성과 만족도를 고려하여 지속적인 UI/UX 및 렌더링 개선을 계속 진행할 예정입니다.

HQ Routine의 PWA 및 React Query 적용

HQ Routine은 사용자들이 더 편리하게 서비스를 이용할 수 있도록 PWA(Portable Web Application)를 적용할 예정입니다.

PWA는 Native App과 비슷한 사용자 경험을 제공하면서, 유지보수 비용과 기술 확장 비용을 절감할 수 있는 기술로,

모바일 플랫폼에서의 이용 확장을 목표로 합니다.

이 기술을 사용하는 기업으로는 트위터, 스타벅스, 핀터레스트, 텔레그램 등이 있습니다.

또한, React Query를 활용하여 불필요한 API 요청을 줄이고, 트래픽을 감소시키는 작업도 진행할 예정입니다.

React Query는 데이터 로딩과 관리를 담당하는 라이브러리로, 캐싱과 같은 기능을

제공하여 더욱 빠른 페이지 로딩을 가능하게 합니다.

HQ Routine은 프런트엔드에서 디자인과 성능 개선에 초점을 맞추어 지속적인 고도화를 계획 중입니다.

사용자들의 편리성과 만족도를 고려하여 다양한 기술 적용을 통해 개선해 나가겠습니다.

고도화 계획 - 백엔드

HQ Routine의 백엔드 개선 방안

HQ Routine은 사용자들의 편리성과 서비스 안정성을 고려하여 백엔드 개선을 계획 중입니다.

먼저, ELK를 활용하여 내용 전체를 색인하고 특정 단어가 포함된 문서를 검색 가능하게 하는 것을 목표로 합니다.

이를 통해 검색 기능을 중심으로 하는 서비스의 특성에 적합한 백엔드 구조를 구축할 계획입니다.

서버 쪽에서는 단위 테스트와 통합 테스트를 통해 소프트웨어 프로젝트의 지속 가능한 성장을 목표로 하고 있습니다.

이를 위해 테스트 커버리지 80% 이상을 목표로 하며, 안정적인 서비스 제공을 위한 개발 과정에서

불필요한 오류를 사전에 방지할 계획입니다.

또한, 부하 테스트를 통해 전체적인 시스템 응답시간을 개선할 예정입니다.

nGrinder를 활용하여 응답시간이 5초 이상이면 90%의 사용자가 이탈하는 문제점을 개선할 계획입니다.

데이터베이스 쪽에서는 캐시 서버를 적용하고, 커넥션 풀을 조정하며, 쿼리 튜닝을 통해 응답시간을 개선할 예정입니다.

마지막으로, 서버의 이중화를 통해 시스템의 가용성과 신뢰성을 높이고,
서버 장애 시에도 서비스 제공을 지속할 수 있도록 할 계획입니다.
이를 통해 사용자 경험의 개선과 비즈니스 업무의 지속성을 보장할 수 있습니다.

발표 종료!

이렇게 팀 발표를 무사히 마치고 테커인의 낮 또한 종료됩니다.

그렇게 행사가 끝나고 난 후

맛있는 고깃집에서 회식을 하고 집으로 돌아왔답니다!

To be Continue...

테커인의 낮 행사에 참석하신 분들, 준비하고 지원해 주신 모든 분들께 감사드립니다.