본문 바로가기

FE/Next

(3)
Next (12+) + twin.macro (tailwindCSS) setting https://velog.io/@you1367/%EA%B0%9C%EB%B0%9C%ED%99%98%EA%B2%BD-%EA%B5%AC%EC%B6%95TypescriptNextEmotionTailwindTwin.macroapollo 개발환경 구축[Next+Emotion+Tailwind+Twin.macro] 네트워크엔지니어 주제에 이것저것 해보고 싶은게 많다.백엔드는 NestJS를 사용을 하고있고, 앞으로도 그럴 것 같다. 프론트엔트는 React 경험이 있지만, 개인프로 젝트 목적상 SEO 가 가능해야하여 velog.io 이거 한 다음에 .babelrc 에 "@emotion/babel-preset-css-prop" 추가하기. 고통스러웠다. swc 는 왜 안되는지 모르겠다. ---------------------..
Router 사용시 socket 연결이 되지 않는 현상 window.location.href 쓸 때는 잘 되는데, Router.push 쓰니까 웹소켓이 연결되지 않는다. // socket.js const socket = io.connet({}); export default socket // somePage.jsx import socket useEffect(() => { if (asPath.indexOf('url') !== -1) { if (socket) { socket.on{ socket.emit{ socket.on{ // ajax function, rerender function here } } } } } }, [asPath]) // asPath = useRouter().asPath window.location.href 로 이 코드를 동작시키면 페이지 이동..
NextJS meta (SEO) 태그가 중복되어 생기는 현상 개발자도구 말고 페이지 우클릭 > 페이지 소스보기 해서 렌더링이 잘 되고 있는지부터 확인해야한다. meta 태그가 들어가있으면 렌더링이잘 되고 있는거 ㅇㅇ 안 들어가 있으면 1. Next/Head 를 쓰고 있는지 확인하고 2. app.jsx 혹은 각 페이지 파일에서 return false / return NULL 같은 렌더링을 방해하는 요소가 있는지 확인 3. 있으면 지워 짜증나게하지마 https://github.com/minseolee/minSEO