YG - 96년생 , 강아지 있음, 개발자 희망

에러가 나게 된 과정 MSW와 같이 사용하려는 목적으로 api/route.tsx를 통해 모킹 데이터를 내보내서 SSR(서버 사이드 렌더링)을 시도하였습니다. Error occurred prerendering page.라는 에러가 나오게 되었고, 많은 인터넷 검색을 통해 이유를 알게 되었습니다 이유 빌드 중에는 Next.js API 경로를 사용할 수 없습니다. 외부 url에서 데이터를 가져오십시오. 해결 방법 api/route.tsx를 통해 MSW와 같이 모킹 하여서 SSR을 할 수 없는 상황이었습니다. 그래서 외부 주소인 개발 서버의 api 주소를 통해 데이터를 가져와 보여주게 되었습니다 app/api/category/route.tsx import { MOCK_CATEGORY_LIST } from '@m..

보투게더 팀 블로그에서 작성한 글을 가져왔습니다 사용자가 업로드 한 이미지 압축하여 서버로 보내기 (feat.Browser Image Compression, Upload Images Converter, 이미지 압축 패키지 비교 (23.10.04 기준) Browser Image Compression https://www.npmjs.com/package/browser-image-compression 다운로드 수 : 137,399 번들 사이즈 : 55.51KB 마지 velog.io 이미지 압축 패키지 비교 (23.10.04 기준) 이미지 성능 최적화 사용자가 서버로 보내는 이미지의 용량을 줄여서 서버의 용량도 절약해 주고, 사용자가 이미지를 불러올 때 가볍게 불러올 수 있도록 하려고 했습니다. 그래서 사용자가..

이 글을 작성하게 된 이유 알고리즘 문제를 풀 때 배열 안의 배열의 형태로 문제를 풀려고 Array(N+1). fill([])을 했었습니다 이때 배열에 하나의 값만 추가하여도 모든 배열에 값이 들어갔는데요 처음엔 이해가 되지 않았지만 GPT에게 물어보고 답을 알았습니다. fill 배열을 할 때 한 가지 배열의 메모리값만 참조하여 모든 배열이 이루어진 것이었습니다 const arr = Array(N + 1).fill([]); const visited = Array(N + 1).fill(false); console.log(arr); arr[0].push(1); console.log [ [ 1 ], [ 1 ], [ 1 ], [ 1 ], [ 1 ], [ 1 ] ] GPT 답변 이러한 결과가 나오는 이유는 `Ar..

팀 블로그에서 가져왔습니다 nginx에서 정적 리소스 캐싱하기 (성능 최적화) nginx 설정에 들어갑니다 2.그리고 운영 서버에서 파일을 전달하는 위치에서 해당 코드를 작성해줍니다html은 캐싱하지 않습니다. 빌드 시 항상 이름이 똑같은데 안의 내용이 달라졌을 때 사용자 velog.io nginx에서 이미지 파일들과 javascript 번들 파일 캐싱하기 nginx 설정에 들어갑니다 2. 그리고 운영 서버에서 파일을 전달하는 위치에서 해당 코드를 작성해 줍니다 html - no Cache html은 캐싱하지 않습니다. 빌드 시 항상 이름이 똑같은데 안의 내용이 달라졌을 때 사용자에게 항상 최신의 데이터를 보여줘야 하기 때문입니다 location / { root /home/votogether/fronte..

리프레시 토큰이 제대로 들어오는 지 확인하고 싶어서 localhost를 https로 변경했는데 여전히 Set-Cookie가 되지 않는 문제가 있었습니다. domain=DOMAIN_NAME When searching the cookie list for valid cookies, a comparison of the domain attributes of the cookie is made with the Internet domain name of the host from which the URL will be fetched. If there is a tail match, then the cookie will go through path matching to see if it should be sent. "Tai..

팀 블로그에서 작성한 글을 가져왔습니다 https://velog.io/@votogether2023/axios-%EC%97%86%EC%9D%B4-%EB%A6%AC%ED%94%84%EB%A0%88%EC%8B%9C-%ED%86%A0%ED%81%B0-%EA%B5%AC%ED%98%84%ED%95%98%EA%B8%B0-feat.Set-Cookie-localStorage 보투게더의 리프레시 토큰 유저가 로그인 시 액세스 토큰은 짧은 만료시간을 가지고, 리프레시 토큰을 길게 만료시간을 가지게 하여 사이트의 보안성을 강화하기 위해 구현한 기능입니다 현재 보투게더에서는 토큰들을 더 안전하게 보관하고자 액세스 토큰은 로컬 스토리지에 담고, 리프레시 토큰은 쿠키에 담아서 따로 저장을 하여 쿠키 혹은 로컬스토리지가 탈취되었을 ..

팀 블로그에 있는 내용을 가져왔습니다 ngnix gzip 설정하기 (번들 사이즈 용량 줄이기) js 번들 사이즈 용량이 너무 커서 페이지 초기 로딩 속도가 너무 느린 현상이 있어서 번들 사이즈를 줄이게 되었습니다서버에서 ngnix/nginx.conf를 열어줍니다저희의 경우 ec2내의 docker에 ngnix가 위 velog.io 하게 된 계기 js 번들 사이즈 용량이 너무 커서 페이지 초기 로딩 속도가 너무 느린 현상이 있어서 번들 사이즈를 줄이게 되었습니다 설정 방법 서버에서 ngnix/nginx.conf를 열어줍니다 저희의 경우 ec2내의 docker에 ngnix가 위치해서 vim ngnix.conf를 통해 파일을 열어주었습니다 ngnix.conf 파일에서 https에 추가해줍니다 gzip on; g..

webpack-bundle-analyzer GitHub - webpack-contrib/webpack-bundle-analyzer: Webpack plugin and CLI utility that represents bundle content as convenient in Webpack plugin and CLI utility that represents bundle content as convenient interactive zoomable treemap - GitHub - webpack-contrib/webpack-bundle-analyzer: Webpack plugin and CLI utility that repr... github.com 이유는 webpack-derServer을 이용하고 있기 때문..