분류 전체보기 (47) 썸네일형 리스트형 4. React 생명주기 엄청 빠르게 돌아온 효그니가 이번에 설명할 것은 React Component의 생명주기입니다. 저번에 설명했듯이 Component 는 클래스형, 함수형 이 두 가지가 있다고 했었죠? 각각의 Component의 생명주기 방식이 다릅니다. Class Component class Test extends React.Component { componentWillMount() { console.log('componentWillMount'); } componentDidMount() { console.log('componentDidMount'); } componentWillReceiveProps(nextProps) { console.log('componentWillReceiveProps'); } shouldCompon.. 3. React State 안녕하세요! 효그니에요! 와! 리액트! 엄청 빨리 다시돌아왔다! 이번 글에서 설명할 것은 React Component의 state입니다. State란? Component가 갖는 유동적인 데이터를 의미합니다. Class Component 카운터를 하나 만들어보겠습니다! class Counter extends React.Component { constructor(props) { super(props); // React.Component의 생성자 메소드입니다. this.state = { // this.state로 state를 설정합니다. number: 0, // number 초기 값 설정 }; this.handleCounter = this.handleCounter.bind(this); // 함수 바인딩 } h.. 5. Node Promise 안녕하세요! 효그니에요! 이번차시에는 Promise를 배워볼거에요! 방금 점심을 회사 구내식당에서 먹고왔는데! 와! 맛집! 하핳! 여러분도 맛난거 들면서 하세요! 그럼 시작해볼까요? Promise란? 저번 시간에 자바스크립트의 비동기와 async/await 을 사용한 처리를 배웠었죠? Promise는 async/await처럼 자바스크립트의 비동기 처리에 사용되는 문법입니다! 와! 비동기! 와! 샌즈! Promise의 상태 Promise는 크게 세 가지의 상태를 갖고 있습니다! Pending ( 대기 ) - 아직 로직 처리가 완료되지 않은 경우 Fulfilled ( 이행 ) - 로직 처리가 완료되어, 결과 값을 반환한 경우 Rejected ( 실패 ) - 로직 처리 중, 실패하거나 오류가 발생한 경우 Pe.. 4. Node 동기/ 비동기 처리 ( async / await ) 안녕하세요! 효그니에요! 와! 샌즈! 오늘은 동기와 비동기에 대해 알아볼 예정이에요! 그나저나... 요새 날씨가 많이 추워진 듯 하네요 하핳! 묵혀둔 코트를 입을 때가 온 듯 해요! 뭐 암튼.. 각설하고 여튼 째뜬 시작해볼까요? 동기 / 비동기란? 비동기란 특정 동작이 끝나지 않아도 다음 동작을 먼저 실행하는 자바스크립트의 특성입니다! 그럼 동기는 반대로 특정 동작이 끝나기 전에 다음 동작을 먼저 실행하지 않는 것이겠죠? 예를 하나 들어볼게요! app.get('/', (req, res) => { console.log('1'); setTimeout(() => console.log('2'), 1000); console.log('3'); }); setTimeout는 인자 값으로 들어간 함수를 뒤의 시간 만큼 .. 3. MongoDb 사용법과 로그인/회원가입 만들기! 와! 또 빨리왔네요! 삘받아서 하핳... 열정 활활! 일단 한번 또 빠르게 시작해볼까요? 일단 MongoDB란? JSON기반 NoSQL DB입니다! *** 무료입니다. 와! 아래의 주소에서 설치 가능합니다. https://www.mongodb.com/try/download/community MongoDB Community Download Download the Community version of MongoDB's non-relational database server from MongoDB's download center. www.mongodb.com 잉? 근데 NoSQL? 원래 의미는 Non SQL 또는 Non relational 간단히 말해 비관계형 데이터베이스입니다!! SQL처럼 복잡하지 않고, .. 2. React Component (props, state, Class Component, Functional Component) 안녕하세요 효그니입니다! 꽤나 빠르게 새 글을 올리네요! 하핳! 오늘은 React에서의 Component에 대해 강의를 할 생각입니다! 자 시작해볼까요! 우선 Component란? React의 component란 상태 ( state ) 를 갖고 있고, 인자 값으로 Props 를 가지며, 반환 값으로 Element를 반환하는 "함수" 입니다! **** 이름의 첫 글자는 반드시 대문자여야합니다! **** {function App() { return ( Edit src/App.js and save to reload. Learn React ); } CRA를 사용하면 기본적으로 나오는 App Component 입니다! 반환 값을 어디서 보신 것 같다구요? 맞습니다. html 태그를 반환하죠!!! JSX라는 기법입.. 이전 1 2 3 4 5 6 ··· 8 다음
