심심한 개발 블로그
next-router-non-mounted 에러 처리
FrontEnd/NextJs 2024. 4. 8. 12:36

이번에 흑집소랑 마와셀 웹 서비스를 개발하면서 Next.Js 14를 쓰게 되었다. 근데 기존 12버전에서 쓰던 코드 일부를 붙여서 사용하던 도중 에러가 발생하였다. Unhandled Runtime Error. NextRouter was not mounted. 왜 그런거 찾아보니 Router 사용법이 조금 변했다. 그리고 전과는 다르게 13이후 부터는 기본이 Server Component가 기본이라 클라이언트로 사용하려면 상단에 "use client"를 명시해야 한다. 근데 client를 명시해도 not mount 에러가 발생한다. 이 경우 아래와 같이 import를 바꿔주면 된다. "use client" //구형 //import {useRouter} from "next/router"; //신형 (13 이..

article thumbnail
Next.Js 14의 app router 사용 시 페이지 갱신 처리 방법
FrontEnd/NextJs 2024. 4. 8. 01:09

🥂와인 관리, 시음노트, 셀러 관리는 마와셀로~🍷 내가 산 와인 가격이 적당할까 궁금할 땐 아래 마와셀 웹에서 확인해보세요👇 작은 광고 양해 부탁드립니다. 👇주인장이 직접 만든 서비스👇 마와셀 마와셀은 와인과 관련된 정보를 제공하는 서비스입니다. 앱에서는 보유한 와인의 관리, 시음노트 작성, 보유 와인 셀러의 관리 기능을 제공합니다. appmyc.info Android (Google Play Store) Apple (App Store) 마와셀 마와셀은 와인과 관련된 정보를 제공하는 서비스입니다. play.google.com 마와셀 마와셀은 와인과 관련된 정보를 제공하는 서비스입니다. itunes.apple.com 블로그를 옮기고 나서... 블로그를 옮기고 나서 쓰는 첫 글인 것 같다. 깃블로그에서 쓰던 ..

article thumbnail
반복문에서 비동기 처리하기 (for, map, async, await)
Language/Typescript 2024. 4. 7. 21:37

이 글은 기존 Github 개발 블로그에서 이전된 글입니다. 작성된 기간이 오래되었으니 이 점 참고해주시길 바랍니다. 반복문에서 비동기를... 최근 개발 일정 및 개인 사정으로 인해 포스팅을 전혀 하지 못했다. 네이버 블로그는 일상이나 가벼운 소재라서 막 쓸수 있지만 개발 블로그는... 아무렇게나 막 싸지르는 공간도 아니고, 다른 예제 복붙하는거는 정말 싫어해서... 그래서 더 미루지 않았나 싶다. ㅎㅎ 흑우집합소 패치 내역이나 개발한 걸 TIL 쪽에 올리려다가 이제는 따로 카테고리를 빼야 할 듯 싶다. 이것도 많이 밀렸는데 언제 적는지... 무튼... 평화롭게(?) 개발을 하다가 반복문을 사용하면서 비동기 처리하다가 조금 막힌 부분이 있었다. 이번 포스팅에서는 그 문제, 그리고 조사, 해결방법을 공유하..

article thumbnail
Typescript 프로젝트 만들기 (With VSCode)
Language/Typescript 2024. 4. 7. 21:29

이 글은 기존 Github 개발 블로그에서 이전된 글입니다. 작성된 기간이 오래되었으니 이 점 참고해주시길 바랍니다. Typescript Playground가 필요하다 Typescript로 개발을 하다가 뭔가 특정 기능(프로젝트와 무관한)을 테스트 해보고 싶은데, 이걸 매번 진행하는 프로젝트 내에서 테스트하기가 좀 불편했다. 물론 타입스크립트 온라인 플레이그라운드가 있긴 했지만 내 로컬에서 도는 것이 필요했다. 그래서 하나 만들면서 미래의 내가 또 잊을까봐 기록을 남겨둔다. 참고로 특이 사항 및 환경은 아래와 같다. Mac OS, VSCode 사용 npm이나 yarn 설치 가정 typescript를 전역 설치가 아닌 프로젝트 내에서만 사용하게끔 처리 1. 폴더 생성 및 초기화 먼저 디렉토리를 적당한 곳에..

[Javascript] 배열 합치는 방법
Language/Typescript 2024. 4. 7. 21:26

이 글은 기존 Github 개발 블로그에서 이전된 글입니다. 작성된 기간이 오래되었으니 이 점 참고해주시길 바랍니다. 배열 합치기(?) 프로젝트를 진행하다가 배열을 좀 다룰 일이 있어서 찾아봤다. 그냥 안써두면 까먹을거 같아서 기록해둔다. 방법은 여러가지가 있는데 하나씩 적어둔다 1. concat 함수 이용 const tmpArr1 = ['value1', 'value2', 'value3'] const tmpArr2 = ['1', '22', '333'] const result = tmpArr1.concat(tmpArr2) //두 개 이상을 전달할 수 있다 //const result = tmpArr1.concat(tmpArr2, ["tmp1","tmp2"]); //이 방법도 가능하다 //const resul..

article thumbnail
(회고록) 흑우집합소 웹 & 모바일 서비스를 오픈해보면서...
MHLab/개발 雑談 2024. 4. 3. 16:17

이 글은 기존 Github 개발 블로그에서 이전된 글입니다. 작성된 기간이 오래되었으니 이 점 참고해주시길 바랍니다. 🎉매주 로또 추천번호는 흑우집합소에서~👇 작은 광고 양해 부탁드립니다. 👇주인장이 직접 만든 서비스👇 흑우집합소 대한민국 No.1 로또 서비스 bcow.world Android (Google Play Store) Apple (App Store) 흑우집합소 대한민국 No.1 로또 서비스 play.google.com 흑우집합소 대한민국 No.1 로또 서비스 itunes.apple.com 간만에 올리는 개발 포스팅 (글 시작에 앞서 장문의 내용이며, 개발의 관점과 더불어 다른 관점에서도 작성됨을 미리 고지합니다.) 정말 오랜만인것 같다. 마지막이 7월달 포스팅이었는데 거진 두달 정도 뒤에 포스..

LIST
profile on loading

Loading...