블로그

코드스쿼드 프로젝트에서 레인지 슬라이더를 만들어야 할 일이 생겼다. 직접 구현하고 싶었지만 react-range 라는 모듈을 사용해서 구현했고, 프로젝트를 끝내고 주말인 오늘! 직접 구현을 해보려고 책상에 앉았더니 유튜브가 2시간을 뺏어가버렸다.. 하여튼 포스팅과 함께 레인지 슬라이더 만들기를 연습해보려 한다. 현재 시각 2021년 6월 5일 오후 3시 21분 시작! 이번 프로젝트에 구현해야 했던 레인지 슬라이더는 곡선이라는 점을 제외하면 아래의 이미지와 비슷한 느낌! 단방향이 아닌 양방향으로 구현해야 하며, 이를 어떻게 구현해야 할 지 고민만 하고 끝나버렸다. 처음부터 목표를 배포로 잡다보니 많은 기능을 고민했고, 때문에 목표가 좌초되지 않았을까.. 이번에 생각한 기능은 다음과 같다! 1. 기획 필수 ..

프로젝트 글 목차 2021.03.13 - [메모 트리 프로젝트] 1. 기획 2021.03.13 - [메모 트리 프로젝트] 2. 설계 - 와이어프레임, 요구 사항 2021.03.14 - [메모 트리 프로젝트] 3. 설계 - 객체 모델링 2021.03.18 - [메모 트리 프로젝트] 4. UI 구현 - 1 2021.03.19 - [메모 트리 프로젝트] 5. UI 구현 - 2 2021.03.20 - [메모 트리 프로젝트] 6. 나머지 프론트엔드 작업 2021.03.20 - [메모 트리 프로젝트] 7. 배포 및 후기 배포 헤로쿠를 통해 배포하면서 여러 시행착오를 겪었다. 전에는 간단하게 배포해서 이번에도 별다른 문제가 없으리라 예상했는데 여러 문제를 발견했고, 몇몇은 미봉책으로 수정한 상태이다. 1. doten..

프로젝트 글 목차 2021.03.13 - [메모 트리 프로젝트] 1. 기획 2021.03.13 - [메모 트리 프로젝트] 2. 설계 - 와이어프레임, 요구 사항 2021.03.14 - [메모 트리 프로젝트] 3. 설계 - 객체 모델링 2021.03.18 - [메모 트리 프로젝트] 4. UI 구현 - 1 2021.03.19 - [메모 트리 프로젝트] 5. UI 구현 - 2 2021.03.20 - [메모 트리 프로젝트] 6. 나머지 프론트엔드 작업 2021.03.20 - [메모 트리 프로젝트] 7. 배포 및 후기 나머지 프론트엔드 작업 나머지라고 뭉뚱그리기에는 여러 작업이 있었지만 최대한 간략하게 정리했다. 먼저 메모 트리 프로젝트에서 클래스로 분리할만한 기능은 다음과 같았다. 여기서 가장 고민했던 점은 c..

프로젝트 글 목차 2021.03.13 - [메모 트리 프로젝트] 1. 기획 2021.03.13 - [메모 트리 프로젝트] 2. 설계 - 와이어프레임, 요구 사항 2021.03.14 - [메모 트리 프로젝트] 3. 설계 - 객체 모델링 2021.03.18 - [메모 트리 프로젝트] 4. UI 구현 - 1 2021.03.19 - [메모 트리 프로젝트] 5. UI 구현 - 2 2021.03.20 - [메모 트리 프로젝트] 6. 나머지 프론트엔드 작업 2021.03.20 - [메모 트리 프로젝트] 7. 배포 및 후기 선을 그려주는 부분에서 많은 고민을 했다. 처음에는 가상 선택자를 고려하였으나, 굳이 css 영역에서 제어하는 가상 선택자를 수정하기 위해서는 style을 덮어씌우거나 편하게 구현된 jQuery로 ..

프로젝트 글 목차 2021.03.13 - [메모 트리 프로젝트] 1. 기획 2021.03.13 - [메모 트리 프로젝트] 2. 설계 - 와이어프레임, 요구 사항 2021.03.14 - [메모 트리 프로젝트] 3. 설계 - 객체 모델링 2021.03.18 - [메모 트리 프로젝트] 4. UI 구현 - 1 2021.03.19 - [메모 트리 프로젝트] 5. UI 구현 - 2 2021.03.20 - [메모 트리 프로젝트] 6. 나머지 프론트엔드 작업 2021.03.20 - [메모 트리 프로젝트] 7. 배포 및 후기 객체 모델링 모델링에 있어서 가장 고민되는 부분은 사용자에 대한 처리였다. 하지만 로컬에서의 동작이 1차 목표였고, 이에 따라 사용자 처리는 부가적인 부분이니 사용자 값을 할당할 키 값만 고려하면 ..