Front End

currentTarget과 target은 자바스크립트에서 이벤트 핸들러 함수에서 사용할 수 있는 이벤트 객체의 프로퍼티 중에서 두 가지입니다. 이 둘은 이벤트가 발생한 요소와 현재 이벤트가 처리되는 요소, 즉 이벤트 버블링 과정에서 현재 이벤트가 진행 중인 요소를 나타

프론트엔드 개발에서 번들링은 매우 중요한 역할을 합니다. 번들링이란, 여러 개의 자바스크립트 파일과 CSS 파일, 이미지 파일 등을 하나로 묶어서 브라우저에서 로딩할 수 있는 형태로 변환하는 것을 말합니다.번들링의 목적은 여러 가지가 있습니다. 첫째, 브라우저에서 요청

주소창에 google.com을 입력하였을 때, 일어나는 일에 대하여 공부해보았습니다.주소창에 "google.com"을 입력하면, 다음과 같은 일련의 과정이 일어납니다.브라우저는 DNS(Domain Name System) 서버에 "google.com"이라는 도메인 주소를

회사에서 Vue로 작성된 코드를 React로 바꾸는 중인데, 인증부분을 Firebase로 사용하고 있었다. 이번 기회에 React에서 Firebase를 사용해서 구글 인증을 구현해보려 한다.

회사의 레거시 코드에서 각 페이지마다 동일한 api 요청을 하는 부분이 많이 있다. 이 요청에 대한 응답으로 오는 데이터는 사실상 거의 변하지 않는 데이터였다. 업데이트가 거의 일어나지 않는 데이터를 모든 페이지에서 요청하는 것보다, 캐싱을 해두면 좋을 것 같아 rea

react-slick. beforeChange, afterChange를 통해 활성화된 요소의 index를 관리하는 법

'react-slick' 라이브러리를 사용하면서 다음과 같은 경고 메세지를 만났습니다.해석해보면 react-slick 컴포넌트가 Infinity라는 유효하지 않은 값을 width CSS 스타일 속성에 적용하여 발생한다고 합니다.처음에는 css 속성 중에 값이 잘못들어가

⚠️교차 출처 읽기 차단(CORB)으로 MIME 유형이 text/html인 교차 출처 응답(https://guide-page.dothome.co.kr/404.html)이 차단되었습니다. 자세한 내용은 https://www.chromestatus.com

import styles from 'css/components/Select.module.scss';import { useState } from 'react';export default function LineSelect({ value, lineNumbers, onCha

컨테이너 안에 버튼이 존재하는 컴포넌트를 구현하는 중에, 버튼을 클릭했을 때, 이벤트 버블링이 발생하여 컨테이너에 등록된 클릭 이벤트 핸들러가 동작하는 문제가 있었습니다.이벤트 버블링 떄문에 발생하는 문제라는 것은 알고 있었지만, 어디에서나 자주 써왔던preventDe