📚 Study

[REACT JS] 엘리먼트 렌더링

엘리먼트는 React 앱의 가장 작은 단위입니다. 엘리먼트는 화면에 표시할 내용을 기술합니다. const element = Hello, world; 브라우저 DOM 엘리먼트와 달리 React 엘리먼트는 일반 객체이며(plain object) 쉽게 생성할 수 있습니다. React DOM은 React 엘리먼트와 일치하도록 DOM을 업데이트합니다. 주의 더 널리 알려진 개념인 “컴포넌트”와 엘리먼트를 혼동할 수 있습니다. 다음 장에서 컴포넌트에 대해 소개할 예정입니다. 엘리먼트는 컴포넌트의 “구성 요소”이므로 이번 장을 읽고 나서 다음 장으로 넘어갈 것을 권합니다. DOM에 엘리먼트 렌더링하기 HTML 파일 어딘가에 가 있다고 가정해 봅시다. 이 안에 들어가는 모든 엘리먼트를 React DOM에서 관리하기 때..

[CSS 해석 ] Basic CSS 맨위에 정리

코드 html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, em, img, b, i, ul, li,form, label ,option,select,input{ ?? em , b , label은 어디 태그 지? margin:0; padding:0; border:0; outline:0; font-size:100%; vertical-align:baseline; font-family: 'Noto Sans KR','Noto Sans cjk KR', sans-serif;} table{border-collapse: collapse;} body {line-height:1;} ul li{list-style:none;} img,button, input {bo..

#1 React JS를 배워야하는 이유 [React JS 영화웹사이트]

페이스북은 여전히 React JS를 사용하고 있다. 인스타그램, 핀터테스트, 우버, 넷플릭스 이런 사이트들도 React JS를 사용한다. 1.1 Why React 페이스 북이 React JS를 만들었고, 이걸로 페이스북 웹사이트 전부를 다시 만들었다. React JS는 정말 큰 커뮤니티를 가지고 있다. React JS는 Javascript와 아주 가깝기 때문에, React JS로 작업할 때 대부분의 작업은 그냥 일반 Javascript에 대한 작업이다. React JS는 Javascript의 커뮤니티를 거의 다 빌려왔다. 이 커뮤니티가 거대하다. React JS를 배우고 작업하는 것은 여러분을 더 아능 Javascript 개발자가 되도록 하기 때문에 React JS를 기반으로 제작된 framework들이..

JSX란? (정의, 장점, 문법)

아래 변수 선언을 살펴봅시다. const element = Hello, world!; 위에 희한한 태그 문법은 문자열도, HTML도 아닙니다. JSX라 하며 JavaScript를 확장한 문법입니다. UI가 어떻게 생겨야 하는지 설명하기 위해 React와 함께 사용할 것을 권장합니다. JSX라고 하면 템플릿 언어가 떠오를 수도 있지만, JavaScript의 모든 기능이 포함되어 있습니다. JSX는 React “엘리먼트(element)” 를 생성합니다. 다음 섹션에서는 DOM에 어떻게 렌더링하는지 알아보겠습니다. 아래를 보면 JSX를 시작하기 위해 필요한 기본사항을 찾으실 수 있습니다. 1. JSX란? React에서는 본질적으로 렌더링 로직이 UI 로직(이벤트가 처리되는 방식, 시간에 따라 state가 변하..