유이로운 개발일지

https://resolve-book.vercel.app/ React App resolve-book.vercel.app 위 링크에서 [고민해결책] 사이트를 방문해 주신 뒤 로그인 해 주시면 모든 기능 활용이 가능합니다! (비로그인 시에는 사용이 어렵습니다!) https://github.com/yui62yui/resolve-book GitHub - yui62yui/resolve-book Contribute to yui62yui/resolve-book development by creating an account on GitHub. github.com 프로젝트 Git 링크 1. Keep - 손형정: 서로간의 도움과 배려 - 이소율: 팀원들과의 배려 / 커밋컨벤션, 초기 기획 등 약속을 탄탄히 하는 것. - ..

나타난 현상 1. Jotai를 이용해 const [selectedPost, setSelectedPost] = useAtom(selectedPostAtom); 라는 Atom을 만들었다. 이후 이 selectedPost라고 하는 Atom을 SavedPage.jsx와 Card.jsx에서 사용하였다. 2. SavedPage.jsx 안에 Card.jsx이 있고, Card.jsx 안에 존재하는 함수를 작동하면 setSelectedPost가 실행되며 selectedPost가 변경된다. 따라서 selectedPostAtom을 구독하고 있는 모든 컴포넌트에서 랜더링이 일어나야 한다. 3. 하지만 Card.jsx안에서만 랜더링이 일어나고, SavedPage.jsx는 랜더링이 일어나지 않아 아무런 변화가 없는 상황이었다. ..

{data?.map((post) => { if (post?.uid === user?.uid) { return ( { showPostHandler(post); }} > {post?.userConcern} { deletePostHandler(post.id); }} > 삭제 ); } })} 해당 코드에서 지속적으로 Array.prototype.map() expects a value to be returned at the end of arrow function라는 경고문이 발생하였다. '경고'이기에 잘 돌아가긴 하지만 Warning 없이 깔끔한 방법이 좋기 때문에 해결방법을 찾아냈다. 결론적으로 해당 문제는 아주 간단하게 해결 가능하다 {data?.map((post) => { if (post?.uid === u..

redux 를 대체해서 사용할 수 있는 전역 상태 관리 라이브러리인 'Recoil' 에 대하여 간단하게 알아보자 :) 1. Recoil의 세팅 방식 Recoil의 세팅 방식은 아래와 같다. import React from "react"; import ReactDOM from "react-dom/client"; import "./index.css"; import App from "./App"; import { RecoilRoot } from "recoil"; const root = ReactDOM.createRoot(document.getElementById("root")); root.render( ); 위 코드처럼 최상단에 를 감싸 준다. redux를 사용할 때 최상단에 store을 넣는 것과 비슷하다고..