분류 전체보기 (60) 썸네일형 리스트형 You Don't Know JS 책 공부 시작 -! You Don't Know JS 공부를 시작하게 된 이유 프론트엔드 개발자로 3년 넘게 일했지만, 어느 순간부터 관성적으로 코드를 작성하는 내 모습을 발견했다. 자바스크립트의 기본 원리나 동작 방식에 대한 깊은 이해 없이, 익숙한 방식대로 타이핑하고 있는 내 모습에서 부족함을 느꼈다.이 책을 공부하는 이유는 단순하다.코드의 작동 방식을 깊이 이해하고 싶다.내가 작성하는 코드의 의도를 명확히 알고 싶다.기본기에 충실한 개발자가 되고 싶다.결국, 왜 이 코드를 이렇게 작성했는지, 어떤 원리로 동작하는지, 이를 명확히 설명할 수 있는 개발자가 되기 위해 You Don't Know JS를 공부하기로 결심했다. 책을 읽고 몇 가지 기억하고 싶은 것들을 정리해보려고 한다. Chapter 1 자바스크립트 명세서T.. [코딩테스트] 택배 상자 꺼내기 출처 : https://school.programmers.co.kr/learn/courses/30/lessons/389478 프로그래머스SW개발자를 위한 평가, 교육, 채용까지 Total Solution을 제공하는 개발자 성장을 위한 베이스캠프programmers.co.kr 문제 1 ~ n의 번호가 있는 택배 상자가 창고에 있습니다. 당신은 택배 상자들을 다음과 같이 정리했습니다.왼쪽에서 오른쪽으로 가면서 1번 상자부터 번호 순서대로 택배 상자를 한 개씩 놓습니다. 가로로 택배 상자를 w개 놓았다면 이번에는 오른쪽에서 왼쪽으로 가면서 그 위층에 택배 상자를 한 개씩 놓습니다. 그 층에 상자를 w개 놓아 가장 왼쪽으로 돌아왔다면 또다시 왼쪽에서 오른쪽으로 가면서 그 위층에 상자를 놓습니다. 이러한 방식으.. 좋은 코드의 기준이란? feat. 토스 Frontend Fundamentals 이 글은 https://frontend-fundamentals.com/code/ 를 학습하고 정리한 글입니다. 변경하기 쉬운 코드Guidelines for easily modifiable frontend codefrontend-fundamentals.com 변경하기 쉬운 코드 좋은 프론트 엔드 코드는 변경하기 쉬운 코드. 코드가 변경하기 위운지에 대한 4가지 기준은 아래와 같다. 가독성(Readability) 코드가 읽기 쉬운 정도 예측 가능성(Predictability) 함께 협업하는 동료들이 함수나 컴포넌트의 동작을 얼마나 예측할 수 있는지 응집도(Cohesion)수정되어야 할 코드가 항상 같이 수정되는지. 응집도가 높은 코드는 코드의 한 부분을 수정해도 의도치 않게 다른 부분에서 오류가 발생.. 중요한 순간에 피하지 않고 솔직하게 대화하기 feat 결정적 순간의 대화를 읽고 무엇이 대화를 결정적으로 만드는가? 결정적 순간의 대화의 예로는 다음과 같은 것들이 있다. 관계를 끝내자고 말하기, 모욕적인 발언을 한 동료에게 따지기, 상사의 행동을 피드백하기, 성관계에 대한 불만 이야기하기, 약속을 지키지 않는 팀원에게 이야기하기, 정보나 자원을 공유하지 않는 동료와 이야기하기, 성과를 비판적으로 평가하기, 시부모나 처부모에게 간섭하지 말아달라고 이야기하기결정적 순간의 대화란 두 사람 이상이 의견의 차이가 있고 중요한 이해관계가 걸린 문제를 다루고 있으며 감정이 격해질 때 일어나는 대화이다. Q1 ) 나에게 있어서 '결정적 순간'이란 어떤 순간일까? 나에게 떠오르는 결정적 순간의 대화는 무엇이 있었나? 그리고 무엇이 그 대화를 결정적인 순간의 대화를 만들었나? 내게 있어서 결정적.. 2024 회고 2024는 이미 끝났지만 그래도 아직 1월 첫째주니까.. ^-^ 내 일기장에 이미 2024년 회고 글을 마치긴 했지만 개발블로그에도 한번 남겨볼까한다. 사실 쓰지 말까했다. 개발 블로그에는 개발적으로 내가 이뤄낸 뭔가 대단한 게 있어야만 써야할 것 같은 느낌이 들어서... 그래도 무언가를 꼭 이뤄내야만 회고글을 쓸 수 있는 것은 아니기에 솔직하게 써보려고 한다! # 회사에서 올해 초 시작했던 디지털 교과서 사업 올해 초에 회사에서 디지털 교과서 개발 사업을 시작하면서 동시에 새로운 프로젝트를 위한 조직 개편도 이루어졌다. 이 시기는 나에게 일적으로 가장 힘들었던 시기 중 하나였다. 이전에 경험해보지 못한 성격의 프로젝트였기에 이해하는 데 시간이 꽤 걸렸고, 개발 작업보다는 회의와 플래닝에 많은 시.. PDF.js를 활용해 PDF 임베드하기: pdfjs-dist 사용법 PDF.js를 활용해 PDF 임베드하기: pdfjs-dist 사용법배경회사 프로젝트에서 PDF 자료를 웹 페이지에 직접 임베드해야 하는 작업을 맡았다. 이 과정에서 다양한 PDF 뷰어 라이브러리를 조사한 뒤, 요구사항을 충족할 수 있는 POC를 진행하며 pdfjs-dist를 선택하게 되었다. 이 글에서는 다음 내용을 다루고자 한다. pdfjs-dist를 선택한 이유pdfjs-dist 사용 방법사용 중 발생한 문제와 해결 과정 (트러블슈팅)왜 pdfjs-dist인가?PDF 뷰어 라이브러리에는 대표적으로 pdfjs-dist, react-pdf, react-reader 등이 있다. 이 중에서 pdfjs-dist를 선택한 이유는 아래와 같다.꾸준한 업데이트: 최근까지 유지보수가 활발히 이루어지고 있다. (마지.. [React 까보기 시리즈] React concurrent mode 맛보기? performConcurrentWorkOnRoot 까보기 https://www.youtube.com/watch?v=W5_jtoRPgR0 performConcurrentWorkOnRoot - 비동기 작업 : performConcurrentWorkOnRoot - 동기 작업 : performSyncWorkOnRoot 함수 까보기 callbackNode Task를 소비하는 과정 -> null을 할당할 때까지 진행 root.callbackNode(scheduleCallback의 return 값 즉 Task // Work를 Task로 만드는 함수이므로 결국엔.)은 - commit phase 지나면 null로 초기화 - null이 아니다? -> Work를 진행하다 중지됨 - workLoopConcurrent에서 while문 중지됨 -> performUnit.. [React 까보기 시리즈] 리액트가 WORK를 스케줄링하는 과정을 까보자 https://www.youtube.com/watch?v=xLiHuAYgs_M reconciliation(재조정) 직전까지 과정 정리 과정(한 줄 요약) 리액트는 UPDATE 정보를 담은 WORK를 Task로 관리하다가 perform해서 reconciliation한다. reconciler -> scheduler -> reconciler 상세 과정(callback의 여행) callback : WORK를 perform하는 함수(performWorkOnRoot) 1. reconciler는 dispatchAction으로 UPDATE를 담은 WORK를 만든다 2. WORK를 스케줄링한다 (Task로 만들 준비를 하여 scheduler에게 전달) a. scheduleWork: fiber에.. 이전 1 2 3 4 5 ··· 8 다음