전체 글

특정 상황에서 뒤로가기를 했을 때 페이지가 리렌더링 + 리페인팅이 되면 사용자 경험(UX)가 떨어지는 경우가 발생한다. 예를 들어 포스트 목록을 스크롤 다운하다가 하나를 클릭했지만 원하는 포스트가 아니라 뒤로가기를 눌렀을 때 리렌더링되며 맨 위로 다시 올라가게 된다면 사용자 경험이 떨어질 수 밖에 없다. https://github.com/nuxt/nuxt/issues/6451 Prevent re-render / re-paint of a page when you press the browser back button · Issue #6451 · nuxt/nuxt What problem does this feature solve? I am trying to prevent the page from re-rend..

처음으로 개발과 관련 없는 내 얘기를 해보고자 한다. 나는 내가 정말 운이 좋다고 생각한다. 무슨 소리인가 싶겠지만 지금 생각해 보면 그 시기에만 할 수 있는 경험은 다 할 수 있었던 것 같고, 정말 간절히 원했던 건 다 이루어졌고 나태해질 때쯤이면 항상 무언가가 나를 자극했었다. 환경 우선 내 성격과 부모님의 스타일이 잘 맞았던 것도 나에게 천운이었다고 생각한다. 나는 내가 주도하는 쪽이 편하지 관리당하는 걸 좋아하지 않는다. 이런 성격 탓에 스스로 무언가 느끼기 전까지는 누군가의 말만으로 행동으로 옮기지 않는다. 우리 부모님이 나를 크게 터치했던 적이 지금 생각해 보면 거의 없다. 지금 돌이켜 보면 이게 나를 지금까지 성장하게 해 줬던 것 같다. 나는 항상 공부를 내가 필요해서 했었다. 이런 성격이 ..

스스로 감시를 하지 않으면 금방 나태해지는 성격이다.. 그렇기 때문에 부끄럽지만 월말에는 자신에 대한 회고를 하려고 한다. 퇴사 준비와 함께 학교 사람들과 프로젝트를 시작했다. 그렇기 때문에 퇴사 준비와 새 프로젝트에 대한 얘기를 해보려고 한다. 퇴사 준비 이제 복학을 해야 하기 때문에 좋은 사람들을 뒤로하고 퇴사 준비를 시작했다. 내 머릿속에 있던 것들을 최대한 문서화했고 내가 하고 있던 티켓들을 전부 처리하기 시작했다. 마지막으로 했던 업무는 기존 프로젝트에 i18n(다국화)을 적용하는 업무였다. 크게 어렵지는 않긴 했지만 프론트엔드에 있는 텍스트들을 전부 변경해야 했기 때문에 작업량이 꽤 많았다. 그리고 nuxt 프로젝트에 i18n을 도입하는 레퍼런스는 많지 않았기 때문에 공식문서를 계속 꼼꼼하게 ..

렉시컬 환경을 설명하며 호이스팅에 간단하게 언급했었다. (https://bysxx.tistory.com/3) 렉시컬 환경을 간단하게 요약하자면 자바스크립트를 실행하며 코드 실행에 필요한 정보가 함수 단위로 쌓이는 객체를 실행 컨텍스트라고 하고 여기에는 렉시컬 환경이 있는데 여기에는 함수 내부의 정보를 가진 environmentRecord, 함수 외부의 정보를 가진 outer-EnvironmentReference가 있다. 여기서 environmentRecord

작년 11월 Nuxt 3 stable 버전이 출시되었다 (Reference) Announcing 3.0 · Nuxt We are thrilled to announce the first stable version of Nuxt 3.0.0 ✨ Nuxt 3 is a modern rewrite of the Nuxt framework based on Vite, Vue3, and Nitro with first-class Typescript support and the result of more than two years of research, community feedback nuxt.com 한글로 된 관련 문서가 없는 것 같아 요것 먼저 작성해볼까 한다 우선 가장 큰 변화점은 Vue3를 지원해 준다는 점이다. 사..

만약 누군가에게 자바스크립트에 대해 한 가지만 알려줄 수 있다면 실행 컨텍스트에 대해 알려줄 것 같다. 그만큼 실행 컨텍스트는 가장 중요한 자바스크립트의 핵심 원리이자 여러 가지 특이한 특징들을 가지는 이유가 된다. 먼저 실행 컨텍스트를 한 줄로 요약해 보자면 자바스크립트가 실행됐을 때 스택형태로 쌓이는 하나의 객체이다. 이것만 들어서는 이해하기 힘들 것 같으니 사진과 함께 설명하자면 function foo() { function bar() { console.log('bar') } bar() } foo() 위 코드를 실행했을 때 아래 사진처럼 진행되게 된다 1. 먼저 전역 실행컨텍스트가 쌓이게 되고 2. 그 이후 foo가 실행되며 스택에 쌓임 3. foo안에 있는 bar가 실행되고 스택에 쌓임 4. ba..

회고가 필요하다고 생각이 들어 이를 올릴 매개체인 기술블로그를 시작하기로 마음을 먹었다.. 이런 글이 처음이라... 어색하긴 하지만..... 앞으로 공부하는 내용을 기록 및 공유할 생각이다. 흠.. 개인 회고는 올릴지 말지 고민 중이다. 게임 클라이언트 개발에서 프론트엔드 개발로 전향한 후 처음으로 맞는 해이며, 개발자로서 2년 차를 맞는 해였다. 개발자라는 직업에 대한 확신을 가졌던 시간이 됐던 것 같다. 프론트엔드 기술은 물론이고 개발문화에 대한 고민을 계속했던 것 같다. 애자일을 경험해보고 싶었지만 회사에서는 사용하기가 힘들었고 사이드 프로젝트에서는 한다고 해봤지만 잘되진 않은 것 같다. 2022 시작 연초에는 게임 회사에서 백오피스 프론트엔드 개발을 했었다. 지금도 엄청 잘하는 건 아니지만 올해 ..