본문 바로가기
728x90

Todo78

JavaScript this 이제 헷갈리지말자 자바스크립트에서 this는 많은 개발자들에게 혼란을 주는 개념입니다. this가 참조하는 값은 코드가 실행되는 문맥(context) 에 따라 달라지기 때문인데요. 특히 함수나 메서드 내에서 this가 어떻게 동작하는지 이해하는 것이 중요합니다. 시작하기 전 this는 호출한 주체라는 것을 기억하고, 이번 포스팅에서 예제와 함께 this를 확실하게 알아봅시다.this에 대한 기본 개념을 파악setTimeout 함수에서의 this 값 파악🔧  JavaScript에서 this란?this는 호출한 주체이다. this는 객체이지만 문제는 이 this가 어떤 객체인지가 헷갈립니다. this의 값은 함수를 호출하는 방법에 의해 결정됩니다.호출한 주체가 없을 경우 기본값인 window가 객체가 됩니다. (전역 스코프.. 2025. 1. 5.
HTML파일에서 JS파일을 효과적으로 가져오는 법 프론트엔드 개발자로서 성능 최적화는 중요한 과제입니다. HTML 문서에서 JavaScript 파일을 가져올 때, script 태그의 기본 동작과 함께 HTML5에 추가된 defer 및 async 속성을 활용하면 로딩 속도를 개선하고 성능을 최적화할 수 있습니다. 이번 포스팅에서는 각각의 개념과 올바른 사용 예시를 간단하게 알아봅시다.🔖 HTML 코드는 위에서부터 아래로 파싱됩니다.script 태그의 기본 동작HTML로 파일을 작성할 때 script태그를 사용해 JS 파일을 불러올 수 있습니다. 브라우저가 HTML 파일을 위에서부터 아래로 순차적으로 파싱하면서 🔧 script 태그의 문제점 알기script 태그를 head 태그에 위치하거나 body 태그 최상단에 넣을 경우 HTML이 다 파싱되기 전에 .. 2025. 1. 4.
DOM과 BOM 차이 바로 알기 DOM과 BOM웹 개발을 시작하면서 JavaScript를 배우다 보면 "DOM"과 "BOM"이라는 용어를 자주 접하게 된다. 처음 접하는 사람들에게는 이 용어들이 다소 생소하게 느껴지는데 이번 포스팅에서 깔끔하게 DOM과 BOM이 무엇인지, 둘의 차이와 역할에 대해 간단히 알아보자.DOM이란?DOM(Document Object Model)은 웹 페이지의 구조와 내용을 표현하는 계층적 모델이다. 브라우저 안에는 웹 문서를 해석할 수 있는 렌더링 엔진(Chrome의 Blink, Safari의 WebKit, Firefox의 Gecko 등)이 있는데 이 렌더링 엔진이 HTML로 작성된 문서를 하나하나 해석한 후, JavaScript로 접근할 수 있도록 문서를 객체화한다. 이렇게 웹 문서를 객체화한 것을 Docu.. 2025. 1. 4.
맥 터미널에서 VScode 실행하기(feat. zsh: command not found: code 에러까지) 벨로그에서 옮겨오는 중 터미널에서 실행하고 싶은 프로젝트 폴더로 이동한 후에 code . 명령어를 이용하여 VS code를 실행할 수 있다.세팅해서 안되길래 게시글을 찾아본 경우만약 이미 code . 명령어 설정을 했는데 실행이 안되는 경우zsh: command not found: code먼저 응용프로그램에 VS code가 설치가 잘 되어있는지 확인해본다. i cloud 사용자라면 그냥 다운로드 폴더 안에 VS code가 설치 되어 있을 수 있기때문에 아무리 세팅을 반복해도 컴퓨터를 껏다키면 적용되지 않는다.처음 세팅하는 경우터미널에서 cmd + shift + p 명령어로 설정 탭을 켠후PATH에 code 명령 설치 또는 Shell Command: Install 'code' command in PATH를.. 2025. 1. 2.
AWS CloudFront를 사용하는 이유 AWS CloudFront 를 사용하는 이유에 대해 알려면 CDN을 먼저 이해해야한다.1. CDN(Content Delivery Network)이란?CDN은 전 세계에 분산된 서버 네트워크를 활용하여 사용자에게 더 빠르고 안정적으로 콘텐츠를 전달하기 위한 기술이다.기본 원리 - 사용자의 지리적 위치에 가장 가까운 서버에서 콘텐츠를 제공하여 전송 속도를 개선하고 지연(latency)을 최소화한다.장점웹사이트/애플리케이션의 로딩 속도 향상대규모 트래픽을 효율적으로 처리서버 부하 감소DDoS(Distributed Denial of Service) 공격 방어2. AWS CloudFront를 알아보자AWS CloudFront는 AWS에서 제공하는 관리형 CDN 서비스로, 정적(static) 및 동적(dynamic.. 2025. 1. 2.
AI 영단어 학습 플랫폼, Wordy 2024. 12. 31.
728x90