전체 글43 TypeScript Assertion - 특정 타입을 확신할 수 있는 경우 타입스크립트를 사용하다보면 아래와 같은 상황을 자주 겪는다.const foo = useQueryParams("foo") // {title: string} | undefined return ( {foo.title} // Error: undefined일 수 있음 ) 그리고 다음 방법 중 하나를 사용하곤 한다. const foo = useQueryParams("foo") // {title: string} | undefined /* 1. Early Return 사용 */ if (!foo) { return null } /* 2. Optional Chaining 사용 */ return ( {foo?.title} ) 하지만 사용하는 페이지에서 무조건 foo가 있다는 것을 확신할 수 있다면 (없으면 페이지 진입 자체가.. 2024. 6. 18. TypeScript - is keyword type narrowing을 위한 아래와 같은 코드는 타입스크립트가 그 의도를 이해하지 못한다.const isString = (value: any) : boolean => { return typeof value === "string" } const test = (str: any) => { if (isString(str)) { // 'str'이 'string' 타입임을 알지 못함 str.toupperCase() // 런타임 에러 발생 } } 이때 함수가 boolean 값을 return 하는 경우, 리턴 타입에 is 키워드를 사용하여 해당 scope내에서 지정한 타입으로 내로잉 할 수 있다.const isString = (value: any) : value is strin.. 2024. 5. 29. 리액트 라이브러리 npm에 배포하기 with rollup 여러 repository에서 동일하게 사용하는 component와 custom hook이 늘어나면서 관리에 많은 공수가 들었다. 코드 하나를 수정하면 다른 프로젝트에도 똑같이 반영하고, 새 프로젝트를 시작할 때마다 똑같은 코드를 옮겨야 했다. 이러한 비효율적인 작업을 개선하기 위해 여러 프로젝트에 걸쳐 사용하는 컴포넌트와 커스텀 훅을 라이브러리로 만들어 npm에 배포하여 사용하기로 했다.프로젝트 세팅패키지 매니저로는 개발자 경험에 이점이 있는 pnpm을 사용했다. pnpm init 먼저 package json에서 npm 배포에 중요한 부분만 설정했다. package.json의 각 항목은 다음과 같은 역할을 한다. name npm에 배포될 라이브러리의 이름 version 라이브러리의 버전 Semantic .. 2024. 1. 31. TypeScript 공식 라이브러리 tslib란 무엇인가 유명 오픈 소스들을 살펴보다 문득 tslib라는 라이브러리에 대한 궁금증이 생겼다. 하지만 구글링을 아무리 해봐도 이에 대한 정보를 찾기 쉽지 않았다. 그래도 스택오버플로우와 함께 머리를 쥐어 싸면서 어느 정도 깨달음을 얻을 수 있었다. 다른 사람들은 나와 같은 시행착오를 겪지 않았으면 하는 마음에 이에 대한 깨달음을 공유해보고자 한다. 등장 배경 TypeScript는 사용자가 작성한 코드를 JavaScript로 변환하면서 몇 가지 도우미 함수(helper functions)를 삽입할 수 있다. 예를 들어, 클래스 상속, 제너레이터, async/await, spread 연산자 등을 자바스크립트 ES5 버전으로 변환할 때 도우미 함수가 필요하다. 이때 도우미 함수들은 각 모듈에 복사되어 자바스크립트 번들의.. 2024. 1. 10. 당근 면접 후기 지원계기 지인으로부터 당근의 채용 소식을 알게 됐다. 취업난을 겪고 있는 나에게 너무나 좋은 기회라는 생각이 들어 이력서를 보완하고 서류를 제출했다. 서류 전형 결과는 금방 나왔다. 다른 회사의 면접에서 탈락했다는 소식을 먼저 접하고, 당근에 대한 기대감이 한 껏 낮아진 상태로 메일을 확인했다. 고작 서류 전형에서 합격했을 뿐이지만, 앞선 탈락은 생각도 나지 않을 정도로 매우 기뻤다. 공모전이 끝난 이후로 온 번아웃으로 이렇다 할 아웃풋을 못 내고 있었는데, 다시 한번 삶의 활력을 복돋을 수 있는 기회가 될 것 같았다. 면접까지는 약 2주의 시간이 걸렸고, 그동안 오직 면접 준비에 매진하기로 했다. 모의면접 처음으로 나름 큰돈을 들여서 모의면접을 받았다. 모의면접은 인프런을 통해 네카라쿠배 면접관 경험이.. 2023. 12. 23. 학술제 발표 후기 교내 학술제에서 발표를 하게 됐다.처음에는 좋은 기회라 생각하여 감사함을 느낌과 동시에 이걸 내가 해도 될까 하는 생각이 들었다 프론트엔드 분야에 대해서 발표를 할 수 있다면 그 누구보다 잘할 자신이 있었지만, 우리 과에는 프론트엔드에 관심 있는 사람이 별로 없다.(추측건대, 이쪽 분야는 비전공자가 더 많은 것 같다) 따라서 사람들이 프론트엔드를 모르더라도, 얻어갈 게 있는 발표를 하고자 했다. 처음에는 진로를 아직 정하지 못한 사람들을 위해 프론트엔드라는 분야에 대해서 소개하고, 취업 시장에서 프론트엔드 개발자의 경쟁력에 대해서 발표를 하고자 했다. 하지만 현직자가 아닌 나의 얘기가 그렇게 설득력 있게 들릴 것 같지 않았다. 그렇다면 어떤 주제로 발표를 해야 할지 고민하던 중 최근 캡스톤 디자인을 수강.. 2023. 11. 30. 이전 1 2 3 4 ··· 8 다음
