react

[React] Zustand란? 사용하는 이유! (상태 관리 라이브러리, 사용 방법 예시)

Zustand는 독일어로 '상태'라는 뜻으로 React 생태계에서 사용하는 상태 관리 라이브러리입니다. 현재 Redux가 압도적으로 많이 사용되고 있지만, 문법이 더러운 편이라 학습에 시간이 필요합니다. Post Redux로서 사용자가 빠르게 늘고 있는 힙한 곰돌이 친구 Zustand에 대해서 알아봅시다. 😎 📝 사용하는 이유 ⦁ React에서 데이터는 단방향 기본적으로 React의 데이터 흐름은 State & Props를 사용해 단방향으로 이루어져야 한다는 원칙이 있습니다. 이러한 데이터 흐름은 단순하고 예측 가능하며, 컴포넌트 간의 관계를 명확히 정의하기 때문에 유지 보수성을 향상시킵니다. ⦁ 음.. 컴포넌트가 너무 많으면? 하지만 데이터를 전달하는 과정에서 거쳐야 하는 컴포넌트가 너무 많은 상황이라..

[React] 자식 컴포넌트에서 부모 컴포넌트로 데이터 전달하기

State는 부모 → 자식으로 밖에 값을 전달하지 못한다고 배웠습니다. 하지만 컴포넌트를 분리했을 때 자식 컴포넌트에서 연산한 데이터를 부모에서 사용하고 싶은 경우가 있습니다. Redux 등 전역 상태관리 라이브러리를 사용하지 않고도 할 수 있는 방법을 찾았습니다.😀 함수를 전달하면 됩니다. 👍 📝 자식 컴포넌트 → 부모 컴포넌트 ⦁ 📑 부모 컴포넌트 //전달 함수 const [audio, setAudio] = useState({}) const getAudio = (x) => { setAudio(x) } //return 문 ... //state 넘기듯이 함수도 넘길 수 있습니다. ✔ 자식 컴포넌트에 전달할 함수를 선언합니다. 해당 함수를 자식에서 사용하면 결과적으로는 부모 컴포넌트의 State가 변경되어..

[Node.js] React와 Express로 CRUD 게시판 웹 서버 만들기 - 2 (REST API)

지난내용 https://hyunki99.tistory.com/44 [Node.js] Express 웹 서버 만들기 (mySQL 연동) - 1 Express란 "Node.js를 위한 가장 빠르고 개방적인 간결한 웹 프레임워크"다. MIT허가서로 라이선스 되는 자유-오픈 소스 소프트웨어다. 웹 어플리케이션, API 개발을 위해 설계되었고, Node.js의 사실상 hyunki99.tistory.com 지난 포스팅에서 Express와 mySQL의 연동을 성공했습니다. Create : 게시글 쓰기 Read : 게시글 조회 Update : 게시글 수정 Delete : 게시글 삭제 위 기능들을 Express를 사용해서 REST API를 구현해 봅시다. REST API는 오늘날 웹에서 가장 많이 사용되고 있는 유연한 ..