반응형

전체 글 83

window.onload() 및 DOMCountentLoaded 차이점

JavaScript에서 window.onload및 는 모두 DOMContentLoaded웹 페이지가 로드될 때 코드를 실행하는 데 사용되는 이벤트입니다. 그러나 로드 프로세스 중 서로 다른 지점에서 트리거되며 사용 사례도 다릅니다. 각각에 대한 설명은 다음과 같습니다.window.onloadwindow.onload스타일시트, 이미지, 하위 프레임과 같은 모든 종속 리소스를 포함하여 전체 페이지가 완전히 로드되면 이벤트가 시작됩니다 . 즉, window.onload페이지의 모든 항목이 완전히 로드될 때까지 내부 코드가 실행되지 않습니다. window.onload = function() { // Code to run when the full page is fully loaded console.lo..

Javascript 2024.06.27

Java thread dump+core dump 생성 방법

Java Thread Dump 생성 방법Java thread dump는 Java Virtual Machine (JVM)에서 실행 중인 모든 스레드의 상태를 출력한 것입니다. 다음과 같은 방법으로 생성할 수 있습니다.JVM Signal (Kill Command) 사용:Unix/Linux 시스템에서 kill -3 [PID] 명령을 사용하면, JVM은 thread dump를 생성하여 표준 출력(stdout)에 출력합니다.kill -3 [PID]Windows에서는 CTRL + BREAK 키를 사용하면 됩니다.jstack 유틸리티 사용:jstack은 Java Development Kit (JDK)에 포함된 도구로, 실행 중인 JVM의 thread dump를 생성할 수 있습니다.jstack [PID] > threa..

Java 2024.06.24

AWS nlb와 alb를 같이 쓰는 이유

NLB(Network Load Balancer)와 ALB(Application Load Balancer)를 함께 사용하는 이유는 각 로드 밸런서의 강점을 결합하여 더 나은 성능, 유연성, 및 보안을 제공하기 위해서입니다. NLB와 ALB를 함께 사용하는 주요 이유는 다음과 같습니다:성능 최적화:NLB: 초당 많은 양의 요청을 처리하고, 매우 낮은 레이턴시를 제공하며, TCP 및 UDP 트래픽을 직접 처리할 수 있습니다.ALB: HTTP 및 HTTPS 트래픽을 처리하며, 고급 라우팅 기능을 제공하여 요청을 특정 백엔드 서비스나 마이크로서비스로 라우팅할 수 있습니다.보안:NLB는 VPC 내부의 IP 주소로만 접근을 허용하는 등의 네트워크 레벨 보안을 강화할 수 있습니다.ALB는 HTTPS 트래픽의 종단점을 ..

AWS 2024.06.20

css ul li 수직바 쉽게 넣는방법

ul 태그 내의 li 요소 사이에 수직 바(Vertical Bar)를 추가하려면, CSS를 사용하여 li 요소 간에 경계를 설정할 수 있습니다. 다음은 그 예입니다: Item 1 Item 2 Item 3 Item 4 이 예제는 ul 요소를 플렉스 컨테이너로 만들고, 각 li 요소의 오른쪽에 수직 바를 추가하는 방식입니다. 마지막 li 요소에는 수직 바를 추가하지 않도록 :not(:last-child) 선택자를 사용했습니다. 위 코드에서는 각 li 요소에 수직 바를 추가하고, CSS의 ::after 가상 요소를 사용하여 수직 바를 생성했습니다. position: absolute를 사용하여 바의 위치를 조정하고, right: -10px로 바의 위치를 세밀하게 설정했습니다. 필요에 따라 색상, 위치 등..

css 2024.06.12

css display flex grid 어떨때 사용할까?

CSS에서 Flexbox와 Grid 레이아웃 시스템은 각각 다른 상황에 적합하며, 다음과 같은 기준을 통해 어떤 시스템을 사용할지 결정할 수 있습니다:FlexboxFlexbox는 일차원 레이아웃 시스템으로, 주로 한 방향(행 또는 열)으로 아이템을 배치하는 데 유리합니다. 다음과 같은 상황에서 Flexbox를 사용합니다:단일 행 또는 단일 열 레이아웃: Flexbox는 단일 행이나 단일 열로 구성된 간단한 레이아웃에 적합합니다. 예를 들어, 네비게이션 바, 버튼 그룹, 카드 목록 등.정렬과 간격 조정: Flexbox는 아이템을 중앙 정렬하거나, 끝에 정렬하거나, 고르게 간격을 조정하는 작업을 쉽게 할 수 있습니다. justify-content와 align-items 속성을 활용해 간단하게 배치할 수 있습..

css 2024.06.11

css button, a 태그 어떨때 사용해야 하나?

HTML의 태그와 태그는 각각 다른 용도와 목적을 가지고 있습니다. 사용 시기와 방법을 명확히 이해하는 것은 웹 페이지의 의미를 명확하게 하고, 접근성을 높이며, 사용자 경험을 향상시킵니다.  태그사용 시기:폼 제출: 폼 데이터를 서버에 전송할 때 사용합니다.JavaScript 액션: JavaScript 함수를 호출하거나 이벤트를 트리거할 때 사용합니다.인터랙티브 요소: 페이지 내에서 동작을 수행하는 버튼 (예: 모달 열기, 콘텐츠 토글 등)으로 사용합니다.예제:폼 제출 Name: Submit 은 폼 데이터를 서버에 제출합니다.JavaScript 액션Click Me  은 클릭 시 JavaScript 경고를 표시합니다. 태그사용 시기:내비게이션: 다른 페이지나 외부 사이트로 이동할 때..

css 2024.06.11

css button a 같은 클래스 이름으로 사이즈가 틀린 이유

CSS에서 button과 a 요소에 같은 클래스 이름을 적용했을 때, 요소의 사이즈가 다르게 나타나는 이유는 기본 스타일과 레이아웃 특성 때문입니다. HTML 요소들은 브라우저마다 기본 스타일이 다르게 적용되며, 요소의 디스플레이 특성(display property)이 요소의 크기와 레이아웃에 영향을 미칠 수 있습니다.기본 스타일 차이브라우저는 각 HTML 요소에 기본 스타일을 적용합니다. 이 기본 스타일은 요소의 패딩, 마진, 보더, 폰트 사이즈, 그리고 기타 속성들을 포함합니다. button과 a 요소는 이러한 기본 스타일에서 차이가 있습니다.예를 들어, 기본적으로 button 요소는 내부 패딩과 테두리를 가지고 있을 수 있으며, a 요소는 그러한 기본 스타일이 없을 수 있습니다.디스플레이 속성 차이..

css 2024.06.07

AWS VPC란

AWS VPC (Amazon Virtual Private Cloud)는 Amazon Web Services (AWS)에서 제공하는 클라우드 리소스가 배치될 수 있는 논리적으로 격리된 네트워크를 설정할 수 있는 서비스입니다. 이를 통해 사용자는 자체 데이터 센터와 유사한 방식으로 AWS의 가상 네트워크를 정의하고 제어할 수 있습니다. AWS VPC의 주요 기능과 특징을 소개하겠습니다.AWS VPC의 주요 기능서브넷 (Subnets)VPC 내에 여러 서브넷을 생성할 수 있습니다. 서브넷은 가용 영역(AZ) 내에 존재하며, 공용 서브넷과 사설 서브넷으로 나눌 수 있습니다.공용 서브넷은 인터넷 게이트웨이를 통해 인터넷과 통신할 수 있으며, 사설 서브넷은 외부 인터넷에 직접 접근할 수 없습니다.라우팅 테이블 (R..

카테고리 없음 2024.06.05