인프런 커뮤니티 질문&답변

하구리님의 프로필 이미지
하구리

작성한 질문수

Vue.js + TypeScript 완벽 가이드

라우터 파일에 TS 적용 및 라이브러리 내부 타입 선언 파일 설명

Vue3 + Typescript + Vite + Pinia 참조

작성

·

1.3K

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 /news URL

  • CSS & Header

     

https://github.com/haguri-peng/vue-news-typescript

답변 2

1

오우 하구리님, 좋은 자료 공유해 주셔서 감사합니다 🙂 다른 분들이 보고 도움 많이 되실 것 같아요!

1

안녕하세요, 인프런 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에 대한 실용적인 접근 방법을 배울 수 있을 것입니다. 질문하시거나 공유하고 싶은 내용이 더 있으시면 언제든지 문의주세요!

하구리님의 프로필 이미지
하구리

작성한 질문수

질문하기