JQuery에서 Vue로 가는 과정

dev·2021년 4월 6일
0

frontend

목록 보기
1/4

프론트엔드 변화

  • jqeury → vue cdn → vue cli mpa → vue cli spa
  • 이전 직장에서 하던 프로젝트 프론트엔드 개선 과정이다

jqeury → vue cdn

  • 입사하고 바로 긴박하게 새로운 사항을 개발해야하는 상황이 왔다, 기존 프로젝트는 Spring Boot에 template engine으로 되어있었고, jqeury를 사용한적 없던 나를 위해 프론트엔드 개발자였던 동료가 내가 익숙하게 사용하던 vue를 cdn 방식으로 사용하는것을 추천해줬다. html파일에 vue script만 추가하면 사용할 수 있었기에 기존 프로젝트에 문제없이 사용할 수 있었다.

vue cdn → vue cli mpa

cdn 방식으로 개발했을시 불편했던점

  • 공통 적인 부분들은 컴포넌트같은 경우는 분리가 가능했지만, 컴포넌트 분리에 불편함이 많았다.
  • npm 라이브러리들을 사용하지 못하는경우가많다, cdn 지원하는 라이브러리만 사용가능.
  • global state관리를 하고싶었다.
  • 위와같이 불편한점이 많아 웹팩을 사용해 vue mpa로 구성해 드디어 npm을 사용할 수 있게되었다.

vue cli mpa → vue cli spa

  • map로 구성했던 이유는 번들 사이즈를 줄여서 더 빠른 로드를 하기위함은 아니었다.
  • 헤더와 사이드바 레이아웃부분은 기존에 jqeury로 개발되어있던 부분들을 계속 사용하고 있었던것을 vue로 동일하게 개발해, 전체를 vue로 옮길수있게되어 spa로 설정을 변경.

현재

  • 이글을 작성하고있는 현시점 직장에서도 spring 프로젝트에 template engine으로 되어있어서 이전의 경험으로 손쉽게 신규 사항들을 spa로 추가해 개발하고있다.

0개의 댓글