Study55 [Next.js] public > images, fonts 트래픽(성능) 이슈 (Local fonts를 곁들인...) 이슈 복기를 위한 정리... 현재 서비스 중인 사이트는 Next.js + Nuxt + asp 로 구성되어있다.그러다보니 인터넷이 빠른 환경에선 티가 나지 않았지만, 새롭게 Next.js 페이지로 들어오면 폰트에서 Layout Shift가 발생 중이었다.기존엔 @font-face로 public에 있는 폰트 파일을 로드하고 있었고, 이를 Next.js의 Local Fonts의 preload, fallback을 사용해서 개선하고자 하였다.그렇게 수정 후 라이브 배포하였는데...! Next.js 서버 트래픽이 튀는데요..? Local Fontshttps://nextjs.org/docs/app/getting-started/fonts#local-fonts Getting Started: Fonts | Next.jsL.. 2025. 6. 4. [Next.js] Atomic을 지나 FSD를 거쳐서 태초마을로 오기까지 태초마을로 오기 전까지의 우리 팀 프로젝트 구조는아마 AI도 이해를 포기할법한 아키텍쳐였을 것이다.2023년 11월, 약 4년만에 프론트엔드 바닥에 다시 들어왔다.나의 수습 기간이 끝나기도 전에 파트장님과 팀원 1명 퇴사해버렸다.그렇게 우리 파트에는 나를 포함하여 3년차 팀원 1명, 총 2명이었다.총 연차로만 따지면 내가 제일 높아서 직급도 내가 위였다.최근 4년동안은 개발자라기 보단 직장인에 가까웠다.개발 공부보다 재테크 공부가 재밌기도 했고(크흠), 안정형을 추구했다.적당히 잘 나오는 매출, 문제없이 잘 돌아가고 있는 서비스게임서버 담당 나 혼자인데 최신 기술 사용해보다 뻑나면...? 버전 업 하다 뻑나면...? 나혼자 감당가능...?😭 기술적인 부분에 갈증을 느끼게 되면서, 어쩌면 화초처럼 자라고.. 2025. 4. 2. [Next.js] export const dynamic = 'force-dynamic' 현생이 바쁘고... 문서는 회사 위키에 남기다보니오랜만에 내 블로그에 남겨보는 이슈 흔적... 너무 소홀했다cms에 컨텐츠를 등록했는데, 새로고침을 해도 리스트에 바로 반영되지 않는 이슈가 발생하였다.백엔드에서 캐싱한 데이터를 내려줄거라 생각하고 문의드렸더니, 캐싱하지 않는다는 답변이 돌아옴 Next.js 14와 React Query를 사용하고 있어서, 분명 둘 중 한 곳의 캐싱 문제일거라 생각하였다.나는 React Query에 꽂혀서 이것저것 시도해보며 열심히 삽질하고 있었는데,저쪽 어깨너머 희미하게 들려오는 "서버 컴포넌트 캐싱 문제같아요. 해결했어요"export const dynamic = 'force-dynamic'올라온 MR을 확인해보니 요 한줄이 추가되었다. https://nex.. 2025. 2. 4. [Next.js] 사이드 프로젝트 초기 셋팅하기 next.js + recoil + typescript + SCSS(or stylex) 조합으로 사용할 예정. 1. Next.js 설치npx create-next-app@latestWhat is your project named? -> 프로젝트 이름Would you like to use TypeScript? -> 타입스크립트 사용할건지?Would you like to use ESLint? -> ESLint 쓸건지? 아마 airbnb로 쓸거같은데.. 일단 yesWould you like to use Tailwind CSS? -> scss module이나 stylex 사용해볼거같아서 noWould you like to use `src/` directory? -> src 디렉토리 사용할건지? 이건 개취일듯. 하.. 2024. 5. 27. Ubuntu에 nginx + php(php-fpm) + mysql 셋팅하기 https://blog.shako.net/installing-lemp-stack-on-ubuntu-server-16-04/ 이거대로 하면 그냥 바로된다~참고로 오늘기준으로 php-fpm이 7.2 버전으로 깔리기 때문에7.0으로 되어있는 것들을 7.2로 바꿔주고 셋팅해주면 된다. 2019. 2. 8. [Vue.js] ubuntu에 nginx 설치하고 vue.js 설치하기 Vue.js를 Ubuntu(18.04)에 배포하기 본격적인 설명에 앞서, 아주아주 퓨어한 Ubuntu 환경에서 nginx를 설치하고 vue 첫 페이지가 보여지도록 하는 것이 목표이다.환경은 ubuntu 18.04 / nginx 1.14.0 1. 서버 접속$ ssh root@111.111.11.11언제나 그렇듯 서버에 접속한다.root 계정으로 111.111.11.11 IP를 가지는 서버에 접속한다.비밀번호를 입력하고 서버에 딱 들어옴 2. nginx 설치$ sudo apt update$ sudo apt upgrade위와 같이 업데이트/업그레이드를 해준 후,$ sudo apt-get install nginxnginx를 설치한다. 그리고 nginx를 테스트하기 전에 방화벽 소프트웨어를 조정하여 서비스에 액.. 2019. 2. 1. 이전 1 2 3 4 ··· 10 다음