뭘 배웠지?

JavaScript로 간단한 3D 게임을 만들며 배운 점 'JavaScript로 3D 게임을 만들어보자'는? js13KGames에 참가하며 기록합니다 js13KGames는 JavaScript로 13kb 이하의 게임을 만드는 대회입니다. Theme 발표를 기준으로 한 달 뒤에 종료됩니다. 3번째 참가고, 이번에는 간단한 3D 게임을 만들 예정입니다. 갓 취업한 웹 프론트엔드 개발자로 주로 주말에만 작업합니다 현재 상황은 테마 발표까지 2주가 남았고, 어떤 게임을 만들지 기획하고 있습니다. 주말 프로젝트이고 한 달 안에 만들어야 하기에, 찾아본 게임 기획중에서 꼭 필요한 사항이라는 것들을 정리해보고 있습니다. 간단한 게임 기획 테마 발표 전 -> '프로토타입' 기간, 테마 발표 후 -> '프로덕션' 기간으로..

일지 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년 ... 적응을 해나가면서 일하기 편리한 공간으로 바꿔나가자 성장을 위한 일을 찾아서 하고, 잘 정..

Git Clone과 Fork을 하며 배운 내용 Clone과 Fork 뭐가 다를까? 기본적으로 둘 다 복사하는 목적으로 사용한다. 다른 점은 Fork는 내 GitHub 계정으로 다른 레포를 가져올 때 사용하고, Clone는 내 레포 혹은 타인 레포를 내 로컬에 복사할 때 사용한다(Git이 도와준다) 기본적으로 Cloning 전에 Forking을 하지만, 꼭 지켜지지 않는다고 한다. Fork Fork된 레포, 즉 내 계정에 복사된 레포는 Pull Request를 통해서 머지될 수 있다. PR(Pull request)란? 레포 주인한테 이렇게 요청하는 것 "내가 수정했는데, 이 수정된 부분을 너 레포로 머지 좀 해줄래?" 사실 PR이 존재하는 이유도 굉장히 지당하다. 안 그러면 타인의 레포를 마음껏 바꿀 수 ..

일지 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/프론트엔드-신입-개..

프론트엔드 개발자로 합격 후, 10일정도 시간이 있어 돌아보기 이 포스트의 목적은? 지금까지 개발 여정을 살펴보려고 합니다. 그리고 웹 프론트엔드를 희망하는 분에게 참고할만한 내용이 있을까 싶어서입니다. 내용은 100% 주관적입니다. 원하는 내용만 받아주세요! 백그라운드 ⚽️ 중/고/대학교 때 축구에 미쳐서 항상 축구만 했습니다 🚫 대학교 자퇴했습니다 🚀 개인 사업 두 번 운영했습니다. ✈️ 일본 9개월, 호주 워킹홀리데이 2년 살았습니다. 디테일하게는 여러 이야기가 펼쳐지지만 굵직한 키워드는 이렇습니다. 30살까지 다양한 경험을 하기로 결심했고, 그렇게 살았습니다. 프론트엔드 개발자가 되기까지 사실 호주 워킹홀리데이 할 때 Codecademy라는 온라인 코딩사이트를 연간 결제했습니다. 사업할 때 개발을..

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