뭘 배웠지?

일지 2022년 8월 1주차 앤트 디자인 Select 커스터마이징 현재 프로젝트에 앤트 디자인(Ant Design)이 적용되어 있어 수정/추가를 하려면 사용법을 알아야한다. 이런 저런 디자인이 대응되어 있는 리액트 컴포넌트 라이브러리지만, 요구사항이 그 한계를 넘는 것들이 있다. 예를 들면 Antd의 Select 컴포넌트 border-radius를 바꾸는 것 이 예시와 함께 조금의 설명을 섞어서 포스트 작성했다! https://forgottenknowledge.tistory.com/entry/Ant-Design-Select-컴포넌트-커스터마이징-feat-emotion Ant Design :: Select 컴포넌트 커스터마이징 feat. emotion 앤트 디자인(Ant Design) 사용하며 배운 점 A..

일지 2022년 7월 5주차 이번주는? 3D 게임 만들기 테스트 코드 3D 게임을 만들자 이번에도 JS13kb에 참가한다. 주말 프로젝트가 될 것이고, 3D 게임을 도전한다. 이번 대회에서 해보고 싶은 것들은 이렇다 작년까지 목표는 결과물을 만드는 것이었다면, 이번에는 티셔츠를 받는 것이 목표 - 3D 스무스 렌더링 - webpack 초기 설정 - 저용량 3D 게임 엔진 사용 중요한 것은 부드러운 움직임! 테스트 코드 현재 맡는 프로젝트가 TDD 방식으로 만들어졌다고 한다 거의 모든 컴포넌트, 페이지, 파일에 테스트 코드가 작성되어 있고, 테스트 커버리지도 70으로 되어있다(이 밑으로 내려가면 빌드 안된다) 요구사항에 맞춰서, 기능 기능 추가/변경을 하는데 시간을 쓰고, 그에 따라 바뀌는 테스트 코드를 ..

일지 2022년 7월 4주차 입사한지 4주차 모르는 것도 많고, 혼자 할 수 있는게 많지 않아서 퇴근하면서도 찝찝한 느낌이 있다. 마치 축구하러 가서 땀도 안흘리고 온 듯한 느낌 매일 조금씩 기업에 대해, 팀원 그리고 같이 일하는 방법을 알다보니, 이제는 담당 프로젝트도 생겼고, 서브 프로젝트도 생겼다 여기서도 알아야할 것들이 많고, 물어볼 것도 많지만, 코드를 작성하고 주체적으로 생각할 것이 생겼고, 백엔드, 디자인, PM 등 다른 팀원과 콜라보 할 수 있다는 것에 기쁘다. 박제 시키는 as const 타입스크립트 코드를 보다가 'as const'라는 것을 봤다 const라고 하니까 추측한 것은 값을 변하지 못하게 하는 건가? 했는데 그런 개념이었다 객체의 프로퍼티나 배열의 요소를 박제시키는 거다 만약..

일지 2022년 7월 3주차 이번주 키워드 1. AWS 2. Dependencies 최신화 3. JS13K - 회의 및 webpack 작성 - 세미나 주제 결정 .toBe와 .toEqual 다른 점 .toEqual은 값만 비교 .toBe는 원시 값 혹은 객체 인스턴스의 referential identity(참조 신분?)을 비교한다 즉 deep copy가 된 배열, 객체는 toEqual에서는 같지만, toBe에서는 다르다 파일 무효화 CDN 최신화를 위해 AWS 사용 CI는 자동화가 되어있고, CD는 수동으로 하는 프로젝트가 있고, CD가 될 때 CDN에 최신 리소스로 자동으로 교체되게 하고 싶다 CloundFront에서 CDN의 캐시를 최신화 시켜주는 작업을 Invalidation(무효화)라고 부르는 듯..

일지 2022년 7월 2주차 이번주 목표 조금 더 정돈된 한 주를 갖자!! 첫 프로젝트 분해 및 파악 npm 버전 기존 프로젝트를 fork -> clone하고 npm install로 dependecies를 받으려고 했다 하지만 시작부터 안됐다 npm install 대신 --legacy-peer-deps를 사용해서 실행까지 되지만 여전히 error가 나오는 상황 dependencies 란? 프로젝트에 필요한 모든 패키지를 버전 넘버와 함께 가지고 있다. 어떤 라이브러리를 설치하면 dependencies object 속에 들어가 있는 것 devDependencies 란? 위의 보통 depencies란 같은 개념으로 설치된 라이브러리 등의 버전과 적어두고 있지만, 개발시에만 필요한 라이브러리 등을 여기에 넣어..

