#jotai

react에서 복잡한 상태를 관리할때.. 한번에 관리? 분리해서 관리? (jotai, recoil, useState)

안녕하세요 react를 이용해서 복잡한 작성 페이지를 만들고있습니다. 아래의 타입은 예시입니다. type payload = { name: string; message: string; type: string; url: { pc: string; mobile: string; }; contents: { images: { url: string; name: string; }[]; buttons: { name: string; url: string; }[]; }; conditions: { ... }, .... }; 위처럼 복잡한 데이터를 서버로 보내줘야해서 데이터를 관리해야하는데 현재는 페이지내에 구조가 복잡하고 컴포넌트도 매우많아 props drilling이 너무 심해질거같아서 recoil, jotai와 같은 상태관리 라이브러리를 이용해서 작업을 진행하고있습니다. 이러한 상황에서 관리하는 데이터를 한객체에 모아서 관리하는게 좋은지 아니면 const nameAtom = atom(''); const messageAtom = atom(''); const typeAtom = atom(''); const urlAtom = atom({ pc: '', mobile: ''}); .... 처럼 일일히 쪼개서 관리하는게 맞는 방향인지 모르겠어서 질문드립니다 ! (사수가없어서 물어볼곳이없어요...) 현재는 아래와같이 쪼개서 작업한뒤 submit시에 합쳐주는 방식으로 구현해놓았는데 atom 갯수가 20개 정도 되버리니까 너무 복잡해보여서 이게맞나... 싶어서 질문드리게되었습니다.

프론트엔드 유효성 검사 어떻게 하시고 계신가요?!

진행하는 프로젝트에서 form에 관리하는 state들이 10개정도되는 편이라 recoil 이나 jotai로 state관리를 진행하고있습니다. 유효성검사가 필요한 부분들은 마찬가지로 const [nameError, setNameError] = usState('') 이런식으로 선언하여 name 변경시 setNameError(value ? 'error message' : '') 형식으로 관리하고있습니다. 각 state마다 이렇게 처리하니 추후 복잡해보이기도해서 더 좋은 방법은 없는지 어떻게 처리하고계신지 궁금해서 질문남깁니다 !

Jotai가 Provider 없이 컴포넌트간의 atom 공유가 가능한 이유

상태관리 라이브러리인 jotai를 사용할때, Provider로 감싸지 않아도 atom 선언과 useAtom을 이용해 컴포넌트간의 공유가 가능한걸로 알고 있는데, 그 이유가 무엇인가요? 내부적으로 context api를 사용하는걸로 알고 있는데 provider가 없이 어떻게 가능한걸까요?

nextjs app router

많이들 사용하시나요? 사용한다면 어느 조합으로 사용 하고 계신지 궁금합니다. 주로 궁금한거는 기존의 v13 or v14, 기존의 css-in-js 사용이 불가능한 상황에서 스타일링에는 무엇을 사용하는지, 별도의 데이터 패칭 라이브러리(swr, tanstack-query)와 전역상태도구(zustand, jotai)를 사용하는지. 음 기존 page router 쓰시던 분들은 프로덕션 레벨에서도 마이그레이션 해서 사용중인지도 궁금하네요 추가로 특정 조합에 장점이 있는지도 궁금합니다 감사합니다!

React 상태관리 라이브러리에 대해서 질문있습니다 !

안녕하세요 새로운 프로젝트를 들어가기전 라이브러리를 고민중입니다. 한번도 사용해보지않은 zustand 혹은 jotai 를 사용해보고싶은데… 보통 zustand나 jotai를 사용할때 비동기처리 같은 부분도 해당 라이브러리만 이용하는지… 아니면 redux나 react-query 를 같이 사용하는지 궁금합니다…! 그리고 다른분들도 선호하시는 라이브러리가 있으시면 알려주십셔 !!! 감사합니다 !!!