선생님 깃 질문드려도될까요 게시판이 따로 없어서..

감사합니다 선생님 추가로 질문 하나만 더 드릴게요..

  const [posts, setPosts] = useState<PostProps[]>([]);

useEffect(
...(데이터 api에서 불러오는 코드)
);

  <div className='post'>
        {posts?.length > 0 ? (
          posts?.map((post) => <PostBox post={post} key={post.id} />)
        ) : (
          <div className='post__no-posts'>
            <div className='post__text'>게시글이 없습니다.</div>
          </div>
        )}
  </div>
 
 
위의 코드 질문이 있습니다.

새로고침을하면 잠깐 게시글이없습니다. 문구가 뜨고 다시 post데이터를 랜더링시켜주는데요

1. 개발자모드에서만 이런 현상이 나타나는거라, 무시해도되는걸까요?

아니면 배포를해도 이런 현상이 나타나나요?

2. 이걸 방지해주기위해선 보통 어떤 방법을쓰나요?

예를들면 이런식으로 해주나요?

데이터 api를통해 데이터 불러오고 불러오는동안 로딩처리를 해주는식.

3. 만약 2번과 같은 방법이라면 지금 App.tsx파일에 전역으로 로그인유저 로딩처리를해주었는데

( 사용자 로그인 유무확인 api, 로딩처리 )

로그인 유저 로딩처리와 post 로딩처리가 겹쳐서 성능저하나 트러블(?)같은게 일어나지는 않을까요?

답변 감사합니다.

서칭해보니까 요즘 useEffect로 api를 요청하는 게 안티패턴으로 향하고 있다고하네요, 그래서 잘 안쓰인다고...
리액트쿼리를 사용하던가 하라네용

생각해보니 그렇네요..

선생님 근데 한가지 더 질문드리겠습니다 ㅠㅠ..

지금 하고있는 프로젝트가 ( 아직 개발전 ) 깃헙을 보니까 프론트, 백엔드 레포지토리가 나눠져있더라구요

그래서 프론트 레포지토리에서 클론해와서 코드 살펴보고있는중인데,

예를들면 api통신은 그럼 어떻게해줘야하는건가요?

제가 혼자서 작업할땐 프론트 백엔드 둘다 한 레포지토리에 두고서

예를들면 한 폴더안에

client 폴더와

server폴더로 나눠서 작업했었어요

그래서 client  폴더에서 npm run start로 프론트 키고,

server폴더에서 npm run dev로 서버 키고,

그렇게 api통신하고 작업하고 했었는데

지금도 그렇게하면될까요?

프론트와 백엔드가 나눠져있으니까

vscode에서 프론트 하나 키고

vscode에서 백엔드 하나 켜서

서로 터미널에서 뭐 예를들면 npm run start . npm run dev해서 켜놓고 하면 되는걸까요..

보통 어떤식으로 해야하나요?

사실 지금 프로젝트 관련된 사람한테 물어보는게 가장 베스트인데

죄송합니다..