기록

HTTP 상태 코드 (HTTP Status Codes)웹서버나 클라이언트 간 통신에서 응답 상태를 나타내는 3자리 숫자 코드 상태 코드의미설명1xx정보 응답(Informational)요청을 받았고 처리 중임을 알림2xx성공(Success)요청이 정상적으로 처리됨200OK성공적으로 요청 처리 완료201Created요청이 성공적으로 수행되어 자원 생성됨3xx리다이렉션(Redirection)클라이언트가 추가 작업 필요301Moved Permanently요청한 리소스가 영구적으로 다른 위치로 이동됨302Found요청한 리소스가 임시로 다른 위치로 이동됨4xx클라이언트 오류(Client Error)요청에 오류가 있어 서버가 수행 불가400Bad Request잘못된 요청401Unauthorized인증 필요403Fo..

📌 1. SOAP 개념과 REST와의 비교REST와 SOAP는 각기 다른 두 가지의 온라인 데이터 전송 방식. SOAP는 프로토콜, REST는 아키텍처 스타일이다.📌 1-1. SOAP (Simple Object Access Protocol)✅ 1-1-1. SOAP 기본 개념SOAP은 XML 기반의 메시징 프로토콜. 즉, 두 시스템이 데이터를 주고받는 방식에 대한 규격을 정해놓은 표준.SOAP 메시지는 XML 포맷으로 요청과 응답을 주고받고, 이를 기반으로 시스템 간의 상호작용을 정의.✅ 1-1-2. SOAP 특징프로토콜 기반: SOAP은 네트워크 프로토콜에 종속적이지 않지만, HTTP, SMTP, FTP 등 다양한 프로토콜을 사용할 수 있다.메시지 포맷: SOAP은 XML 포맷을 사용하여 데이터를 주..

📌 JSP에서 JavaScript 모듈 사용하기JSP에서 JavaScript 모듈을 사용하려면 몇 가지 주의해야 할 점이 있다. 특히, 를 사용하면 된다.common.js 파일이 로드되며, 전역 스코프에서 사용 가능. 하지만 ES6 모듈을 사용하면 이렇게 로드할 수 없다. 📌 2. ES6 모듈(export / import) 사용 방법ES6 모듈을 사용하려면 ✔️ 모듈을 사용하면 import 키워드를 통해 특정 함수만 가져올 수 있다. ❌ 이클립스에서는 ✔️ JSP에서 없이도 ES6 모듈처럼 활용할 수 있다. ✔️ 이클립스에서도 코드 색상이 정상적으로 표시됐다.

