-
질문 & 답변
카테고리
-
세부 분야
프론트엔드
-
해결 여부
미해결
Vue3 + Typescript + Vite + Pinia 참조
23.12.05 01:41 작성 조회수 601
1
안녕하세요.
캡틴판교님이 vue-news를 포함하여 대부분 Vue2로 강의를 하셔서 저는 Vue3로 리팩토링 해봤습니다. 최근 Vue3로 작업(Composition API 쓰는 맛이 😇)을 많이 하시는 것 같고, 이미 저는 Tistory 블로그를 Vue3로 커스텀하여 운영하고 있기도 하고, 이번에 Typescript 강좌를 다 보면서 힘들어도 굳이 Vue3로 작업해보고 싶었거든요. 혹시나 저처럼 해보고 싶은 분들이 계실 것 같아 작업한 내용이 아래 링크에 있으니 참조하시면 편하실 것 같습니다. 🫡
이전에 작업했던 vue-news는 제가 따로 GitHub에 올려놨기 때문에 그 소스를 기반으로 작업하였습니다. 아래와 같이 꽤 변경한 부분이 있으나 어느 정도 숙달된 분들은 가이드 문서 보시고 따라오시면 금방하실 거라 생각되며, 참고로 저는 Composition API로 작성하는 게 맘에 들어서 이를 적극적으로 적용하였습니다.
Use Vue3, Setup Composition API, Typescript
Vue-CLI -> Vite
Vuex -> Pinia
Add scroll event to
/newsURLCSS & Header
Vue.js + TypeScript 완벽 가이드
라우터 파일에 TS 적용 및 라이브러리 내부 타입 선언 파일 설명
강의실 바로가기
답변을 작성해보세요.
1
1
인프런 AI 인턴
2023.12.07
안녕하세요, 인프런 AI 인턴입니다.
캡틴판교님, couse_title으로 ‘Vue.js + TypeScript 완벽 가이드’라는 강의가 있군요. 해당 강의가 Vue2를 기반으로 진행된다는 사실을 고려하여 하구리님이 Vue3로 리팩토링해보신 경험이 매우 인상적입니다. Typescript와 함께 Composition API의 사용이 마음에 드셨다니 Vue3의 특장점을 잘 활용하신 것 같네요. 또한, Vue-CLI에서 Vite 로의 전환과 Vuex에서 Pinia로의 이동, 스크롤 이벤트 추가 등 다양한 변화를 적용하셨군요.
하구리님의 GitHub에 공유하신 작업물은 Vue3와 Typescript를 사용하여 프로젝트를 진행하거나 Composition API에 관심이 있는 분들에게 매우 유용한 리소스가 될 것 같습니다. 링크 공유 감사드리며, 이러한 자료는 학습에 있어서 많은 도움이 될 것으로 생각합니다.
링크: https://github.com/haguri-peng/vue-news-typescript
다른 학습자 분들도 하구리님의 공유해주신 리팩토링 경험을 통해 Vue3와 Typescript에 대한 실용적인 접근 방법을 배울 수 있을 것입니다. 질문하시거나 공유하고 싶은 내용이 더 있으시면 언제든지 문의주세요!
답변 2