서정현 | Frontend Developer

<aside> <img src="/icons/snippet_purple.svg" alt="/icons/snippet_purple.svg" width="40px" />

숫자 0같은 프론트엔드 개발자, 서정현입니다.

덧뺄셈을 만날 때처럼 겸손해야 할 때는 겸손하고, 곱셈을 만날 때처럼 기회가 오면 무엇이든 제 것으로 만드는 힘을 가지고 싶습니다.

상황에 따라 유연하게 강한 영향력을 발휘하고 싶습니다.

</aside>

Velog | https://velog.io/@zerone001/posts

Email | [email protected]

Github | https://github.com/CraftsManShip001

School | 부산소프트웨어마이스터고등학교 SW개발과 졸업 예정 ( 2024.03 ~ 2027.01 )

Introduce

소개

실제로 사용될 수 있는 서비스인지 고려합니다

기획하는 서비스가 정말 고객의 불편함을 해결해주는지를 고려합니다. 실용적인 서비스를 개발하기 위해 노력중이며, 프로젝트를 배포하면 주변 사람들과 SNS에 서비스를 자신있게 홍보하고 있습니다!

글을 쓰며 재미를 느낍니다

개발을 시작하고 회고록과 기술, 정보성 글을 velog에 10개의 글을 작성했으며 평균 16+ 개의 좋아요를 받고, 평균 500+회의 조회수를 기록했습니다.

저는 알고 있는 것과 배운 것을 남에게 공유한다는 기분을 가져 행복함을 느낍니다. 생각과 열심히 개발한 프로젝트의 발자취가 담겨 있는 회고록을 남에게 공유할 뿐만 아니라 이후에 제가 다시 읽었을 떄 그 당시 생각을 알 수 있고 동시에 뿌듯함을 느낍니다.

<aside>

교내 API 허브 서비스, BSSM DEVELOPERS

깃허브 링크 -> 서비스 링크 ->

v1 - 2025.09 ~ 2026.03 - 운영중

BSSM DEVELOPERS는 한 번 사용되고 버려지기 아까운 API들을 교내에 공유하여 다른 학생들이 API를 편하게 사용하기 위해 제작되었습니다.

부산소프트웨어마이스터고 관련 학생이라면 누구나 가입하여 사용할 수 있으며, 자신의 프로젝트에 사용된 API나 개인적으로 만든 좋은 API 등을 다른 학생들도 사용할 수 있게 공유할 수 있습니다. 공유된 API들을 사용하고 싶다면 신청을 넣어 발급 받은 토큰에 사용 권한을 부여 받게 되며, 이후에 자유롭게 승인 받은 API를 사용할 수 있습니다.

기여한 부분

9+개의 페이지를 제작 및 퍼블리싱했습니다, 45+개의 API를 연결했습니다

주요 기여 내용

• 서비스 내에 API를 등록하는 사용자가 API 문서, 일반 문서를 작성 해야했기에 직접 마크다운 에디터와 뷰어를 모듈형으로 구현하였습니다.
• 블록 기반 에디터를 개발하여, 텍스트뿐만 아니라 코드, 이미지, API 명세 등 다양한 콘텐츠를 자유롭게 배치하고 관리할 수 있도록 했습니다.
• 슬래시 커멘트(/) 및 마크다운 자동 포멧팅 기능을 구현하여, 마우스 없이 키보드만으로 제목, 리스트, 코드 블록 등을 빠르게 생성할 수 있는 사용자 경험(UX)을 제공했습니다.
• @dnd-kit을 활용한 무한 뎁스(Depth) 사이드바를 구축하여, 사용자가 드래그 앤 드롭으로 문서의 계층 구조를 직관적으로 정리할 수 있게 했습니다.

</aside>

서비스 화면

문서 작성 에디터 (마크다운 지원, 코드 작성)

마크다운 문서를 작성할 수 있는 에디터를 라이브러리 없이 직접 구현했습니다. h1,h2 등의 태그들을 활용할 수 있습니다.

문서 에디터1.mov

Sidebar 관리

문서 sidebar를 드래그 앤 드롭으로 그룹에 넣거나 빼거나 위치를 이동하며 관리할 수 있습니다. 문서는 모듈로 관리되며 문서, 그룹, API 3가지 형태의 모듈이 존재합니다.

sidebar 시연영상.mp4

문서 작성 에디터 (드래그 핸들 및 블럭 관리)

마크다운 에디터에서 왼쪽 드래그 핸들을 통해 요소의 위치를 자유롭게 변경할 수 있습니다. 또한 여러 요소를 드래그로 선택하여 한꺼번에 이동하는 작업도 가능합니다.

화면 기록 2026-03-16 오전 12.48.20.mp4

Request & Response JSON 입력

API를 등록하는 과정에서 request와 response를 JSON 입력하여 더 빠른 작업이 가능합니다. 또한 자동으로 타입이 추론되어 작성됩니다.

화면 기록 2026-03-16 오전 8.mp4

음악을 길거리에 떨어뜨려 공유하는 음악 스트리밍 서비스, RE:MEDY

깃허브 링크 -> 회고록 -> 시연 영상 ->

음악을 특정 장소에 떨어뜨리고, 떨어진 음악을 주변 사람들이 주워 들을 수 있는 위치 기반형 음악 스트리밍 서비스입니다.

사용자는 자신의 현재 위치에 어울릴만한 다른 사람에게 추천하고 싶은 음악을 떨어드립니다. 떨어진 음악은 주변 사용자가 주워서 들을 수 있고, 좋아요와 함께 간단한 코멘트를 남길 수 있습니다! 또한 평소에 자주 듣는 플레이리스트를 떨어뜨리거나 어떤 음악이 더 좋은지 의견을 받는 투표를 길거리에 떨어뜨릴 수 있습니다.