📌 JavaScript 코드 실행 순서 & 실행 타이밍 제어 방법JavaScript는 브라우저에서 HTML을 해석하면서 실행된다! 그런데 코드의 실행 순서를 잘못 이해하면 예상과 다르게 동작하거나 오류가 발생할 수도 있다. 😵그래서 JavaScript의 실행 순서와 실행 타이밍을 제어하는 방법을 정리해보았다.✅ 1. JavaScript 코드 실행 순서JavaScript는 HTML을 위에서 아래로 해석하면서 실행된다.   🔹 기본적인 실행 흐름1️⃣ HTML(DOM) 위에서 아래로 해석2️⃣  🔹 실행 결과1️⃣ head 내부 스크립트 실행2️⃣ body 내부 script 실행3️⃣ document ready 실행 (DOM 완성 후)4️⃣ window.onload 실행 (이미지..

Vue Router에서 네비게이션 가드(Navigation Guards)는 사용자가 페이지(라우트) 간 이동할 때 특정 조건을 확인하거나 동작을 수행할 수 있는 메커니즘입니다. 주로 인증과 권한 제어를 위해 사용됩니다. 1. 네비게이션 가드의 종류1-1. 전역 가드 (Global Guards)전역적으로 모든 라우트 변경에 대해 작동합니다.beforeEach라우팅이 시작되기 전에 실행됩니다.주로 인증 또는 권한 확인에 사용됩니다.router.beforeEach((to, from, next) => { if (to.meta.requiresAuth && !isAuthenticated()) { next('/login'); // 인증이 필요하지만 인증되지 않았으면 로그인 페이지로 이동 } else { ..

HTML 문서에서 자바스크립트 파일을 임포트하는 위치는 성능과 사용자 경험에 영향을 미칠 수 있습니다. 자바스크립트를 어디에 삽입하느냐에 따라 페이지 로딩 시간, 초기화 속도, 그리고 페이지 렌더링에 차이가 발생합니다.주요 위치와 각각의 장단점을 살펴보겠습니다.1. - 장점 자바스크립트의 조기 실행: 자바스크립트가 페이지 로딩 초기에 실행되어야 할 때 유용합니다. 예를 들어, 초기 설정이나 중요한 데이터 로드가 필요할 때 사용할 수 있습니다. - 단점렌더링 차단: 자바스크립트 파일이 로드되고 실행될 때까지 HTML 파싱이 중단됩니다. 이는 페이지의 초기 렌더링 속도를 느리게 만듭니다. 2. 태그 끝에 위치 - 장점 렌더링 최적화: HTML 파싱과 렌더링이 완료된 후에 자바스크립트를 ..

호이스팅(hoisting) 이란?자바스크립트에서 변수와 함수의 선언이 해당 스코프의 최상단으로 끌어올려지는 것처럼 동작하는 특성입니다.선언은 스코프의 최상단으로 옮기지만, 초기화(할당)는 그 위치에서 그대로 이루어집니다.호이스팅은 함수와 변수를 다르게 처리합니다. 호이스팅(hoisting) 원인실행 컨텍스트의 생성 단계에서 변수와 함수의 선언이 미리 처리되기 때문에 발생합니다.실행 컨텍스트는 자바스크립트 코드가 실행되는 환경을 정의하며, 함수 호출 또는 전역 코드가 실행될 때마다 생성됩니다.실행 컨텍스트는 생성 단계와 실행 단계로 나뉩니다.생성 단계 (Creation Phase)변수와 함수 선언 처리: 실행 컨텍스트가 생성될 때, 자바스크립트 엔진은 먼저 현재 스코프 내의 변수와 함수 선언을 찾아서 메모..

쿠키(Cookie), 세션(Session), 캐시(Cache)는 웹 애플리케이션에서 데이터를 저장하고 관리하는 데 사용되는 세 가지 주요 개념입니다. 쿠키(Cookie)쿠키는 클라이언트 측(웹 브라우저)에 저장되는 작은 데이터 파일입니다. 주로 사용자와 웹 서버 간의 상태 정보를 저장하고 유지하는 데 사용됩니다.저장 위치: 클라이언트(웹 브라우저)수명: 서버가 설정한 만료 시간까지 지속됨. 만료 시간 없이 설정된 쿠키는 브라우저 세션이 끝나면 삭제됨.사용 예: 로그인 상태 유지, 사용자 설정 저장, 트래킹 정보 저장장점: 서버 부담 감소, 사용자의 장치에 데이터 저장 가능단점: 보안 취약성(쿠키 탈취), 저장 용량 제한(일반적으로 4KB) 세션(Session)세션은 서버 측에서 관리되는 데이터 저장 방식..

React Hooks Hooks 는 리액트 v16.8 에 새로 도입된 기능으로서, 기존의 함수형 컴포넌트에서 할 수 없었던 다양한 작업을 할 수 있게 해줍니다. 함수형 컴포넌트에서 상태(state)와 생명주기(lifecycle) 메서드를 사용할 수 있도록 하는 기능입니다. 코드를 더 간결하고 가독성 있게 작성할 수 있습니다. *함수형 컴포넌트, 클래스형 컴포넌트 https://sumni.tistory.com/69 react Component React Component 비교 Class Component 많은 기능제공, 대신 코드길고복잡, 성능느림 - provide more features - longer code - more complex code - slower performance Functional..

개념 Socket 일반적인 소켓은 네트워크 통신을 위한 엔드포인트를 나타냅니다. TCP/IP 기반의 네트워크에서 사용되며, 클라이언트와 서버 간의 양방향 통신을 가능하게 합니다. 주로 로컬 네트워크 또는 인터넷을 통해 컴퓨터 간의 통신을 할 때 사용됩니다. WebSocket 웹 소켓은 HTML5에서 지원하는 통신 프로토콜로, 클라이언트와 서버 간의 실시간 양방향 통신을 가능하게 합니다. 일반적인 소켓과 달리, 웹 브라우저에서도 사용할 수 있으며, HTTP 프로토콜 위에 구현되어 있습니다. 웹 소켓은 클라이언트와 서버가 지속적으로 연결된 상태를 유지하며, 실시간으로 데이터를 주고받을 수 있습니다. Socket.IO Socket.IO는 웹 소켓을 이용한 실시간 양방향 통신을 구현하기 위한 JavaScript..