https://velog.io/@rkio/Typescript-useRef를-다른-컴포넌트에-props로-전달할-때-타입-정의

createBrowserRouterRouteerrorElementuseNavigateuseParamsOutletuseOutletContextuseSearchParams

명령형(HOW) : 무엇을 어떻게 할 것인가예시 : 12번 테이블에 자리가 비어있습니다. 나는 저 자리로 걸어가 앉을 것입니다.선언형(WHAT) : 무엇을 할 것인가 (추상화)예사 : 앉을 자리 부탁해요.위에 예시에 따라 명령형방식은 내가 실제로 자리에 "어떻게" 않을

Emmet(vscode 내 빌트인) 문법 HTML 양식작성 : ! 탭키div.divClass, div\`\`\`div는 자주 사용하므로 .divClass, .divId => 로 사용 가능div>ul>li 탭키p.pClass${item $}\*5p>lorem3

절대적인 값px(픽셀) 사용ㄴ 컨테이너 사이즈가 변경되어도 고정된 값으로 유지됨상대적인 값 ㄴ 값을 반응형으로 하는 것이 좋음%바로 위 부모 요소 의 상대적으로 크기가 계산이 됨em 부모의 font-size px의 영향을 받아서 결정이 됨1em === 16pxpx의

https://regex101.com/https://csstriggers.com/https://www.notion.so/Git-Cheat-Sheet-803c6fcc50074cd990cc6a7e17644437https://typescr

풀스택 프레임워크

필요할 때만 다운로드 하는 방법 React.lazy/product 경로로 이동하였을 때만 다운로드한다. 하지만 다운로드 가 다 될동안 react 앱은 중단되므로 오류가 발생한다. 해결책 : 서스펜션 컴포넌트를 사용한다.import React, { Suspense } f

index.jsstore.jscounter.js

template으로 주로 사용해야 웹사이트의 형태파악이 쉬움1fr 이란 가질수 있는 최대를 가르킴(예, 부모의 width 500px이면 거기서 4개로 나눠서 최대)fr 단위로 설정하면 웹사이트의 크기에 따라 크기가 자동 반영 됨

✅ box-shadow (x, y, 흐린정도(blur), 그림자사이즈, 색상): 흐린정도(blur), 그림자사이즈 둘은 생략 가능https://neumorphism.io/https://cssgenerator.org/box-shadow-css-gener

⭕️ transition (부드럽게 보이기 위해) - 전환: property duration timing-function\[] <= 생략 가능timing-function: ease-in, ease-out, ease-in-out, cubic-bezier()delay

⭕️ font-size 3가지 단위(px, em, rem): px 절대단위: em, rem 상대단위(기준에 따라 달라짐)em (잘안씀)실제로 적용된 폰트 사이즈 (parent의 font-size가 20px이면 1em = 20px 이됨)✅ rem (root(html) e

반응형웹을 위해 반드시 해야할 처리

flex-wrap : nowrap | wrap (한줄 안에 모든 요소를 정렬 할 것인지, 기본값 : nowrap)

스크린 리더기에게 정보를 전달할 때 사용한다.aira-label=""aria-hidden="true" // 스크린리더에게 읽지 말고 생략하라고 알려줌(시각적인 요소인경우)

강조 Emphasis