Vue

⚡ 개요최근에 프로젝트를 하면서 신규로 적용했던 내용을 정리하려고 한다. 일단 공식 가이드 문서가 순차적으로 잘 되어있기 때문에 공식 가이드를 먼저 보는 걸 추천한다 (링크)  공식 가이드 문서가 잘 되어 있기때문에 설치에 대한 내용은 보고 따라 하는 게 편하다. vue cli를 통해서 라이브러리를 추가하는 방법도 존재하고, 이미 프로젝트가 존재하는 경우에도 추가하는 방법이 자세히 설명되어 있다. ⚡ 사용 이유공식 가이드에 따른 장점과 내가 적용을 하면서 느낀 사용 이유에 대해서 정리를 해놓으려고 한다.  📗 공식 가이드 문서 기준 사용 이유 (링크)1. 지원 범위가 넓다.React를 기준으로 가이드가 작성되어 있지만 다른 FrontEnd 프레임 워크를 지원 하고 있다. 2. HTTP 네트워크 통신아마..

📑 개요지난번에 작성했던 블로그의 내용은 완전 기초적인 내용 및 설정에 대해서 설명을 했다면 이번에는 세부적으로 샘플 코드를 작업하면서 나온 내용에 대해서 정리를 하고 작업 간에 했던 생각을 적어 보려고 한다. :) 📕 구조BackEnd내가 이번 프로젝트에서 잡은 구조는 도메인 구조이다. 계층형 구조와 도메인 구조에 대해서 비교를 하는 블로그들을 많이 보았다.내용을 살펴보면 알겠지만 정답은 없다. 장단점에 따라서 프로젝트에 맞는 구조를 사용해서 개발을 진행하면 된다. (유지보수를 위해서라도) 본론으로 돌아와서 도메인 구조를 잡은 이유에 대해서 설명하도록 하겠다.패키지별 분리를 했을때 내용을 파악하는데 더 쉽다고 판단프로젝트 개발간에 기획이 변경되는 상황이 많이 발생하는데 이때 유리하다고 판단확장성을 ..

📑 개요신규 프로젝트 작업을 해야 하는 상황이 있어서 이번 기회에 spring boot, kotlin과 vue 최신 버전을 기준으로 초기 세팅 작업을 했고 이 과정을 기록하려고 한다. 버전에 따라 없어진 내용도 존재하고, 추가된 내용도 존재하니 체크를 해보는 게 좋을 거 같다. 아래의 이미지는 이번에 프로젝트를 작업 하면서 만든 패키지 구조이다. (참조용) 📑 기술 스택BackEndjava 21자바의 미래라고 불리는 virtual thread를 사용해보고 싶어서 버전을 21 이상을 사용하려고 생각했고 21이 LTS 버전이라서 사용하게 되었다.kotlin 1.9.23spring boot 3.2.4DGS 8.6.0넷플릭스에서 개발한 GraphQL 프레임워크이다. 예전에 한번 내용일 살펴보고 테스트를 해봤..

⚡ 개요 vue 를 사용하는데 있어서 기본적인 사용 방법에 대해서 정리를 하려고 한다. 프론트쪽 개발도 간간히 같이 하고 있는데 jsp를 개발할때와는 다르게 내 기준으로는 작업을 하는데 이해가 안되는 부분도 많고 왜 이렇게 동작하는지 이해가 안가는 부분이 많아서 최근에 백엔드 공부와 별개로 정리 하면서 공부를 하고 있다. ⚡ 라이브러리 정리 📒 Vuex 애플리케이션의 상태를 효율적으로 관리하기 위한 중앙 집중식 저장소다. Vue Store는 일반적으로 Vuex라는 Vue.js 공식 상태 관리 라이브러리를 사용하여 구현된다. (vue3.x 에서는 공식 상태 관리 라이브러리가 pinia로 바뀌었다.) Vuex를 사용하면 애플리케이션의 모든 컴포넌트에서 전역으로 상태를 관리할 수 있으며, 상태의 변화를 추적하..

⚡ 개요 회사에서 프로젝트를 개발하면서 vue.js를 처음 사용하게 되었다. 처음에는 아무것도 모르고 사용을 했고 어느 정도 사용했을 때는 내가 잘 알고 사용하는 것이 맞는가? 이렇게 사용해도 되는 건가? 에 대한 의문이 들었고 vue에 대해서 기본적인 내용과 추가적으로 내가 개발하면서 느꼈던 내용들을 정리해놓으려고 한다. ⚡ vue란 무엇인가? 탄생 배경 및 기본적인 개념 Vue.js는 Evan You가 개인적으로 개발하면서 AngularJS와 React.js를 참고하여 만든 자바스크립트 프레임워크이다. Vue.js의 가장 큰 특징은 간결한 문법과 컴포넌트 기반 아키텍처, 그리고 반응형 UI를 제공한다는 것이다. Vue.js는 MVVM(Model-View-ViewModel) 아키텍처를 기반으로 한다. ..