본문 바로가기

JS6

10. Vuex Store 2024.03.18 로그인부터 개발 진행 중에 있는데 쿠키 및 세션 관리를 위해 Vuex Store를 통해 개발을 진행하며, 간단한 예제소스와 설명을 남긴다. 1. 의의 Vue.js 애플리케이션에서 상태 관리를 위해 주로 사용되는 Vuex라이브러리를 통해 상태 관리를 할 수 있다. Vuex는 Vue.js 애플리케이션의 모든 컴포넌트에 대한 중앙 집중식 저장소 역할을 하며, 이를 통해 상태를 예측 가능한 방식으로 관리한다. 2. Vuex의 핵심 개념 State (상태): 애플리케이션의 중앙 저장소로, 컴포넌트 간에 공유되는 데이터. Getters (게터): State에 접근하는 계산된 속성입니다. State의 일부 데이터를 가져오거나 가공하여 반환할 수 있다. Mutations (뮤테이션): State를 .. 2024. 3. 18.
07. DOM(Document Object Model) 2024.01.23(화) Vue.js만 사용하다가 React를 따로 공부하면서 DOM에 대해 따로 정리를 해보았다. DOM이란? Document Object Model의 약어로, 웹 페이지의 구조를 표현하는 프로그래밍 인터페이스이다. 이는 HTML, XML 등의 문서를 계층 구조로 나타내고, 각 요소에 대한 접근과 조작을 가능케 한다. DOM은 웹 페이지의 동적인 변경이나 조작을 가능케 하며, 자바스크립트와 같은 스크립팅 언어를 통해 조작된다. 가상 DOM(Virtual DOM)이란? 애플리케이션 성능을 최적화하기 위한 기술 중 하나이며, 가상 DOM은 실제 DOM과 동일한 구조를 가지지만 메모리 상에서만 존재하며, 변경 사항을 추적하여 실제 DOM에 일괄적으로 적용함으로써 렌더링 효율을 높인다. 이는 .. 2024. 1. 23.
04. 자바스크립트 eval() 함수 2024.01.11(목) ERP 유지보수 개발 중 jsp 파일에 js 파일을 따로 includ로 빼놓아서 무슨 이유가 있나 봤더니 같은 기능인데 함수명과 변수명 뒤에 숫자로 구별해 놓고 같은 함수를 여러 개를 중복으로 만들어놨다. 마침, 이 함수에 문제가 있어서 수정했어야 했는데 이왕 수정하는 거 중복 코드도 같이 수정해야겠다 마음을 먹었다. 어떻게 하면 이쁘게 만들까하며 검색하던 중 딴 길로 새서 eval() 함수까지 검색하고, 사용을 지양한다는 글이 많이 있어 이유를 자세히 알고 싶어 알아보았다. eval() 함수란? - JavaScript에서 문자열을 코드로 실행하는 데 사용되는 함수이며, 이 함수는 문자열을 JavaScript 코드로 해석하고 실행한다. 주로 동적으로 생성된 코드나 문자열을 실행해.. 2024. 1. 11.
28. 웹소켓 1. 웹소켓이란 하나의 TCP 접속에 전이중 통신 채널을 제공하는 컴퓨터 통신 프로토콜로 클라이언트와 서버 간의 양방향 통신을 가능하게 하며, 실시간 데이터 전송을 할 수 있게 해 준다. 즉, 클라이언트와 서버 간 소켓 연결을 유지해서 언제든지 양방향 통신이 가능하도록 하는 기술이다. 실무에서 웹소켓 기술을 사용하는 사례 - 지도 : 지도상에 움직이는 특정 객체의 위치를 실시간으로 표기해야 하는 경우 (카카오 T의 실시간 위치, 배달의 민족 라이더 위치 표시, 구글지도에서 움직이는 내 위치 표시 등) - 대시보드 : 기업의 실시간 매출 지표, 성과 지표 등을 대시보드로 구성해서 사용 (매출 성과 대시보드, KPI 대시보드 등) - 실시간 지표 : 주식, 환율 등 실시간 변화하는 수치를 제공하는 경우 2... 2023. 4. 30.
728x90
반응형