반응형 TIL/코드스테이츠 TIL106 코드스테이츠 소프트웨어엔지지어링 부트캠프 +26일 리액트 Props와 State Props : 컴퍼넌트의 속성(Property)이다. 외부에서 전달받는 값으로 컴퍼넌트 내부에서 변하지 않는 값이다.(immutable) 부모 컴퍼넌트에서 전달받은 값이다. (React는 하향식 데이터 흐름원칙을 갖고 있다.) props전달방법 props 매개변수 사용 function Child(props) { return ( {props.text} ); }; function App() { return ( ); } export default App; props 는 객체이다. 이 객체의 { key : value } 는 컴포넌트에서 정의한 { attribute : value } 의 형태를 띈다. 따라서 JavaScript 에서 객체의 value 에 접근할 때 dot notat.. 2021. 8. 14. 코드스테이츠 소프트웨어엔지지어링 부트캠프 +25일 SPA (Single Page Application) 필요한 부분만 서버에서 전달받아 업데이트 하고 중복되는 부분은 냅둔다. 전통적인 방식은 전체를 새로 로딩하기 때문에 불필요한 트래픽이 발생한다. JS크기가 크기때문에 첫 로딩시간이 길다. 구글 네이버등 검색엔진은 HTML을 분석하여 검색기능을 구동하는데 SPA의 경우 HTML이 가볍기 때문에 SEO가 좋지 않다. 하지만 이러한 단점은 사라지는 추세이다. 라우팅(Routing) SPA는 하나의 페이지를 갖고 있지만 사실 한 종류의 화면만 사용하지 않는다. 메신저의 경우 홈, 메시지창, 프로필 등 한 화면에서 여러종류의 작은 화면들이 필요하다. 또한 이 화면에 따라 '주소' 도 달라질 것이다. 이렇게 다른 주소에 따라 다른 뷰를 보여주는 과정을 경로에 따.. 2021. 8. 12. 코드스테이츠 소프트웨어엔지지어링 부트캠프 +24일(외계어 리액트) 외계어 리액트 리액트는 외계어다 React의 3가지 특징 : React는 프론트엔드 개발을 위한 JS라이브러리이다. 선언형 범용성 컴포넌트 기반 JSX : JS를 확장한 문법으로 브라우저가 바로 실행할 수 있는 JS코드가 아니다. Babel은 JSX를 브라우저가 이해할 수 있게 컴파일해주는 역할을 한다. 우리가 JSX코드로 개발을 하면 Babel이 JS코드로 컴파일 하여 브라우저가 읽을 수 있게 해준다. JSX가 왜 명시적인가? HTML과 JS가 결합한 문법으로 직관적이다. React Component의 필요성 하나의 기능 구현을 위해 여러 코드를 묶어둔것을 컴포넌트라고 한다. 컴포넌트를 분리하면 서로 독립적이고 필요할 때 간편하게 재사용이 가능해서 기능에 집중하여 개발할 수 있다. 몰랐던것: JS는 중.. 2021. 8. 12. 코드스테이츠 소프트웨어엔지지어링 부트캠프 +23일 고차함수 일급객체의 특징 3가지 변수에 할당할 수 있다. 다른 함수의 인자로 전달될 수 있다. 다른 함수의 결과로서 리턴될 수 있다. 고차함수 함수를 인자로 받을 수 있고 함수의 형태로 리턴할 수 있는 함수. 인자로 전달되는 함수를 콜백 함수라고 한다. 내장 고차함수 자바스크립트에는 기본적으로 내장된 고차함수가 있다. 그 중 배열 메소드들 중 일부가 대표적인 고차함수에 해당된다. filter : 걸러내기 위한 조건을 명시한 함수를 인자로 받는다. 콜백함수는 true, false 만 리턴한다. map : 배열 내의 모든 요소 각각에 주어진 함수를 호출하고 그 리턴값을 모아 새로운 배열을 반환한다. 이전배열을 수정하지 않음 reduce : 배열의 각 요소에 대해 주어진 함수를 실행하고 하나의 결과값을 반환한다. 2021. 8. 11. 이전 1 ··· 18 19 20 21 22 23 24 ··· 27 다음 반응형