목록JavaScript (5)
studio.heelab
이전 글 리액트의 기본 요소: 이벤트 핸들링, 조건부 렌더링, 리스트와 키이전 글 리액트의 기본 요소; 컴포넌트와 Props, State와 생명주기, 훅이전 글 리액트 시작하기교재: 소플의 처음 만난 리액트 키워드리액트 JSX 엘리먼트 렌더링Ch00. 준비하기HTML 살펴보기HTML이란ewhacse.tistory.com 교재: 소플의 처음 만난 리액트 키워드폼 State 합성과 상속 컨텍스트 Ch11. 폼폼사용자로부터 입력을 받기 위해 사용하는 양식 리액트의 폼컴포넌트 내부에서 state를 통해 데이터를 관리한다 HTML의 폼엘리먼트 내부에 각각의 state가 존재한다 제어 컴포넌트-사용자가 입력한 값에 접근하고 제어할 수 있도록 해 주는 컴포넌트-그 값이 리액트의 통제를 받는 입력 폼 엘리먼트 모든 ..
이전 글 리액트 시작하기교재: 소플의 처음 만난 리액트 키워드리액트 JSX 엘리먼트 렌더링Ch00. 준비하기HTML 살펴보기HTML이란 웹사이트의 뼈대를 구성하기 위해서 사용하는 마크업 언어태그를 사용하여 웹사이트 구조ewhacse.tistory.com 교재: 소플의 처음 만난 리액트 키워드컴포넌트와 Props State와 생명주기 훅Ch05. 컴포넌트와 Props컴포넌트리액트는 컴포넌트 기반→ 작은 컴포넌트들이 모여서 하나의 컴포넌트를 구성하고, 이 컴포넌트들이 모여 전체 페이지를 구성→ 개발 시간과 유지 보수 비용 감소 자바스크립트 함수와 개념적으로 비슷하다-속성들을 입력으로 받아서 그에 맞는 리액트 엘리먼트를 생성하여 리턴한다 리액트 컴포넌트의 역할: 어떠한 속성들을 입력으로 받아서 그에 맞는 리엑..
교재: 소플의 처음 만난 리액트 키워드리액트 JSX 엘리먼트 렌더링Ch00. 준비하기HTML 살펴보기HTML이란 웹사이트의 뼈대를 구성하기 위해서 사용하는 마크업 언어태그를 사용하여 웹사이트 구조 만들고, 웹사이트에 들어갈 내용 채워 넣을 수 있다. 태그 - HTML의 시작과 끝을 알리는 태그 태그 - 어떤 웹사이트인지 알 수 있는 여러 가지 속성(제목, 설명 등)을 담고 있는 곳 태그 - head 태그 안에서 제목을 넣기 위해 사용 - 웹사이트에서 보이는 콘텐츠를 담는 태그 SPA (Single Page Application)복잡한 웹사이트 접속 시, 각 페이지별로 HTML 파일이 따로 존재하며, 페이지를 이동하게 될 경우 브라우저에서는 해당 페이지의 HTML 파일을 받아와서 화면에 표시한다.→ 수십..
교재: Do it! HTML+CSS+자바스크립트 웹 표준의 정석 손자요소 하위 선택자 - 상위 요소와 하위 요소를 공백으로 구분section p { color: blue; } /*section " data-og-host="ewhacse.tistory.com" data-og-source-url="" data-og-host="ewhacse.tistory.com" data-og-source-url="https://ewhacse.tistory.com/56" data-og-url="https://ewhacse.tistory.com/56" data-og-image="https://blog.kakaocdn.net/dna/CSCPf/hyZNUR6FM4/AAAAAAAAAAAAAAAAAAAAAIfqJwX6wDB5b62ls_LRbX7rUDTW_9ahh6Qy9HGoJ6Sk/img.png?credential=yqXZFxpELC7KVnFOS48ylbz2pIh7yKj8&expires=1777561199&allow_ip=&allow_referer=&signature=7w1f2QSQbWeiyKtSfjz9uUYd4F8%3D
교재: Do it! HTML+CSS+자바스크립트 웹 표준의 정석 자식요소>손자요소 하위 선택자 - 상위 요소와 하위 요소를 공백으로 구분section p { color: blue; } /*section " data-og-host="ewhacse.tistory.com" data-og-source-url="https://ewhacse.tistory.com/55" data-og-url="https://ewhacse.tistory.com/55" data-og-image="https://blog.kakaocdn.net/dna/LYTFs/hyZNt1liGX/AAAAAAAAAAAAAAAAAAAAAFNBls0WX_h_uQ_lmLmGA6XmI3CErakIDpdZ-p5uSyoa/img.png?credential=yqXZFxpELC7KVnFOS48ylbz2pIh7yKj8&expires=1777561199&allow_ip=&allow_referer=&signature=Olvf2p%2FJNoPHAZWNd%2FND6t4Wsfk%3D