그것 관심사↗

미티어 CRUD 서비스-리액트편

도레시 2020. 1. 27. 19:01

서버가 올라가는것이 보았으니 후딱 코딩을 해보자.

에디터 프로그램은 본인 손에 익은것으로 하면 된다.

 

난 visual studio code로 했다.

따랑해요! 빌게이츠! 기미 어 쪼꼴릿!(언제적 빌게이츠...)

이제 총 3가지를 소스를 수정한다.

client/main.html(수정)

client/main.jsx(수정)

imports/HelloMeteor.jsx(신규)

 

main.html
main.jsx
HelloMeteor.jsx

이렇게 넣고 돌리면 

잘 나온다.

변수 example에 true로 선언했기 떄문에 3항연산에서 example == true 라서 Its true가 나옴.

상태에 대해 선언함

리액트도 배우는 입장이라 위 소스의 내용은

state는 상태를 가지고 있어서 변화가 될때  state를 변경하여(setState) 상태가 변함을 알아차린다.

그리고 dom 객체를 다시 재생성한다.

클릭전
클릭후

다른 인풋 이벤트로  코딩하였다.

리액트는 ref로 dom 객체를 표기함. 따라서 handleChange에서 ref.input으로 찾았음.
반응은 실시간으로 멋있게 보이지만 dom객체를 지웠다 만들었다 안에서는 개고생인 리액트

선생님이 리액트 이벤트를 더 알고 싶은 중생들에게 아래 사이트 추천함. 

https://appendto.com/2017/01/react-events-101/

 

Handling Events in React 101 | appendTo

Thorough guide to handling events in the React.JS ecosystem

appendto.com

이제 몽고디비랑 엮어볼 차례임. 몽고디비는 noSql 문서기반의 디비임.

뭔가 meteor를 자세히 할려고 했는데 제대로 아는게 없네 ㅋㅋㅋ

습자지 같은 지식으로 블로그라니..

혹시 여기까지 보셨음 이미 밑천이 다들어났으니 빨리 결정하세요 ㅋㅋ

(지식의 전달이 아닌 그냥 삽질의 기록성 블로그입니다.)

다시 각설하고 디비랑 엮는건 다음 글에서.