React14 [React 공식 Doc 가이드 #5] Components and Props - 이 글은 React 공식 홈페이지 Docs v16.8.3 (https://reactjs.org/docs) 에 기반하여 작성한 글입니다. - Component의 정의 Component는 UI 적으로 독립적이고 재사용할 수 있는 단위이다. 개념적으로 component는 Javascript function 과 같다. "props" 로 불리는 임의의 input 들이 있고, Screen에 보여지는것을 정의하는 React element Return 하면 이를 Component 라고 한다. - Function and Class Component component 를 정의하는 가장 Simple 한 형태는 Javascript 함수를 작성하는 것이다. 문서에서는 위의 Welcome function을 "유효한" Reac.. 2021. 2. 11. [React 공식 Doc 가이드 #3] Introducing JSX - 이 글은 React 공식 홈페이지 Docs v16.8.3 (https://reactjs.org/docs) 에 기반하여 작성한 글입니다. - JSX 는 꼭 써야 하는가? 아래태그는 string 이나 HTML이 아닌 JSX(Java Script eXtension) 이다. 사실 React를 사용할 때 JSX는 필수 Spec은 아니다. JSX를 쓰는데는 크게 2가지 이유가 있는 것 같다. 1. Javascript Code 안에 UI 관련코드가 들어 갈 때 가독성을 높여준다. JSX 를 안쓰면 아래와 같은 코드를 읽어야 한다. 물론 실제 Project 에서는 위와 같이 쓰지않고, template 엔진을 쓰겠지만 JSX 를 쓰던 다른 template 엔진을 쓰지 않는다면 위와 같이 UI 코드가 Javascrip.. 2021. 2. 11. [React 공식 Doc 가이드 #2] Hello World - 이 글은 React 공식 홈페이지 Docs v16.8.3 (https://reactjs.org/docs) 에 기반하여 작성한 글입니다. - Project 폴더 살펴보기. 공식홈에서는 React 가장 기본 코드로 아래와 같은 예제를 준다. Javascript 에 대한 기본적인 지식이 있다면(공식 홈페이지에서도 기본적인 Javascript 지식을 선요구 하고 있다.) ReactDOM.render 와 같은 문법은 몰라도 대충 아래와 같이 예상할 것이다. " 이던 다른 태그이던 id="root" 로 되어있는 tag가 있고 여기에 Hello, world!을 그릴 것이다." 이전글에 설정했던 폴더를 살펴보자. 난 그냥 문법만 익히고 싶고, index.html 에서 소스만 바꾸면서 예제의 결과값만 보길 원했는데 .. 2021. 2. 11. [React 공식 Doc 가이드 #1] Installation - 이 글은 React 공식 홈페이지 Docs v16.8.3 (https://reactjs.org/docs) 에 기반하여 작성한 글입니다. - 기본 요구사항 React 를 설치하는 방법에는 Script 추가와 npm 을 이용한 방법이 있다. React를 학습하기 위한 목적이므로 npm을 이용하여 설정해보자. React 튜토리얼이므로 npm이 설치되어있다고 가정한다. (공식홈에서는 Node >= 6, npm >= 5.2를 요구하고있다. 2019.02.24일 기준) - 설치 자신이 Project를 생성할 적당한 폴더에서 아래 명령을 입력한다. npx create-react-app test-create 위의 줄에서 npx는 npm의 오타가 아니다.(나도 몰라서 그렇게 생각함.) test-create 부분은 본.. 2021. 2. 11. 이전 1 2 다음
