MARKUP
디자인 50% / 퍼블리싱 100%
2018.08.13 ~ 2018.11.12
CJ ENM AMEX(Advanced Media Exchange) - CJ ENM의 영업부문에서 고객 유치를 위해 운영하는 사이트의 PC/Mobile의 고도화 작업에 Vue를 기반으로 한 프레임워크인 Vuetify를 사용하여 모바일, 태블릿에 대응하는 사이트를 구축.
처음으로 Vue를 사용한 관계로 익숙하지 않았으나, 후반부로 갈수록 Vue의 문법과 컴포넌트의 사용에 익숙해지면서 작업이 수월하였음. 상대적으로 자바스크립트에 약한 마크업 엔지니어도 기본적인 Vue의 문법을 익히면 상당히 많은 처리가 가능하다는 것을 배울 수 있었던 프로젝트로 props나 유효성 검사를 위한 default type의 설정 등 일반적인 마크업에서는 해결하기 힘든 것들이 설정 가능하여 마크업 단계에서 확인 가능한 범위가 넓다는 것을 체험할 수 있었음.
이벤트의 제어등은 확실히 어려웠으며 부모 자식 간 데이터를 주고받는 단계 등에서 고생했고 결국 스스로 문제를 해결하지 못했던 부분이 많았던 프로젝트로 ES6를 활용한 네이티브 스크립트로 화면을 제어하기 힘들었던 부분이 스스로 가장 아쉬웠던 부분임.
스크립트 부분은 개인의 능력상 아쉬움은 있었지만, 마크업적인 측면에서는 Vue로 가능한 범위를 일부 확인할 수 있었던 시간이었고 무엇보다 평소 관심을 많이 가지고 있던 모듈화에 대한 이해도를 한 단계 높일 수 있었던, 개인적으로는 실험적이라고도 할 수 있는 프로젝트였다 생각됨. 초기에는 불편할 것이라 여겨졌던, 단점이라 보이던 방법이 Vue파일에서 HTML, 스크립트, CSS를 하나로 관리하며 컴포넌트 단위별로 제어할 수 있다는 부분이 프로젝트를 통해 무척 매력적인 부분이라 생각되었고 규모가 커질수록 단위별로 어떤 관리가 되어야 할지 좀 더 고민이 필요하고 숙고해야 할 부분으로 앞으로 계속 공부가 필요한 부분이라 생각되었고 그동안 별도로 Gulp등으로 환경을 구축하던 방법이 필요 없이 프로젝트 자체에서 거의 모든 것들이 가능했던 부분도 매력적이라 생각되었음.
기회가 된다면 좀더 스크립트 친화적인 프로젝트에서 마크업을 해보고 싶다는 생각이 들었던 프로젝트로 순수한 Vue가 아닌 Vuetify 프레임워크를 기준으로 작업되었으나 Vue에 대한 이해도를 높일 수 있었고 디자이너가 없는 프로젝트여서 전체적인 톤, 레이아웃 등의 디자인도 담당하였음.
