전체 글45 프론트엔드 다이빙 클럽 회고 놀러오세요! 프론트엔드 다이빙 클럽프론트엔드에 관한 깊은 이야기를 나눌 수 있는 오프라인 커뮤니티, 프론트엔드 다이빙 클럽을 소개합니다.toss.tech LinkedIn Viva Republica (Toss) 페이지: [Frontend Diving Club] 프다클 여섯번째 모임 참가 신청 오픈 다양한[Frontend Diving Club] 프다클 여섯번째 모임 참가 신청 오픈 다양한 회사의 프론트엔드 개발자들이 모여 노하우를 나누는 프론트엔드 커뮤니티, ‘프론트엔드 다이빙 클럽’ 25년 첫 모임에 신청하kr.linkedin.com토스에서 주최하는 프론트엔드 다이빙 클럽에 선정되었다.이전에는 자격이 되지 않아 지원조차 하지 않았었는데, 나도 많이 성장했구나하는 생각이 들었다. 프다클에 참석하기위해 시간차.. 2025. 2. 8. 스타트업 서류 전형에서 좋은 인상을 전달하는 방법 최근 회사에서 채용을 진행하며 이력서를 검토할 기회가 있었다.누군가를 평가할 자격이 있다고 생각하지는 않지만 채용이 회사에 중요하다는 것을 알기에 서류를 열심히 검토했다. 이력서를 볼수록 패턴이 보이기 시작했고, 그 패턴들을 이용하여 점점 빠른 속도로 이력서를 확인해나갔다. 물론 이 패턴에 벗어나는 이력서가 있을 수 있지만 한정된 시간안에 많은 이력서를 보기 위해서는 방법을 찾을 수 밖에 없었다. (마감 후 확인해보니 한 명뽑는 자리에 270분이 지원해주셨다.)이 과정에서 내가 느낀 패턴과 일반적으로 알려진 방법론을 종합하여, 서류 전형에서 좋은 인상을 줄 수 있는 포인트를 정리해봤다.다만 채용에는 정답이 없으며 기업이나 담당자에 따라 관점이 다 다를 수 있다.나의 주관적인 생각 또한 많이 담았기 때문에.. 2024. 11. 10. TypeScript Assertion - 특정 타입을 확신할 수 있는 경우 타입스크립트를 사용하다보면 아래와 같은 상황을 자주 볼 수 있다. const foo = useQueryParams("foo") // {title: string} | undefinedreturn ( {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. 이전 1 2 3 4 ··· 8 다음