반응형 vue4 Vue Progressive Framework 프로그레시브 프레임워크 (Progressive Framework) Vue는 프로그레시브 프레임워크 라고 한다. 한글로 풀이하면 점진적인 프레임워크이다. 점진적 조금씩 앞으로 나아가는 것. 🤔 그럼 Vue는 무엇을 조금씩 앞으로 나아간다는 것인가?? Vue는 프레임워크이니만큼 프론트엔드 개발에 필요한 많은 기능을 담고 있다. 렌더링, 컴포넌트, 라우팅, 상태관리, 서버사이드 렌더링 등 다양한 기능이 있지만, 우리가 개발하려는 프로젝트에서 이것들을 모두 다 사용할 필요는 없을 수 있다. 아주 간단한 프로젝트를 위해 Vue의 최소기능만 가져다가 사용할 수 있으며, 프로젝트가 조금씩 확장해가면서 Vue의 기능들을 하나씩 적용시켜 나갈 수 있다. 👉 즉, 처음에는 Vue의 최소한의 기능만으로 개발을 시작하고 점진.. 2023. 3. 11. Vue 시작하기전 알아야할 핵심 특징 - 컴포넌트, 선언적렌더링, 반응성 Vue는 UI를 만들기 위한 자바스크립트 프레임워크이다. Vue를 사용하면 웹사이트 UI를 너무나 편하게 만들 수 있다. Vue를 시작하려면 기본 개념을 먼저 알아야 한다. Vue의 가장 기초가 되는 개념은 바로 컴포넌트, 선언적 렌더링, 반응성이다. 컴포넌트 (Component) 가장 중요한 특징이라면 컴포넌트 기반의 프로그래밍 모델 방식을 제공한다. 이것은 React와 같은 현대의 대부분의 프론트엔드 개발 라이브러리나 프레임워크가 추구하는 방식이다. 컴포넌트는 그림과 같이 모든 UI를 재사용 가능하도록 하나하나 쪼개서 캡슐화하는 것이다. 이렇게 쪼개진 하나하나가 컴포넌트이다. 이 컴포넌트를 어디서든 가져다가 붙이기만 하면 재사용이 너무 쉽고, 코드도 훨씬 간결해질 수 있다. 🚨 Vue에서는 이렇게 컴.. 2023. 3. 10. JWT를 활용한 로그인 인증 구현 JWT 로그인 인증을 구현하기 위해 Session 과 JWT 방식 중에 엄청난 고민을 하다가, 아무래도 DB를 덜 사용하고 MSA에 유리한 JWT 방식을 사용하기로 마음먹었다. 개발 코드: Vue, NuxtJS 1. JWT 인증 최종 구현 모델 JWT에 대한 세부적인 스펙과 관련한 설명은 생략하도록 하겠다. JWT 토큰을 이용해 어떻게 안전하게 인증 시스템을 만들어야 하는지에 초첨을 두었다. 🤜 일단 결론적으로 아래 그림이 내가 구현한 인증 모델이다. 크게 3가지 부분으로 나뉜다. ① 로그인 일단 로그인을 요청하면 사용자 정보를 확인하고 JWT를 사용하여 AccessToken과 RefreshToken을 발급한다. 👉 토큰 만료시간 만료시간을 AccessToken은 짧게, RefreshToken은 길게 잡.. 2023. 3. 8. 내가 React가 아닌 Vue를 쓰는 이유 1. Vue / React Vue React Vue와 React는 모두 프론트엔드를 편하게 개발하기 위한 Javascript로 만들어진 도구이다. 이제는 이것들 없이 프론트 개발을 한다는 것은 상상하기도 싫다. 둘다 컨셉은 동일하다. 모든 UI를 스스로 동작하는 컴포넌트 단위로 개발해서 어디든 편하게 가져다 쓸 수 있게하는 것이다. 페이지 단위가 아닌 더 작은 단위의 컴포넌트를 개발하여 재사용성과 코드의 간결함을 유지한다. 모든 개발의 지향점은 코드 중복을 없애고 코드의 단위를 사람이 알기 쉽게 논리적으로 구조화하는 것이 궁극적 목적인데, Vue와 React도 결국 이러한 목적을 위한 것이다. 2. NuxtJS / NextJS 이걸 또 더 편하게 개발하라고 Vue는 NuxtJS, React는 NextJS.. 2023. 3. 7. 이전 1 다음 반응형