React

React

React에서 첫 시작으로 Create-React-App을 혼자서 작동하게 하는 시간을 가졌다. 처음 Setup을 하는 과정에서 약간의 문제가 발생해서 시간이 좀 걸려서 고생은 했지만 어찌되었는 동작을 하게 만들었다. 에러가 걸린점은 이부분인데 npx create-re

시작할때 npx 으로 실행을 시켰는데 그 전에는 npm을 많이 써온 나로써는 왜 그런지 궁금해서 정리를 해보았습니다.npm install -g create-react-app한번 다운로드받고 이후 추가적인 다운로드가 필요없다.최신버전을 사용하지 못할 수 있다.npx cr

React가 없다면? 어떻게 될까?사실 이 고민은 같이 페어하던 분과 이야기를 나누던 중에 초반에 우리가 아무것도 모르고 시작한지도 이제 2일이 지난 시점에서 그런이야기를 들었을 때 나도 이해가 안되었다. 사실 공식문서를 보면 아 이렇구나싶은데 이게 왜 이걸 써야하는것

React를 배우면서 필요한 Developer Tools에 대해 알아보았다.설치는 chrom에 확장프로그램에서 검색을 하면나오며 검색한 후에 설치를 해주면 된다.좋았던점은 vscode로 작업을 하고 html로 확인하려고 npm start로 시작을 해서 열면서 직접 확인

순수 HTML을 만든 후에 가져오는 것을 할 것이다. 다음과 같이 만들었으며 이것이 Component를 만드는 코드이다.객체지향을 이해하시는 분은 App이라는 것을 만들고 Component라고 하는 react가 갖고있는 것을 extends(상속)해서 새로운 class을

Component로 만들어진것을 웹페이지나 패키지로 만들어서 인터넷에 올리면 다른사람이 여러분이 정의한 태그를 자신의 앱에 붙여서 사용할 수 있게 된다.다음과 같이 정리된 것을 보자.

state라는 것을 배웠는데 state는 props라고 하는 것과 같이 봐야한다.이 두가지의 차이점을 알면서 배워가야한다.어떤 제품을 가져왔다. 사용자 입장과 구현하는 구현자의 입장이 있을 것이다.사용자 입장에서 이 제품을 조작하는 장치는 무엇이냐면 버튼과 화면의 터치

앞에보시면 하나의js파일에서 여러가지 Component를 이용해서 여러가지 많은 것을 만들었는데 이 component가 1000개가 있다고 생각해보면 얼마나 복잡해지는 지 알 수 있다. 그리고 하나의 js파일에 있다보니까 다른 파일에서는 가져다 쓰기가 어렵다. 그래서

이번시간에는 스테이트를 좀 더 사용을 해볼것이다 익숙해지시게서브젝트 프로퍼티에 값하라 여러개를 값할때는 또 사용법이 달라진다티오씨는 부분 안에 있는 데이터를 앱의 내부의 스테이트의 스테이트의 주입해주는것을 통해서 자동으로 바꾸는 것을 할 것이다. 그 이유는 티오씨의 수

이전에 만든 state 셋팅작업과 event작업연결시키면 완성시켜줄 것이다.여기서 App에 Web이라는 것을 클릭했을때 mode 값을 welcome이라고 변경해주고 싶었다.이렇게 작성을하고 보면 error가 나온다 저기에 작성한 한줄의 코드가 2가지의 문제를 가지고 있

bind라고 하는 함수를 배워보았다. 이것은 엮는다 묶어준다는 의미를 가지고 있으며 render라는 함수를 호출했을때 그 안에서 this는 그 component 자신을 가리킨다는 것을 알 수 있다. console 창에 다음과 같이 작성하였다.obj라고하는 새로운 값을

state값을 직접변경하면 안되고 함수의 형태로 변경해야하는 이유는 뭘까?this.setState에 값을 변경해줘야하는것. 그 이유는 React입장에서는 React 모르게 바꾼것이기 때문에 안되는 것이다.이것을 아래와 같이 변경해야하며 그 함수가 내부적으로 많은일을 할

나는 event의 소비자였지 생성자는 아니여서 잘 모르겠지만 한번 습득해보자!이전에 작업했던 subject component을 다시 살렸다.만약에 subject라는 component를 사용할때 사용자가 링크를 클릭했을때 어떠한 일이 일어나게 하고싶다면 onChangep