Back to the Basics

보호되어 있는 글입니다.

공식 홈페이지도 참고해보자! React 방식과 DOM 방식 차이 React Event Handling은 DOM의 처리 방식과 비슷하지만 몇 가지 차이점이 있다. 문법적인 차이는 공식 홈페이지에서도 나와있듯이 React에서 Event는 camelCase로 사용한다 JSX를 사용하여 "함수"로 Event Handler(이벤트 처리 함수)를 전달한다. 예를 들면 아래의 코드와 같다. {/* HTML */} Click me {/* React */} React는 이러한 값을 컴포넌트의 State로 관리하고 업데이트한다. Onchange는 input의 text가 바뀔 때마다 발생하는 이벤트이다 onChange Event가 발생하면 e.target.value를 통해 이벤트 객체에 담겨 있는 input값을 읽어올 수 ..

State Application에서 Sate란 컴포넌트 내에서 변할 수 없는 값이며 상태는 React State로 다뤄야 한다. [20100810]- React-State and Lifecycle 공식문서를 보고 state와 props에 대해 정리한 글이다. 참고해보자~! State hook, useState Hook이란 무엇일까??? 공식 홈페이지에 의하면 Hook은 "React feature를 연결할 수 있는 특수한 함수"라고 한다. React를 다루기 위해 특별히? 사용되는 함수라고 생각하면 될까..?? React에서는 useState라는 특별한 함수를 통해 state를 다룬다. useState는 React Hook중의 하나이며 React state를 추가할 수 있게 해주는 Hook이다. How t..

React Intro map을 이용한 반복 Reat에서 여러 데이터를 렌더링 할 때 사용하는 map method에 대해 학습해보자. map method가 생각이 잘 안나면 이전 포스팅 을 잠시 읽어보자..!! "In React, the map() function is most commonly used for rendering a list of data to the DOM." 만약 블로그에 몇 십, 몇 백개의 포스틀르 하드코딩(hardcoding : 모든 데이터를 코드에 작성하는 것)으로 작성을 한다면 타자연습은 되겠지만, 매우 힘들것이다. 손가락도 아프고,,, 손가락은 소중하다, 그리고 키보드 수명도 줄지않을까..아무튼.. 이럴 때 map을 이용하여 반복 을 하면 나의 손가락 관절과 키보드의 수명을 좀 ..

Introduction 드디어 Rect를 배우게 되었다. 스케줄을 보니 React 기토에 대해 만 거의 2주 동안 배우는 것 같다. React를 학습하기 전 먼저 선행되어있어야 할 지식은 아래와 같다. Prerequisite HTML/CSS 기초 JavaScript 기초 함수형 프로그래밍과 고차함수 개념에 대한 이해 배열 내장 메소르 기초 ES6 문법에 대한 이해 Achievement Goals React의 3가지 특징에 대해서 이해하고, 설명할 수 있다. JSC가 왜 명시적인지 이해하고, 바르게 작성할 수 있다. React Compoment의 필요성에 대해서 이해하고, 설명할 수 있다. create-react-app으로 간단한 개발용 React 앱을 실행할 수 있다. React 란?? 프론트앤드 개발을..