과제: delete 와 remove의 차이

• React.createElementAPI ( deprecated ) ⇒ JSX Transformer

• tabindex는 양의 정수 쓰지말고 0,-1 로 순서를 임의로 지정하지 않도록 함

• rootElement가 하나일 필요 없고 여러개 랜더링 할 수 있다 😃

• focus-visible: 마우스 사용이 어려울때 키보드로 접근할때 ! (focus: 마우스사용)

• vite는 번들러 환경 !

  esbuild를 내부적으로 사용하고 다양한 리소스를 불러올 수 있어서 자바스크립트 내부에서도 css를 불러올 수 있도록 함 import "./{파일명}.css"

• HTML hint

  Hello from HTMLHint | HTMLHint

Exercise

• 부품이기 때문에 width 설정은 지양, min-width 정도는 필요하다 !

CSS styling

마크업, 비즈니스 로직 모든걸 캡슐화 할 것이기때문에 가장 상위 요소에 클래스를 주고 일반요소로 마크업을 주는 것도 좋아요 🐶

• Export Styles to CSS variables ( Figma Plugin)

Export styles to CSS variables | Figma Community

CSS root 변수를 추출할 수 있음 😀

• tailwind Shades(VSCode extension)

  : 순색계열을 500으로 … 주고 … 50번부터… 950번까지 쓸수 있다…? 이걸 한 번에 만들어줌

focus within

[ form 요소가 input,button 을 감싸고 있는 경우 ]

해당 요소는 focusable한 요소 이기 때문에 초점 이동이 됐을때 상위 요소(=form)에 스타일링이 적용됨

⇒ tab-index도 가능

REACT

웹 또는 모바일 사용자 인터페이스를 구축하는 JavaScript 라이브러리

특징