Vue 프로젝트 로딩 과정 분석: index.html부터 컴포넌트 렌더링까지
Vue 프로젝트를 실행하면 브라우저에서 애플리케이션이 어떻게 구성되고 로딩되는지 이해하는 것은 중요합니다. 이 글에서는 Vue CLI로 생성된 기본 프로젝트를 기준으로 index.html, main.js, App.vue, index.js(라우터 설정 파일)의 관계와 로딩 순서를 분석합니다.
프로젝트 구조 개요
Vue CLI로 생성된 프로젝트는 일반적으로 다음과 같은 핵심 파일들로 구성됩니다:
...
6월 5일 01:31에 게시됨
Vue에서 HTML을 Word 문서로 내보내기
개요
Vue 프로젝트에서 HTML 내용을 Word 문서로 내보내는 방법에 대해 설명합니다. 이 방법은 템플릿이 필요 없으며, echarts 차트도 포함하여 내보낼 수 있습니다. html-docx-js와 file-saver 패키지를 사용하여 구현합니다.
구현 방식은 다음과 같습니다:
HTML 요소 가져오기
페이지의 Canvas 요소를 이미지로 변환
변환된 이미지를 Word 파일에 포함하여 내보내기
...
5월 24일 04:50에 게시됨
Vue와 ZEGO SDK를 활용한 웹 멀티 유저 실시간 화상 채팅 구현
웹 환경에서 실시간 멀티 유저 오디오 및 비디오 통신은 다양한 인터랙티브 서비스의 핵심 기능입니다. 이 글에서는 Vue 프레임워크와 ZEGO Express SDK를 사용하여 복잡한 설정 없이 안정적인 다중 화상 채팅 기능을 구축하는 방법을 다룹니다.
주요 적용 시나리오
기업용 화상 회의: 원격 근무 및 팀 협업을 위한 다중 참여자 실시간 커뮤니케이션.
온라인 소규모 ...
5월 23일 22:04에 게시됨
Vue SPA에서 OIDC-Client를 사용한 암시적 권한 부여 기반 SSO 구현
1. 개요
본 문서에서는 JavaScript 클라이언트 인증을 구현하는 방법을 다룬다. 이전 예제를 바탕으로 Vue CLI로 생성한 클라이언트 애플리케이션에서 oidc-client-js 라이브러리를 사용하여 인증을 처리한다. 클라이언트 자격 증명은 기본적으로 cookie에 저장된다.
2. 서버측 Client 설정
순수 JavaScript 클라이언트를 추가하려면 새로운 클라이언트 등록이 필요하며 ...
5월 22일 20:47에 게시됨