스터디 관련 사이트 프로젝트 초기 구상 (Svelte)

프로젝트

shoon95 2025. 2. 14. 12:58

프로젝트 기획 이유

평소에 공부를 할 때, 혼자서 공부하면 아무래도 꾸준히 적당한 진도를 유지하며 공부하는 것이 어렵기 때문에 스터디를 자주 진행하는 편이다.

스터디를 진행하는 방식은 보통 인프런이나 홀라에 글을 올려서 모집을 진행하는데, 전체적인 흐름은 다음과 같았다.

이러다 보니 스터디 하나를 진행하기 위해 계속 인프런, 홀라, 카톡, 노션, 디스코드 등 다양한 서비스를 계속 돌아다니며 사용해야만 했다. 또한 스터디장으로 스터디를 진행을 많이 하다 보니 스터디원 관리와 일정 관리에 대해서도 귀찮음이 많았는데, 이를 해결하기 위한

"스터디의 모든 것 " MOS 프로젝트를 기획하게 되었다.

아무래도 단순 글로 작성된 기획과 계획만으로 팀원을 모집하게 되면, 지원자도 읽으며 이해가 힘들고 막상 진행하며 본인이 생각했던 것과 다를 수 있기에 참고 자료가 될 수 있도록 기초적인 수준의 Svelte로 프론트 개발을 진행해보았다.

프로젝트에서 내가 생각한 핵심 기능들은 다음과 같다.

이외에 더 많은 기능들을 고려해볼 수는 있으나, 이후에 팀원 모집이 완료되면 기능에 대해 더 자세히 얘기를 나누며 정하고 현재는 위 기능을 우선 순위로 예시 화면을 구현해보았다.

메인 페이지에서는 다양한 스터디 모집글을 확인 할 수 있다. 필터를 통해 다양한 기준으로 전체 스터디를 확인할 수 있으면 카터게고리, 마감 기한, 진행 방식, 태그, 모집 인원 등의 정보를 빠르게 확인 할 수 있도록 한다.

스터디 모집글 작성에서는 스터디에 대한 기본정보와 설명, 그리고 필요에 따라 커리 큘럼, 규칙 등을 추가하여 스터디 모집글을 작성할 수 있다. 이후 최종적으로는 스터디 지원자가 작성할 지원서를 만들 수 잇다.

스터디 상세 페이지에선는 지원자가 스터디의 상세 정보와 스터디장의 정보를 확인 할 수 있으며, 개인 채팅을 통해 궁금한 점을 물어볼 수 있다.

또한 해당 페이지에서 지원하기 버튼을 누르면 기존에 만들어져 있던 지원서가 나타나며 해당 페이지에서 작성하여 바로 지원할 수 있다.

마이페이지에서는 현재 내가 참여 중인 스터디와, 지원한 스터디 목록을 확인할 수 있다. 또한 참여 중인 스터디의 일정이 개인 프로필의 캘린더에 동기화되어 자동으로 스터디 일정이 표시되어 스터디 일정을 관리하기 편리하게 한다.

이후 해당 스터디룸 입장을 클릭하면 스터디 대시보드 창으로 이동할 수 있다.

스터디 대시보드에서는 스터디의 제목, 목적과 다음 스터디 일정이 제일 상단에 나타난다. 또한 스터디 진행 시간에는 출석하기 버튼이 활성화되어 스터디 출석을 할 수 있다. 이를 통해, 스터디원들의 출석 관리를 용이하게 할 수 있다.

이외에 일정, 멤버, 자료, 커리큘럼, 채팅, 공지 사항등의 여러 섹션이 있으며 스터지장은 지원자 관리 섹션에서 스터디 지원자의 지원글을 읽고 수락 또는 거절을 할 수 있다.

대략적으로 스터디원 모집을 위해 기초적인 작업을 이 정도 진행해보았다.

스터디 진행을 위한 페이지가 핵심적인 기능이 될 것이라고 생각해 팀원들 모집이 완료되면 디테일하게 구상해야될 것 같다.

현재는 해당 사이트에서 스터디 회의록 관리 및 숙제 업로드나 화면 공유 등의 서비스까지 생각중이다.

채팅을 위한 Socket이나 푸시 알림, 화면 공유나 카메라를 위한 WebRTC등 들어보고 아직 사용해보지 못한 기술들을 적용해볼 수 있는 좋은 기회가 될 것 같다.