ABOUT ME

-

Today
-
Yesterday
-
Total
-
  • TIL_간단한 여행 플래너(?) 제작기 _ 준비
    카테고리 없음 2019. 11. 4. 02:16

    TIL(Today I learned) 을 기록하는 공간입니다.

    잘못된 내용 또는 부족한 내용에 대한 수정 및 지적 환영합니다. 

     


    #시작하며🤟

    요즘 공부하고 있는 React를 복습도 할 겸, 배웠던 내용을 활용한 사이드 프로젝트를 시작해볼까 한다.

    주어진 시간도 얼마 없었던 터라, 간단하게 2주 남짓으로 마무리 되는 작은 규모의 프로젝트였으면 좋겠다.

     

    학생 때 진행했던 JSP 기반의 프로그램을 React로 리팩토링 해보는 방향도 생각해봤지만,

    내가 가진 React 지식으로는 기존의 기능을 모두 구현해 내는 것이 불가능하다고 생각했다.

     

    그렇지만, 그 중에서 쓸모있는 기능을 골라 일부만 구현하는 것은,, 가능할 것 같았다!

    velport님의 Todo-List 튜토리얼을 활용하면 예상한 기간 내에도 충분히 할 수 있을 것 같다.

     

    그래서 선택한 주제, 간단한 여행 플래너 만들기📋

     

    고등학교 때, 자유여행을 즐기는 사람을 타겟으로한 여행 일정 공유 플랫폼을 만든 적이 있다.

    글 목록을 카드뷰 형식으로 구현했다.
    잘 안보이지만, 오른쪽 상단의 버튼으로 컴포넌트를 추가할 수 있다.

     

    대충 이런 형식의 웹사이트였는데, 내가 이번에 리팩토링 하게 된 기능은 오른쪽에 있는 화면이다.

    여행 일정을 작성하는 폼이지만, 작성자가 자유롭게 일정표 형식을 구성할 수 있다.

    사용자는 오른쪽 상단의 관광 명소, 식당, 숙소, 하루끝 버튼을 눌러서 컴포넌트를 추가할 수 있다.

    버튼을 누르면 해당컴포넌트가 추가되고, 필요한 정보들을 기입할 수 있다. (장소명, 별점, 리뷰,,,)

     

    그때는 jsp에 javascript로 구현했던 것 같은데, 소스가 매우 난잡해져서 보기가 힘들었다.

    컴포넌트 기반의 라이브러리인 React로 구현하면 전보다는 훨씬 좋은 코드가 나올 것 같았다.

     

    이 기능을 따로 분리해서 간단하게 계획을 작성할 수 있는 여행 플래너를 만들것이다.

    목적이 복습에 맞춰진 사이드 프로젝트이기 때문에, 몇일 전에 했던

    velopert님의 Todo-List 프로젝트를 참고하여 변형하는쪽으로 진행해보려고 한다.

    그리고 그 과정을 블로그에 기록할 것이다!😉

Designed by Tistory.