Toss Makers Conference 25 Engineering day 참석 후기 (https://toss.im/tmc-25/) TOSS MAKERS CONFERENCE 25참가 신청 7월 3일–7월 13일 / 본 행사 7월 23일–25일 COEXtoss.im 2013년, 고등학교를 졸업하고 갓 스무살이 된 해에 웹 퍼블리셔로 첫 커리어를 시작하였다.배움에 대한 열정과 기업에 대한 궁금증(그 당시 Daum을 짝사랑하고 있었다.)으로 생애 첫 오프라인 컨퍼런스에 참석했었다. 그리고 약 12년 후...다사다난(?)한 세월을 겪은 후, 오랜만에 참석하는 생애 두번째 오프라인 컨퍼런스인 토스 메이커스 컨퍼런스 25 Engineering Day에 다녀왔다. 이 행사에 유독 참여하고 싶은 마음이 컸는데, 크..

팀빌딩이 어느 정도 완성되고 팀이 안정화가 되면서 제일 좋은 점이 있다.코드에 대한 생산적인 얘기를 많이 나눌 수 있는 동료들이 생겼다는 것... 그러면서 나도 점점 코드를 보는 눈이 생기게 되었고, 뭣도 모르고 짠 냄새나는 나의 코드들이 눈에 띄기 시작했다.그 중 하나가 관심사 분리가 되지 않은 채 복잡하게 얽혀있는 컴포넌트였다. 예시를 하나 들어보자.발단// 완전 초기function Button({ variant = 'solid', children, color, size, type = 'button', ...props}: Props) { return ( {children} );} 위와 같이 기존에 Button 이라..

이슈 복기를 위한 정리... 현재 서비스 중인 사이트는 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..

태초마을로 오기 전까지의 우리 팀 프로젝트 구조는아마 AI도 이해를 포기할법한 아키텍쳐였을 것이다.2023년 11월, 약 4년만에 재입성하는 프론트엔드 바닥 최근 4년동안은 개발자라기 보단 직장인에 가까웠다.개발 공부보다 재테크 공부가 재밌기도 했고(크흠), 안정형을 추구했다.적당히 잘 나오는 매출, 문제없이 잘 돌아가고 있는 서비스... 그러다 '나는 무엇을 할 줄 아는가?'에 대한 고민이 빠진다.점점 기술적인 부분에 갈증을 느끼게 되면서, 어쩌면 화초처럼 자라고 있을지도 모른다는 생각이 들었다.그래서 나와 쿵짝이 잘 맞는 동료들, 딱히 불만없던 회사를 뒤로하고 지금 팀(파트)에 합류하였다. 하지만 나의 수습 기간이 끝나기도 전에 파트장님과 (사수가 될 뻔한)파트원 1명이 퇴사해버렸다.그렇게 우리 파..

현생이 바쁘고... 문서는 회사 위키에 남기다보니오랜만에 내 블로그에 남겨보는 이슈 흔적... 너무 소홀했다cms에 컨텐츠를 등록했는데, 새로고침을 해도 리스트에 바로 반영되지 않는 이슈가 발생하였다.백엔드에서 캐싱한 데이터를 내려줄거라 생각하고 문의드렸더니, 캐싱하지 않는다는 답변이 돌아옴    Next.js 14와 React Query를 사용하고 있어서, 분명 둘 중 한 곳의 캐싱 문제일거라 생각하였다.나는 React Query에 꽂혀서 이것저것 시도해보며 열심히 삽질하고 있었는데,저쪽 어깨너머 희미하게 들려오는 "서버 컴포넌트 캐싱 문제같아요. 해결했어요"export const dynamic = 'force-dynamic'올라온 MR을 확인해보니 요 한줄이 추가되었다.    https://nex..

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 디렉토리 사용할건지? 이건 개취일듯. 하..

https://blog.shako.net/installing-lemp-stack-on-ubuntu-server-16-04/ 이거대로 하면 그냥 바로된다~참고로 오늘기준으로 php-fpm이 7.2 버전으로 깔리기 때문에7.0으로 되어있는 것들을 7.2로 바꿔주고 셋팅해주면 된다.