리액트 컴포넌트는 클래스형 컴포넌트(Class component)와 함수형 컴포넌트(Functional component)로 나뉜다. 기존의 개발방식은 일반적으로 함수형 컴포넌트를 주로 사용하되 state이나 Life Cycle Method를 사용해야 할 때에만 클래스
사용자 인터페이스를 UI를 만들기 위한 자바스크립트 라이브러리 이다.선언적컴포넌트를 이용해 재사용성이 용이virtual dom을 위한 최적화 (한번에 필요한 부분만 업데이트 해주기 위한 )Create react app(툴체인) 도구들을 엮어서 모아둠💡 툴체인이란, 컴
사용자 인터페이스(UI)를 만들기 위한 자바스크립트 라이브러리 이다.규모가 커지고 복잡한 애플리케이션을 개발하며 생산성을 향상시키고 많은 양의 데이터 관리와 코드 유지 보수를 더욱 편리하게 하기 위해 다양한 프레임워크, 라이브러리가 등장하게 된다. 그 중에 리액트는 오
📝 문제 위의 코드는 map() 함수를 이용하여 댓글을 하나씩 반환하는 함수이다. 🔥💥 Warning: Each child in a list should have a unique "key" prop. 하지만, 에러가 발생했다! 여기서 우리는 중요한 key props에 대하여 알아봐야 한다. 🔑 key key는 React가 어떤 아이템이 바뀌...
몇 주에 걸쳐 진행된 위스타그램 프로젝트 리팩토링을 했다.지금까지 기능 구현과 레이아웃에만 포커스를 두었다면, 마무리 단계에서 동료분들과 멘토님께 받은 리뷰를 반영하여 리팩토링을 해봐야겠다. 변수명 혹은 함수명은 실제 하는 동작과 동일하게 작성해야 하며,특히 위의 함수
리액트 버전 모달창 만들기 > 우선, modal창을 관리할 useState를 만들고, dim처리 할 부분을 useRef를 사용하여 접근한다. 그리고 버튼을 눌렀을 때 모달을 보여주는 openModal 함수, 모달을 펼쳐져 있을 때만 닫아주는 closeModal 함수
상수 데이터는 변하지 않는 데이터로, 정적인 데이터이다.반복되는 UI를 하드코딩으로 일일이 만들어두게 되면, 코드가 길어져서 가독성에 좋지 않고, 수정이 필요할 시 해당하는 부분을 찾기 힘들어 추후 유지보수가 힘들어질 수 있다.이를 위해 상수 데이터를 만들어 관리해주면