개인 프로젝트 'Maple ToDo', 이전까지 작업했던 내용 간략하게 정리
개발 기간: 2025.01.31 ~ 2025.05.06 (진행 중)
- 3월부터 4월까지 정보처리 산업기사 실기 준비 기간이었기 때문에
실제로 작업한 기간은 약 두 달 남짓 정도
1. 캐릭터 검색, To Do List 화면 이동
검색창에 내 캐릭터의 닉네임을 입력하고, Enter 키나 검색 버튼 (화면상 돋보기 모양 버튼)을 누르면
Nexon Open API 통해 메이플스토리 내, 해당 닉네임과 동일한 닉네임의 캐릭터 정보를 받아오고데이터를 성공적으로 받아왔다면, 아래 이미지처럼 To Do List 페이지로 이동한다.
To Do List 화면 최상단에는 내 캐릭터 정보 (캐릭터 이미지, 닉네임, 서버, 레벨, 직업)가 보이고
바로 아래에는 사용자가 추가 가능한 일정의 종류를 보여준다.
(주간 콘텐츠, 주간 보스, 기타 매할일)
이때 보여주는 일정의 종류는 메이플스토리 인 게임 내의 메이플 스케쥴러를 참고하였다.
(일일 퀘스트는 제외하였음)
주간 콘텐츠, 주간 보스, 기타 메할일로 총 세 종류의 일정을 추가할 수 있으며
주간 콘텐츠와 주간 보스는 정해진 항목에서 일정을 선택하고
기타 메할일은 사용자가 임의로 일정을 입력해서 추가할 수 있다.
일정을 추가하는 과정을 확인해 보자.
2. 일정 추가하기 (주간 콘텐츠 / 주간 보스 / 기타 매할일)
① 일정: 주간 콘텐츠 추가하기
카테고리를 주간 콘텐츠로 설정한 상태에서 '할 일 추가' 버튼을 클릭하면
아래 이미지처럼 일정 등록 form이 나온다.
일정 등록 form에서 'select' box에서 일정을 선택하고, 등록 버튼을 누르면
아래 '주간 컨텐츠 목록' Tab에서 방금 선택한 일정이 나온다.
'주간 컨텐츠 목록' Tab은 일정을 최종 등록하기 전에 일정을 모아두는 공간이다.
원래 일괄 등록을 구현하려고 했지만, 그때 당시에는 좋은 방법이 떠오르지 않았기 때문에
임시방편으로 주간 콘텐츠 목록이라는 Box를 만들고, 일정은 개별적으로 선택하되
최종 등록만 일괄적으로 하는 형태로 구현한 것이다.
이번 달 안으로 프로젝트 배포까지 마치고, 여유가 좀 생기면 개선하는 걸로 미뤄두자.
사용자가 일정을 하나씩 선택해서 주간 컨텐츠 목록이라는 일종의 장바구니에 일정을 담아두고마지막으로 '등록' 버튼을 눌러야 장바구니에 담긴 일정들이 등록이 된다.
그전까지는 아무리 일정들을 장바구니에 담아도, 등록되지는 않는다.
② 일정: 주간 보스 추가하기
기본적인 메커니즘은 주간 콘텐츠와 주간 보스 모두 똑같다.
select 박스에서 일정을 개별적으로 선택하고, 등록을 누르면
'주간 컨텐츠 목록'/'주간 보스 목록'이라는 이름의 장바구니에 일정이 담기고
해당 장바구니, Tab에 담긴 일정은 등록 버튼을 눌러야만 해야 할 일로 추가된다.
물론 등록 버튼을 누르기 전까지는 삭제도 가능하다.
메이플스토리 인 게임 내에서 주간 보스들은 난이도 별로 세분화가 되어있다.
하위 주간 보스 중 카오스 파풀라투스 전까지는 난이도가 나뉘지 않지만 (시그너스 제외)
노멀 스우부턴 각 보스 콘텐츠의 난이도가 세분화가 되어있다. (이지, 노멀, 하드(카오스), 익스트림)
일정을 선택하는 과정에서 사용하는 것이 select 박스인 이상
보스 컨텐츠 아이템 내부에 난이도 선택까지 추가할 수는 없었기 때문에
select 박스에서 보스 콘텐츠를 선택하고, 난이도는 '주간 보스 목록'에서 정하는 형태로 바꿨다.
지금까지 작업했던 것들을 이렇게 글로 정리하면서 생각해 본 건데
일정을 선택하는 용도로 <select> 박스를 사용하는 것은 별로 좋은 방식은 아닌 것 같다.
인 게임 내에 아주 좋은 예시 (메이플 스케줄러)가 있기 때문에
굳이 이런 방식을 고집할 필요는 없을 것 같다..
③ 일정: 기타 메할일 추가하기
기본적인 디자인은 이렇게 생겼다.
일정 제목과 시작 일 및 종료 일 그리고 일정 상세 내용, 총 네 가지의 데이터를 입력받는다.
여기서 일정 제목만 필수, required 설정을 해놨고 나머지는 선택 사항으로 놔뒀다.
(번외 일정 같은 거를 등록할 때, 시작일, 종료일, 일정 상세 내용 등과 같은 상세 데이터까지
입력하게끔 강제하면 사용 편의성이 떨어질 것 같은 생각이 들어서 그냥 선택 사항으로만 뒀다.)
'기타 매할일' 항목에서는 이전 두 항목 (주간 콘텐츠/주간 보스)과는 다르게중간 다리 (주간 컨텐츠 => 주간 컨텐츠 목록 / 주간 보스 => 주간 보스 목록)를 만들지는 않았다.
필요한 데이터 (일정 제목 등)만 입력하고, 등록하기 버튼을 누르면사용자가 입력한 일정이 바로 추가가 되는 형태이다.
Maple ToDo, 올해 1월 말부터 시작한 사이드 프로젝트로
내가 개인적으로 필요해서 개발을 시작한 프로젝트이다.
원래 계획 상 실기 전까지 배포를 하고 싶었지만
중간에 실기 준비를 했던 것을 감안해도 좀 설렁설렁하다 보니
5월이 다 되어가는데도 개발을 끝내지 못했다.
다음 주부터 Nomadcoders의 React 2주 Challenge 기간이라
이번 주에 배포까지 하는 게 목표지만 가능할지는 모르겠다.
일단 힘닿는 데까진 개발을 해보자.이번 주 안에 못 끝내면 다음 주 안에라도 일단 끝내두는 게 맞겠지
이 프로젝트를 처음 시작한 날, 2025년 1월 31일부터
이 글을 쓰고 있는 현재, 2025년 5월 6일까지 프로젝트 개발 과정을 따로 기록해두지는 않았다.
다만 장기적인 관점에서 볼 때, 이번 프로젝트의 개발 과정을 블로그에 남겨두는 게
앞으로 남은 내 개발자 인생에서 조금이나마 도움이 될 것 같다는 생각이 들어서
지금까지 개발했던 기능들을 정리한 글을 이렇게 올려본다.
물론 전부터 생각했던 것은 아니고, 갑자기 머릿속에서 떠올라서 글을 쓴 거라
내용적으로 정리가 안 됐고 그렇기에 글이 전체적으로 엉망인 점은 감안해 두자..
아무튼 앞으로, Maple ToDo 개발 과정을 가능한 선에서 블로그에 올려보도록 하겠다.