본문 바로가기

전체 글400

[TIL] 오늘의 개발일지 우왕앙앙아앙ㅇ앙ㅇ!!!!!!! 내일 드디어 금요일이당 !!!!!!!!!! 오늘은 오전에 댓글창에서 유저가 아닌(비로그인) 사람은 댓글 input창이 보이지 않도록 코드를 수정하고, 기술노트를 작성했다 아참, 추가로 ㅎㅈ님이 알려주신 리코일 공식문서를 뜯어보면서 공부했는데 확실히 리덕스보다 훨씬 편한 느낌이 들었다 (리덕스 같은 경우에는 state를 변경하려면 dispatch에 action이랑 payload 날려서 store의 리듀서가 변경시키도록 했었는데, 리코일은 전역으로 관리되고 있는 state를 useSetRecoilState를 사용해서 한번에 뽷 변경시키는 너낌이었음) 아무튼~ 오후에는 원래 UI 작업을 진행하려고 했는데 큼지막한 넘을 갑자기 만나서 ( 자세한건 나의 공부일지에 모두 기록 ㅇ_< .. 2023. 2. 16.
3시간은 머리 싸맨거같은 브라우저 뒤로가기 버튼 클릭시 이전 페이지로 보내기 ( next.js + react 같은 페이지 내 컴포넌트 갈아끼우는거) https://warn-code.tistory.com/300 next.js에서 하나의 페이지에 여러 컴포넌트 갈아끼워지는것처럼 만들기 / 리액트 라우터돔처럼 그동안 리액트로 작업을 할땐 router를 이용하는 방식을 썼는데, 이런식으로 라우터라는 js 폴더를 만들어서 Route 안에 element 속성으로 컴포넌트를 끼워주었었다. next.js를 사용하면서 로그인 페이 warn-code.tistory.com 앞전에 next에서 컴포넌트를 갈아끼우는 로직까지는 성공했는데 (궁금하면 위 포스팅 참고!!!!) 오늘은 또다른 고민이 나를 붙잡았다 바로바로 컴포넌트를 갈아끼워주는 식으로 브라우저 상 보여지는건 성공했다고 치는데, 실제로 url은 변화하지 않고 (리액트의 라우터돔 사용할때는 url까지 바뀌었자농) .. 2023. 2. 16.
next.js에서 하나의 페이지에 여러 컴포넌트 갈아끼워지는것처럼 만들기 / 리액트 라우터돔처럼 컴포넌트 갈아끼워주기 그동안 리액트로 작업을 할땐 router를 이용하는 방식을 썼는데, 이런식으로 라우터라는 js 폴더를 만들어서 Route 안에 element 속성으로 컴포넌트를 끼워주었었다. next.js를 사용하면서 로그인 페이지를 페이지는 하나만 쓰고, 컴포넌트를 갈아끼우는 방식으로 사용하려고 했는데 pages라는 폴더에서 페이지를 생성한 뒤 데려오는 방식만 알다가 (React에서 react-router-dom의 라우팅은 CSR을 제공하고 Next에서 제공하는 File System의 라우팅은 SSR을 제공) 리액트라우터돔없이 컴포넌트를 데려오려하니 갑자기 멍- 해졌었다 우선적으로 하나의 페이지에서 컴포넌트를 갈아끼워주는걸 해주고 싶었기에 튜터님의 힌트를 통해 state 하나를 만들어서 아래처럼 컴포넌트를 갈아끼워지는.. 2023. 2. 16.
[TIL] 오늘의 개발일지 프로젝트 기간 특징 : 개발일지 쓰려고 보면 오늘 뭐했더라 갑자기 멍때리게 됌 되게 뭔가 작업을 많이 하고 돌아온거 같은데 나 오늘 뭐했지 하면 멍해진당 오늘은 로그인시 페이지가 새로고침 되는 과정에서 유저 정보가 바로 불러오는데까지 걸리는 시간차때문에 발생하는 문제를 잡기 위해서 세션스토리지를 사용해서 유저 정보를 저장하고 해당 정보로 확인하여 변경시키는 로직을 추가했다 또.. 댓글 CRUD을 CSR로 바꾸기 위해서 짜놓았던 로직을 전면 수정했다 그리고 처음에 만들땐 몰랐는데, 수정하기를 클릭하면 전체 댓글의 input창이 조 ㅏ라락 같이 열리는 문제가 발생했고 어떻게 할까 지이인짜 오래 고민하다가, 해당하는 Index값과 일치하는 가짜(?)index를 만들어서 일치하는 애만 보이도록 하면 어떨까 하고.. 2023. 2. 15.
[TIL] 오늘의 개발일지 오늘 프로젝트 작업 중에 진짜 너무 재밌는 사실을 하나 알았다 나는 next.js를 사용할때 새로고침을 하면(url직접 치고 들어가거나) currentUser 정보가 undefined가 되는 이유가 다시 서버에서 랜더링을 하면서 기존에 (뭔가 어디 쿠키에 저장되어잇을거라고 생각했음) currentUser의 정보가 날라가서 다시 새로고침을 했을때 기존 정보가 사라져있는거라고 생각을 했는데 완죠니 나의 착각 경기도 오산이어따 세상에나, 새로고침을 하면 user 정보가 날라갔다기보단 다시 브라우저가 fetch를 시키면서 파이어베이스에 다시 연결작업을 하면서 "나 인증 좀 해주세연" 하고 요청을 보내는동안에 if(auth.currentUser) 같은걸로 식을 걸어놓은 UI가 마치 유저 정보가 날아간 것처럼 보였.. 2023. 2. 14.
next.js에서 Image is missing required "src" property 에러 해결법 hydration 에러를 잡고나니 눈에 보이는 Image가 src를 잃었어여..... 기존의 나의 코드는 요로코롬 되있었는데, 혹싀 이것도 처음에 imagePreview가 뭔지를 못찾아서 나는 에러인가 싶어서 기본 이미지를 프로젝트 내에서 하나 만들어놓고 {imagePreview ? ( ) : ( )} 요런식으로 imagePreview라는 state의 값이 있을때만 저렇게 src에 꽂히도록 수정을 하니 에러가 해결되었당 ㅇ_ 2023. 2. 13.

티스토리툴바