전체 글451 CODESOOM: REACT -2 Facts (사실, 객관) : 이번주는 과제1을 끝까지 해냈다. 비록 일주일 내내 붙들고 있었지만 거의 처음으로 풀이 영상 안보고 한거에 의의를 두는걸로,, 그런데 과제1을 다 끝내고 과제2를 시작하려고 했었어서 과제2는 풀이 영상이 올라온 후에야 시작하고 완성할 수 있었다. 저번 기수에서 이해도 못하던 코드들을 이제는 혼자서 작성할 수 있게 됐다. ˚ counter 앱 만들고 파일 분리 Feelings (느낌, 주관) : 조금씩 과제를 하는것, 코드를 작성하는 것 등등이 처음에 비해 나름 익숙해지고 있는 것 같다. 과제2도 빨리 PR해서 피드백 받을걸 ㅜ 과제 풀이 영상을 보고 해버린것이 아쉬웠다. 시간이 많은데도 시간 활용을 제대로 하지 못한것 같아서 씁쓸하다.. Findings (배운 점) : 공식.. 2021. 5. 17. CODESOOM: REACT -1 Facts (사실, 객관) : 저번 기수 중도 하차 후에 다시 재수업을 듣는것이라 과제를 해야되는지 아닌지에 대해서 의문이 들었다. 과제를 다시 해보라는 답볍을 얻은 후 과제를 시작했는데 거의 한 주가 끝나가고 있어서 두번째 과제는 손도 대지 못한채로 끝났다. 결국 일요일에 올라온 풀이 영상 시청 후에 과제를 마무리 지었다. 이미 repository는 fork되어 있는 상태라 클론을 받으면 전에 해뒀던 과제 코드들이 그대로 받아져서 곤란스러웠다. 다음주 부터는 코드 초기화 후 다시 머지하고 하는걸로,, Feelings (느낌, 주관) : 저번 기수에서 했었던 과제들임에도 불구하고 어떻게 코드를 작성했었는지 전혀 생각이 나지 않았다.. 다시금 부족함에 대해서 깨닫게 되었다.. 그래도 더 열심히 공부하는 원.. 2021. 5. 12. npm ? npm ? : npm은 software registry로써 Node Package Manager를 의미한다. npm은 자바스크립트 런타임 환경인 Node.js의 기본 패키지 관리자 역할을 한다. npm을 통해 package 또는 module이라고 불리는 자바스크립트 소프트웨어를 자신의 프로젝트에 설치할 수 있다. npm 구성 : website / Command Line Interface(CLI) / registry npm install 혹은 npm i : package.json에 있는 패키지들을 전부 설치 처음에는 npm i해서 전부 다 설치해 주면 되고 그 후에 어떤 라이브러리를 사용하기 위해서 추가하려면 npm intall 패키지명 이런식으로 추가하면 된다. 2021. 4. 21. react .tsx와 .ts 확장자 차이? : .ts는 순수한 typescript로 반응 구성 요소이며 .tsx는 jsx가 포함된 파일로 도우미 함수를 포함한다. 2021. 4. 21. CODESOOM: REACT -3 한 것 : 컴퍼넌트 마다 테스트를 작성했다. fireEvent와 expect를 사용했다. fireEvent.click(getByText('추가')); expect(handleClickAddTask).toBeCalled(); 예를 들어서 이런 코드가 있다고 치면 이 코드는 '추가' 버튼을 누르면 expect에서 결과 값을 불러들어온다는 의미이다. 이런 의미가 아니라면 댓글 달아주세요,, 배운 것 : TDD cycle이라는 것을 배웠다. TDD cycle의 순서로는 RED - GREEN - REFACTORING 이렇게 세 단계가 있다. 우선, RED는 실패하는 테스트들을 확인 할 수 있다. 이때, 에러 메시지를 먼저 확인하는 것이 중요하다. GREEN은 통과, REFACTORING은 코드들을 올바르게 되도록.. 2021. 2. 7. CODESOOM: REACT -2 한 것 : 리액트 컴포넌트 분리 버튼이 클릭 되었을 때 클릭 이벤트가 실행되도록 구현 라이브러리의 임포트와 로컬 파일 임포트 구분 배운 것 : if를 사용해서 리턴하는 법을 배웠다. vscode에도 에러가 없을때 웹에서 에러가 있을때 npm run test:e2e를 이용해서 좀 더 자세하게 에러난 부분을 확인 할 수 있는 것을 알게 되었다. function handleClick(value) { setState({ count: count + value, }); } 이 부분은 원래 value 대신에 increase를 썼었는데 +랑 의도가 중복 된다구 하셔서 수정한 것! 이렇게 사소한 것들도 신경 써줘야되는구나 생각했다. 리액트 훅이라는 것도 첨 배운거고 Input을 할때 change는 이벤트를 돌려준다는 것.. 2021. 1. 31. 이전 1 ··· 72 73 74 75 76 다음