frontend : Vue.js 프레임워크 중 quasar 사용후기

우선 커뮤니티가 상대적으로 적은 프레임워크를 사용한 댓가로 상당한 고전을 면치 못했다

영어권과 일본어권을 비롯넘나들며 공식문서와 하나하나 대조해가면서 기능을 추가해야했고

하나의 기능을 추가하기위해서 Vue를 다시 처음부터 공부해야하는 등 상당히 돌아가고 있음을 알게되었다

 

Vue의 기본부터 공부해야한다

 

Vue는 자바스크립트를 사용하는 효과적인 툴이다

이를 효과적으로 사용하기 위해서는 Vue의 문법과 작동원리에 대해서 익숙해져야 한다

템플릿에서 v-for, v-if 등의 다양한 조건식과 이벤트핸들링을 같이 할 수 있어서

jinja2template만 사용하던 입장에서는 확실히 좋은 기능들을 잘 쓸 수 있을 것 같았다

최소한의 기능만 구현하려고 했었지만 그 과정에서 기초부터 배우기도 하고, 자료가 부족해서

구글링의 시간이 상당히 걸렸다

따라서 이번 프로젝트에서는 느낀바로 프론트엔드에 대해서 공부해야 할 깊이가 더 크게 있음을

느끼게 되었다

 

어려웠던점

 

개발환경 조성

개발환경조성에서부터 상당한 애를 먹었다

node의 패키지관리자는 node와 yarn이 있는데 입문 과정에서 어떤 블로그는 npm을,

어떤 유튜브에서는 yarn을 써서 혼란이 있었다

중간에 yarn과 npm을 비교한 후 yarn을 계속 쓰기로 했고

이 과정에서 개발환경을 다시 세팅하는 과정이 있었다

 

CLI가 몇개야?

Quasar CLI까지 가기 위해서 수많은 난관을 명령어를 통해서 해결했다

개발환경에서 OS가 WSL2 Ubuntu LTS 20.04 였기 때문이다

노드의 설치, yarn, Vue CLI, Quasar CLI 등 종류가 워낙 많기 때문에

개념을 잡고 들어가지 않았던 나로서는 공식문서 가이드만이 살길이었다

이 과정에서 느낀 점은 코딩에 앞서서 계획에 프레임워크 사용에 대해

좀 더 치밀하게 계획되어야 한다는 점을 배웠다

 

첫시도에 따른 평소 이상의 오류메세지 그리고 인내심

처음 파이썬에 시도할 때도 그랬다

내가 생각하는 것대로 되지 않는 부분이 너무도 많이 일어났고, 구글링에서도 쉽사리 답을 찾을 수 없는

부분들이 있어서 인내심의 한계에 다달은게 한두번이 아니다

그러나 머리를 식히고 다시 도전하는 순간 문제는 해결되었다

사실 큰 문제였다기 보다는 말그대로 내 인내심의 한계가 먼저 온 것일 뿐이었다

프로젝트를 성공시키고 나서 겪었던 오류를 정리하려고 돌이켜보니 종류가 너무 많고

자잘해서 어떻게 정리해야할지 감이 오지 않을 정도이다

여튼 포기하지만 않으면 반드시 할 수 있다는 것은 확실하게 배웠다

 

앞으로 더 배워나가야 할 부분

Vue를 통해 만들어진 예제를 좀 더 탐색해서 내것으로 만들 필요가 있으며

Front단에서 입력받은 텍스트를 통해서 Back단에 API 요청을 하는데 개념이

많이 부족함을 느꼈다

CORS와 관련하여 좀 더 지식을 쌓을 필요가 있으며

CRUD의 활용을 위한 제일 기본인 게시판부터 시작할 필요성이 있음을 느꼈다

특히 front와 back의 서버운용을 동시에 하는 부분에 대해서 다른 많은 예제들이

docker-compose를 활용하는 것을 보았는데 결국은

full stack 강의 하나를 완전히 따라가면서 DB활용까지 어떻게 해나가는지

공부해볼 생각이다

 

https://github.com/dlfrnaos19/basic_vue_fastapi

GitHub - dlfrnaos19/basic_vue_fastapi