본문 바로가기

분류 전체보기188

Mini-react-project[2] 원하는 아티스트의 이름을 박스에 적고 버튼을 누르면 서버로부터 해당 가수의 노래들과 가사들을 가져온다. 아티스트의 노래 중 원하는 노래를 선택하면 가사를 볼 수 있다. 1. express로 서버와 클라이언트를 연결해주는 브라우져 만들기. 외부 api에 정보를 요청할 때 fetch를 사용하는 것만으로 정보를 가져올 수 없었다. => express로 외부 api와 클라이언트를 이어줄 수 있는 매개 서버를 구축하고 axios라는 것을 사용해서 외부 api로부터 정보를 요청해서 가져올 수 있었다. 2. 한국어로 검색했을 때 에러문제 query에 한국어로 검색했을 경우 url에 관한 에러가 발생한다. 이때 encodeURI(요청 주소)를 사용하면 해당 에러를 해결할 수 있다. [encodeURI는 익스프레스에서 .. 2020. 11. 27.
1126 25일 어제는 11/9일부터 24일까지 배운 내용들에 대한 HA를 치뤘다. 요 근래에 배운 개념들을 정말 .. 나에게는 너무 어려웠다. 심지어 초심을 잃어가고 있는.. getting lazy... 그래서 그런지 코스 스케줄도 잘 따라가지 못했었기에..솔직히 걱정을 많이했다. 정말 진지하게 상담도 받아볼까 생각도 했었다. 하지만 상담 받을 자격이 없었다 ㅎㅎ 냉정하게 어려운 만큼 노력하지 않았고, 노력도 안했는데 걱정부터 한다니... 모순이다 ㅎㅎ 그냥 혼나고 싶었던 것 같다. 암튼! 정신 차리고 다시 개념을 공부하려고 했을 때에는 이미.. 조금 늦은 감이 있었지만 그래도 천천히 따라가려고 노력했다. 다행이 어제 치룬 ha는 스프린트때 고생한 것에 비해서 많이 어렵지는 않았다. 이번 sole study기간.. 2020. 11. 26.
1124 Lift state up은 부모컴포넌트에 연결된 자식컴포넌트의 수가 적을 때는 상관없지만 자식의 수가 많아진다면 코드가 굉장히 복잡해질 수 있다. (state drilling ) 이러한 문제점을 해결할 수 있는 것이 바로 redux library redux의 기본개념 : action Redux의 장점 1. 상태를 예측 가능하게 만들어준다. 2. 유지보수에 편리하다.(driiling을 하지 않아도 된다.) -> 히스토리 기능 3. 디버깅에 유리하다 (action과 state 로그를 기록한다면) 4. 테스트를 붙이기 쉽다(순수함수를 사용하기 때문에 테스트 용이) 상태 -> 히스토리라는 곳에 이전상태와 현재상태를 모두 저장된다. 액션-> 객체다. 리듀서, 액션, 디스패치, 컴포넌트-컨테이너 구조들. 머리가 ,.. 2020. 11. 24.
1123 ipex.tistory.com/entry/React-%EB%A6%AC%EC%95%A1%ED%8A%B8%EC%9D%98-%EC%9D%B4%EB%B2%A4%ED%8A%B8-epersist-aka-SyntheticEvent-If-you-must-keep-the-original-synthetic-event-around-use-eventpersist [React] 리액트의 이벤트 e.persist ( aka SyntheticEvent) If you must keep the original synthetic event around, use event. 안녕하세요 오늘은 간단하게 짚고 넘어가야 할 리액트 에서 이벤트 핸들링에 특징 이 있어 작성하려고 왔습니다. SyntheticEvent ( 합성 이벤트 ) onCha.. 2020. 11. 23.
1123 Youtube API와 리액트로 구현한 앱의 상호적용설정 실시간 데이터를 사용한 앱 초기화 실시간 검색 구현. 1. 오늘 스프린트 중 youtube api로 내가 만든 데모 서버로 연결시키는 작업을 ,,정말 이해하기 힘들었다. 2. server에게 데이터를 요청할 때 fetch를 사용했는데 이번 스프린트에서는 xhr 방식으로 요청하는 방식이 있다는 것을 알았다. 금,토,일 진도를 나가기보단 계속 검색만했다... 너무 답답해서 결국 치팅을 했다. 이번 스프린트는 치팅을 너무 많이했다 .. 검색하고 찾아봐도 도무지 이해기가 어려웠다. 먼저 익숙하게 만든 후 차근차근 원리를 이해해야겠다. 2020. 11. 23.
Mini-react-project[1] react 복습 mini-sprint => 노래 제목을 검색하고, 해당 가수의 노래 가사를 볼 수 있는 web구현. 1. 검색창 => input / button / click event 2. 노래리스트 => href / click event / print 3. 가사나오는 곳 => clikc event / print / parseJson 2020. 11. 23.
1121 이번주의 학습상태는 정말 코드스테이츠 학습 기간 중 역대급으로 최악이었다. 개념을 이해하지 못한 상태로 코드스테이츠의 스케줄에 맞추다보니.. 괜히 초조해지고, 초조해지니 개념을 익히고 스프린트를 진행해야하는 것을 알면서도 스케줄에 뒤쳐지는게 너무 싫어서.. 다른 분들의 코드를 치팅하면서 하고 있었다.. 이게 의미가 있을까 .. 오피스아워에서 설명해주는 개념들도 무슨 말인지 제대로 이해하지 못해서 속상했다. 이번주만큼 스케줄을 못따라갔던 적이 없었는데 ... 그래서 더 초조했었던 것 같다. 정말 ,,주말이 오길 기다렸다. 이번주 주말이 정말 중요하다. 제대로 공부하지 않으면 따라잡기 힘들다. 2020. 11. 21.
React 2020. 11. 19.
React 2020. 11. 19.