본문 바로가기

전체 글142

Full time Immersive 9주 후기 교육시간이 모두 끝나서 9주 후기를 작성한다. 10주 후에 후기를 작성하려고 했으나, 10주차부터 프로젝트를 시작하기 때문에 후기를 작성하고 프로젝트를 하면서 후기를 작성하면 좋을것 같다고 생각했다. 9주차에서는 실제로 내가 만든 코드를 사람들도 접속할 수 있도록 배포하는것을 배웠다. 만약 내가 작성한 코드를 인터넷에 배포하고 사람들이 접속하게 하려면 서버를 관리해주는 컴퓨터가 필요하고, database를 관리해야 하는 컴퓨터가 필요하다. 물론 서버컴에 database를 같이 사용할 수 있지만... 이러한 일들을 대신 해주는 서비스들이 있고 그것을 한번 사용해보는 시간이었다. codestates에서 소개해준 업체는 amazon이었다. 지금의 amazon 있게한 서비스 이다. 쇼핑몰로 착각하기 쉽지만 am.. 2020. 8. 9.
React - Redux Redux는 React 라이브러리 단점을 보완하기 위해 만들어진 라이브러리(독립적인 라이브러리-react가 없이도 사용이 가능하다) -예측가능한 상태 저장소(a predictable state container for javascript app) -스토어에 데이터를 넣는 유일한 방법(Reducer 메소드를 이용해서...)(보안, 안전 up) => 복잡성을 낮추고 예측이 가능한 상태관리를 할 수 있도록 해주는 라이브러리 만약 하기 그림처럼 제일 왼쪽 하단에서 state를 변경해서 제일 오른쪽 하단에 전달을 한다면 이렇게 state 리프트를 사용해서 root까지 끌어 올려서 state를 전달을 해야한다. 이런한 복잡성을 없애주는 라이브러리가 Redux이다. Redux는 state를 관리해주는 control .. 2020. 8. 9.
React - Phone book 만들기(마무리) 데이터를 생성 삭제 수정 기능까지 구현을 했다. 만약 데이터 양이 많아서 원하는 데이터를 찾기가 어려우면?? 검색기능이 있으면 될것같다. App.js에서 검색하면 글자들을 담을 수 있는 keyword라는 state를 만들었다. 그리고 handleSearch라는 함수를 만들고 변화되는 값을 keyword에 넣었다. 형태를 나타내는 코드는 PhoneForm에 작성을 했기 때문에 PhoneForm에 검색창을 만들었다. 그리고 검색창에서 들어오는 값을 handleSearch에서 받아 주어야 하기 때문에 statelift로 전달을 하면 된다. 검색하는 창이 구현이 되었고, 검색한 것이 잘 전달 되는지 확인을 하면 input 값이 잘 출력 되는것을 확인. input값을 받아오고 그 값을 기존에 있는 informat.. 2020. 8. 9.
React - Phone book 만들기(6) data를 수정하는 기능을 넣으려고 하는데 이전까지 phonelist를 함수형으로 진행했는데, 수정하는 기능은 toggle형태가 필요하고, state 값을 바꿔야 하기때문에 함수형을 class형으로 변환해야한다. 이전까지 작성한 return 이하를 복사해서 class를만들고 render안에 리턴값을 붙여넣는다. 그리고 data를 상속받는 형태로 바꿔준다. 그리고 onUpdate라는 함수를 App.js에서부터 받아올것이다. handleUpdate 함수를 만들고 자식 component를 전달한다. setState는 data(information)에 있는 값들의 id와 같으면 새로운 객체에 기존 데이터 ...list(information) 값에 ...data(phonelist에서 받아오는) 값을 덮어 씌운다... 2020. 8. 8.
반응형