목록FE/React (8)
오봉이와 함께하는 개발 블로그
props 컴포넌트의 속성(값 설정) 부모 컴포넌트에서 자식 컴포넌트로 값 정달할 때 사용(읽기 전용) 컴포넌트 렌더링 할 때 값을 전달해 주고 싶을 때 사용 부모 컴포넌트 : App.js 자식 컴포넌트 : Subject.js {this.props.title}을 원하는 곳에 적으면 부모 컴포넌트 title에 있는 값이 출력 됨 class App extends Component { render() { return ( {/* 안녕하세요. */} {/* 위에 추가한 컴포넌트 사용 : 태그 형식으로 사용한다. */} {/* */} ) } } class Subject extends Component { render() { return ( {this.props.title} {this.props.sub} world ..
JSX 문법 자바스크립트 표현 사용 if문 대신 조건 연산자(3항 연산 사용(조건? true:false)) AND 연산자 && 사용한 조건부 렌더링 조건이 true면 expression 반환 조건이 false면 expression 반환하지 않고 무시(아무것도 출력되지 않음) OR 연산자 || 사용한 조건부 렌더링 조건이 0 또는 false이면 expression 반환 0이 아니면 해당 값 출력 const number = 100; { number || '내용...' } 결과 : 100 출력 인라인 스타일링 : 카멜 표기법 css 코드 사이에 '-' 말고 대문자로 표기 background-color => backgroundColor class 대신 className 사용 태그는 ..
자바스크립트 라이브러리와 프레임워크 필요성 웹 애플리케이션에서 유저 인터페이스 동적 처리 시 각 DOM 요소 작업 필요 getElementById()로 찾아와서 이벤트 처리하고 코드 작성 프로젝트 커지고 인터페이스도 다양해짐. 프로젝트 관리를 하기 위해 많은 DOM 요소나 코드를 관리하고 정리하는 일이 어려워짐 사용자 인터페이스에만 집중할 수 있는 라이브러리 또는 프레임워크 필요 많은 라이브러리나 프레임워크가 만들어지고 사용되며 생산성, 유지보수성 향상 대표적인 자바스크립트 라이브러리 / 프레임워크 Angular React Vue.js 프레임워크 / 라이브러리 프레임워크 뼈대(기반 구조를 의미) 제어의 역전 여러 클래스, 컴포넌트로 등으로 구성 작업하는 방법이 정의되어 있다. 라이브러리 활용 가능한 도구..