🦁멋쟁이사자처럼 백엔드 부트캠프 13기 🦁TIL 회고 - [31]일차🚀31일차에는 먼저 Express 서버로 수정/삭제 기능 구현을 모두 완료하고 useEffect와 useEffect에서 cleanUp하는 부분을 배울 수 있었다.그 후 리액트로 구현했던 Todo 리스트 프로젝트를 조금 더 개선하여 "작성날짜"와 "할일완료유무" 등을 확인할 수 있도록 Memo 프로젝트를 진행하였다.잘 구현할 수 없을 것 같던 투두리스트 프로젝트를 기능별로 하나씩 구현해보니 시간은 꽤 오래걸렸지만 원하는 기능을 구현해낼 수 있었다.회고를 통해 프로젝트를 구현하면서 했던 생각들을 정리하고자한다! 리액트에 Express 적용 (할일 추가) express서버의 추가하는 부분 (index.js)let idGen = 3;rou..
🦁멋쟁이사자처럼 백엔드 부트캠프 13기 🦁TIL 회고 - [30]일차🚀30일차에는 리액트로 Todo리스트를 구현하면서 추가, 삭제, 수정 기능을 어떻게 구현하면 좋을지 배울 수 있었다.useState가 중요하게 자주 쓰였고 props로 함수객체와 데이터객체를 전달하여 다른 컴포넌트에서 수행한 값을 전달할 수 있었다. 회고를 통해 코드를 다시 해석해봐야겠다고 생각했다. Todo 리스트 만들기전체 컴포넌트를 감싸는 컴포넌트 = TodoBox 컴포넌트그 안에서 Input을 받는 Todo = TodoInput 컴포넌트Todo들을 보여주는 컴포넌트 = TodoList 컴포넌트추가 기능할 일 입력 후 엔터 입력 시 “할일이 등록되면서” 리스트에 정보 출력 (input태그에 이벤트onKeyDown 활용)리스트의..
🦁멋쟁이사자처럼 백엔드 부트캠프 13기 🦁TIL 회고 - [29]일차🚀29일차에는 상태관리를 할 수 있는 useState와 DOM객체를 참조할 수 있는 useRef에 대해서 배웠다.또한 부모-자식으로 묶여있는 컴포넌트들을 한번에 가져와 화면에 반영해볼 수 있었다. 범위는 적었지만 그 안에서 새롭게 배운것이 많아서 이번 회고를 통해 정리를 잘 해놔야겠다고 생각했다.여러 컴포넌트 전달 ▶️실습 - XML 요소(Element)안의 내용들을 props로 전달XML요소 Helloprops.children : props가 가지고 있는 내용을 전달Parent.jsfunction Parent(props){ return( {props.children} )}ex..
🦁멋쟁이사자처럼 백엔드 부트캠프 13기 🦁TIL 회고 - [28]일차🚀28일차에는 리액트를 배울 수 있었다. 이전에 조금 접했던 라이브러리이지만 토이 프로젝트로 빠르게 지나간 이유로 기초가 많이 부족했다. 또한 시간이 많이 지나 기억이 잘 안나기도 하였다.리액트의 기초부터 배우게되면서 리액트의 상태변화라던지 DOM을 가상 DOM으로 사용하는 것들이 자바스크립트 라이브러리에서 리액트가 자주쓰이는 이유임을 알 수 있었다. 회고를 진행하면서 다른 실습도 진행해봐야겠다고 느꼈다. 리액트 React리액트 js : 메타에서 개발한 “오픈소스 자바스크립트 라이브러리”Angular, Vue.js 와 함께 프론트엔드에서 많이 쓰임Virtual DOM (가상 문서 객체 모델)을 활용하여 업데이트해야하는 DOM 요소를..