목차 1. 필기 합격하는 방법 2. 요약 서론 2024년 첫 번째 시험에서 떨어진 뒤, 1년 만에 다시 본 정보처리기사 필기시험을 통해 필기 공부를 ‘어떻게 공부했어야 하는지’를 제대로 깨달았다. 필기 합격하는 방법 결론부터 말하자면, 기출문제집 하나 사서 그것만 달달 풀면 된다. 첫 시험인 2024년에는 방법을 몰라서 한 권에 5...
챕터 4 더 큰 그림
JS를 지탱하는 세 개의 주요 기둥과 Appendix 목차 [첫 번째 기둥: 스코프와 클로저] [두 번째 기둥: 프로토타입] [세 번째 기둥: 타입과 타입 강제 변환] [JS의 본질 따르기] [Appendix A] 서론 챕터 4에서는 JS를 지탱하는 세 개의 주요 기둥과 2부에서는 어떤 내용을 다룰지, 책 전개는 어떻게 되는지 로드맵이...
Promise, async-await, axios
promise, async-await, axios 개념 요약 및 axios를 사용한 비동기 구문의 다양한 예시 + 업데이트 2024년 4월 3일 목차 1. Promise 2. async-await 3. Axios 4. axios를 사용한 비동기 구문 리팩토링 예시 서론 프론트엔드 로드맵을 보다가 자바스크립트에 대해서 최소 실행 컨...
뭘하긴 한 2023년
회고 목차 1. 회고를 하는 이유 2. 업무 리마인드 3. 그 외 이벤트 리마인드 4. 부족한 점 5. 잘한 점 6. 2024목표 작성 7. 목표를 위한 액션 1. 회고를 하는 이유 한 해를 어떻게 보냈는지 리마인드 부족한 점을 파악(개발, 운영, 관리 등의 측면에서) 잘한 점 파악(개발, 운영, 관리 등의 측면에서) 2...
2의 보수
2의 보수 보수: 어떤 수에 더해서 N이 되기 위해 필요한 수 예를 들면, 10진수에서 3에 대한 N의 보수라 하면, 어떤 수와 3을 더해서 N이 되는 수를 말한다. 즉 N의 보수는 N-3이 된다. N이 10일 경우에 3에 대한 10의 보수는 7이 된다. 2진수에서 2의 보수는 더해서 2 즉, 2진수로 1,0이 되어야 한다. 맨 왼쪽의 비트...
Github Fork가 풀렸을 때
팀 프로젝트를 위해 fork해서 가져온 레포지토리의 fork가 어느순간 풀려 있었다. 원래는 아래의 이미지 처럼 내 레포지토리 명 하단에 fork의 원본을 표시해줘야 하는데 fork from 이 없어졌다. fork가 풀린건, 풀리퀘스트를 할 때 알게 되었다. 풀리퀘스트를 할 때, fork 한 원본 레포지토리에 요청을 하는데 해당 레포지토...
Chromatic 과연 믿을만한가?
Chromatic이란 무엇인가? 간단히 말해서 Storybook에서 만든 것으로, Storybook을 배포해주고 UI test 등을 하게 해주는 cloud-based 체인이다. 문제 제기 깃을 연동해야 하는 만큼 회사 코드 노출에 대한 위험은 없을까? Storybook 글로벌 커뮤니티가 있다. (Storybook 공식문서에서 찾을 ...
Storybook에서 제공하는 튜토리얼 정리
컴포넌트 스토리북은 기본적으로 두개의 레벨을 가진다. 컴포넌트와 그것의 story들 이다. Component Story Story Story … 스토리북에 컴포넌트에 대해 말하기 위해 컴포넌트를 문서화해야 한다. default export를 작성할 것이다. compon...
Storybook 도입하기
도입 개요 기존에는 ui 컴포넌트 정의서를 노션에 정리를 했다. 하지만 불편한 점이 존재했다. 작성자와 UI 컴포넌트를 사용하는 개발자의 편리성이 떨어진다는 것이다. 작성자 측면에서는 코드를 수정할 때마다 문서를 수정해야 하는 점이 있다. 개발자 측면에서는 UI 컴포넌트의 모습을 볼 때 한계가 있다. 개발자에게 UI 컴포넌트를 보여주기 위해서는...
Vue2 npm ERR! code 1 해결방법
노트북을 변경해서 node와 npm 을 새로 설치했다. 그리고 로컬 개발 환경을 키기 위해 npm run serve 를 입력했는데 에러가 났다. npm ERR! code 1 npm ERR! path \Users\...\node-sass npm ERR! command failed 구글에 검색한 키워드는 ‘npm ERR! code 1’...
Pinia 공식문서 보고 적용하기
What is Pinia? 참고: 공식문서 https://pinia.vuejs.org/introduction.html#introduction Introduction Pinia는 2019년 11월경에 Composition API를 사용하여 Vue의 Store가 어떻게 디자인 될 수 있는 지를 재설계하는 실험으로 시작되었습니다. 이후 초기 원...
토스 | 프론트엔드 웹 서비스에서 우아하게 비동기 처리하기
비동기 = 순서가 보장되지 않은 상황 대표적인 비동기 상황 서버에 요청을 하면 응답이 올 때 까지 기다리고 다른 유저 인터랙션에 반응할 수 없는 것이 아닌, 서버에서 응답이 올 때 까지 다른 작업을 하면서 응답이 오면 다시 이어서 할 일을 하는 것이다. 따라서 끊기지 않는 60프레임*의 좋은 사용자 경험을 위해서는 비동기 프로그래밍은...
토스 | 실무에서 바로 쓰는 Frontend Clean Code
클린 코드는 짧은 코드가 아니다. 원하는 로직을 빠르게 찾을 수 있는 코드이다. 실무에서의 클린 코드의 의의 = 유지 보수 시간의 단축 우리는 보통 코드를 새로 짜는 것보다 수정하거나 추가하는 일을 많이 한다. 하지만 코드를 계속 추가하다 보면 지뢰 코드가 되기 십상이다. 지뢰 코드는 흐름 파악이 ❌, 도메인 맥락 표현이 ❌, 동료...
Jekyill Chripy 테마에서 avatar 변경 안되는 이유
이 글을 본다면 avatar 적용에 애를 먹지 않고 다른 것에 더 많은 시간 투자를 할 수 있을 것이다. 깃 테마를 적용한 후 블로그를 꾸며 보기 시작했다. 다른 블로그에서 설명한대로 avatar를 바꾸기 위해 원하는 이미지 파일을 root/assets/img 경로에 붙여 넣었다. 하지만 avatar를 확인해 보면 자꾸 검...