WebStudy
1.[Javascript 기초] - 변수
어떠한 정보에 이름을 붙혀서 저장하고 싶을 때 사용하는 것.&&변수는 문자와 숫자, $, \_만 사용하라.첫글자는 숫자가 될 수 없다.예약어는 사용할 수 없다.가급적 상수는 대문자로 선언하라.변수명은 읽기 쉽고 이해할 수 있게 선언하라.
2.[Study] ECMAScript(ES6) (1)
ECMA-International 공식 ECMA-262문서ECMAScript 표준 사항이나 과거 역사위키백과 - ECMA스크립트한눈에 확인하는 호환성 테이블문법 검색으로 확인하는 호환성 테이블ES6부터 연호를 사용해서 ES2015, ES2016이라고도 부른다. 하지만,
3.웹 성능 최적화 방법 (퍼블리셔 관점)
이미지는 웹 페이지 로딩 속도에 큰 영향을 미칩니다. 효율적인 이미지 관리로 LCP(Largest Contentful Paint)를 개선할 수 있습니다.WebP 포맷 사용: JPEG/PNG 대신 WebP로 변환해 파일 크기 20~50% 줄이기. 예: imagemin 또
4.[CSS]_100vh를 사용할 때
팀장님이 앞으로 100vh를 사용할 일이 생기면 아래와 같이 쓰라고 하셨다.모바일 브라우저에서 100vh 값이 툴바 등으로 인해 부정확하게 계산되는 문제를 해결하기 위해 사용된다.calc() 함수를 사용하여 vh 단위를 사용하되, 'var(--vh, 1vh)'를 통해
5.[React] 리액트에서 DOM탐색 구문을 권장하지 않는 이유
React는 state값 변경에 따라서 컴포넌트가 재랜더링됨렌더링시 DOM생성되고 그 다음번 렌더링때는 이전 렌더링 만들어진 DOM의 정보값만 추출해서 가상돔 생성해당 렌더링 사이클에서는 최신 가상돔요소를 제어함<span style="color: - 실제돔을 제
6.[React] 조건부 렌더링 (Conditional Rendering)
React에서는 배열의 .map() 메서드를 사용해 컴포넌트를 반복 렌더링한다.🔐 key 속성의 중요성key는 React가 각 항목을 식별하고 렌더링 성능을 최적화하기 위해 필요.가능하면 고유한 ID를 사용해야 한다. index는 정렬이나 삭제가 없을 때만 사용 권장
7.[React] Hook - useEffect
useEffect는 컴포넌트가 렌더링된 후 특정 작업을 수행할 수 있게 해주는 훅
8.[React] Hook - useState
React 컴포넌트 안에서 상태(state)를 생성하고 관리할 수 있게 해주는 HookuseState(초기값) 은 배열 값, 설정함수 를 반환한다.상태가 변경되면 자동으로 해당 컴포넌트가 다시 렌더링된다.상태를 직접 수정하면 안된다 ❌반드시 <b style="ba