일지 2022년 7월 1주차 이번주 키워드 첫 출근, 맥북 적응, 첫 프로젝트 Day 01 출근 첫 날은 전 직원들에게 화상으로 소개를 했고, 채용팀과 몇 시간 회사에 대해 설명을 듣고 이야기를 나눴다. 개발팀과 이야기도 나누고 업무가 주어지기 전에 읽어봐야 할 것들이 많이 생겼다. 이메일, 출입키, 일정 보는 법, 소통 하는 법 등 다양한 정보를 전달받았다. 아무래도 한 번에 소화시키기는 무리가 있어 보이고, 하면서 차차 적응해야지. 퇴근 시간에 가까워 질 때 마침내 IDE(VSCode)를 받았고, 확장을 설치했다. 코드 작성은 하지 않았고, 다른 사람의 코드를 잠깐 봤다. 일주일, 한 달, 6개월, 1년 ... 적응을 해나가면서 일하기 편리한 공간으로 바꿔나가자 성장을 위한 일을 찾아서 하고, 잘 정..

일지 2022년 6월 4주차 이번 주 스케쥴 주중에 여행을 갔다 올 계획이라 이번주 할 일은 오직 한 가지! 기본 프로젝트 'Google Search Pro' -> TypeScript로 변환 기존 리액트 JS 프로젝트 TS로 변환 기존 리액트 프로젝트에 TypeScript를 추가하고 npm install --save typescript @types/node @types/react @types/react-dom @types/jest tsconfig가 자동으로 생기지 않아서 따로 설치해주고 npx tsc --init js/jsx 를 ts/tsx를 바꾸고 에러가 시키는대로 하나씩 처리해가니 완성! 바꾸면서 id를 number로 할지, string으로 할지 정했어야 했는데, 여기서 기본 타입들을 보고 strin..

일지 2022년 6월 3주차 이번 주 스케쥴 1. 기존 프로젝트 => 타입스크립트 변환 🔺 2. 개발자가 되기까지 여정 정리 ✅ 취직 🥳 혼자 개발을 하다가 이제는 한 기업의 프론트엔드 개발자가 되었습니다. 채용 절차를 진행하며 팀원들을 만나며 좋은 인상을 받아서, 2주뒤에 시작될 동행이 기대가 됩니다 무엇보다 개발자로써 성장할 수 있는 곳이라고 생각되네요. 개발을 시작하고 조금 정신없이 살아온 것 같은데, 약 2주 정도 출근 전까지는 조금 쉬엄쉬엄 가려고 합니다. 아무것도 안하는 것은 심심하니, 개발과 관련해서 뭐를 해왔는지 돌아보고, 기업에서 제 몫을 하기 위한 스택 점검도 해보려고 합니다. 정리 완료 https://forgottenknowledge.tistory.com/entry/프론트엔드-신입-개..

일지 2022년 6월 2주차 이번주 할 일 저번주에 써 놓은 것 외에도 이것저것 한 5가지 동시에 진행되었다. 그러다 보니 써놓은 것 조금 놓쳤다. 이번주는 좀 더 현실적으로 1. 알고리즘 마무리 정리 2. 데이터베이스 마무리 정리 3. 리액트 + 타입스크립트 프로젝트 진행 아쉽지만 이번주도 web3는 쉬어가기 소중한 피드백 혼자 프로젝트를 진행하면 피드백을 받을 곳이 없다. 그래서 이렇게 피드백을 받으면 굉장히 소중하다. 저번주에 Vanila JavaScript로 리액트 마냥 SPA를 만든 것에 대한 피드백이다. 소중한 피드백 리스트 매직넘버 html lang 설정 div가 아닌 의미에 맞는 태그 사용 필요없는 변수 정리 Throttle 대신 IntersectionObserver 사용 DOM 그리기 선..

일지 2022년 6월 1주차 이번주 할 일 저번주에 이어서 학습하는 주간이다. 이번주 키워드는 React, TypeScript, Solidity 등 1. 자바스크립트 및 프론트엔드 지식 강화 ✅ 2. 리액트 + 타입스크립트 프로젝트(타입스크립트와 조금 친해지기) ✅ 3. Web3 2주차 Kudo 확인 & 3주차 엿보기 이번주도 한 주만큼 성장하자! 강의 정리 이번주는 3개월간 들은 강의를 마무리하며 배운 내용을 정리해봤다. 프로그래밍에 도움이 될 것 같아 선택한 이산수학의 중점을 정리했고, 세계와 음식이 좋아 선택한 세계의 음식, 음식의 세계도 정리했다. 자바스크립트로 리액트처럼 7일간 쌩자바스크립트(바닐라)를 마치 리액트처럼 작동하도록 구성했다. 리액트처럼 구성했다는 말은 리액트 라이브러리 설치없이, ..