분류 전체보기(187)
-
프론트엔드 주니어의 오픈소스 기웃대기
들어가기 전에... 이 글은 경력 2년도 채 되지 않은 주니어 프론트엔드 개발자가 오픈소스를 기웃거린 경험을 다루고 있습니다. 오픈소스에 기여에 대한 의욕만을 가지고 후안무치(厚顔無恥)의 태도로 이런저런 시도를 해 본 후기입니다. 1. 왜 개발 공부를 시작하자마자 저는 '개발 커뮤니티의 아낌없는 나눔' 그 자체가 굉장히 매력적이라고 생각했습니다. 가치 있는 기술과 노하우에 대해 끊임없는 교류를 하고, 이를 통해 더 나은 무언가를 만들어 내기 위한 공동체의 합의가 암묵적으로 존재한다니... 더군다나 그런 문화가 특정 지역에 국한되지 않고 전 지구적으로(아마도) 존재한다는 사실이 너무나 신기하고 멋져 보였습니다. 그리고 자연스럽게 저도 그 생태계에 작은 사잇돌이나마 괼 수 있으면 좋겠다는 생각이 들었습니다...
2022.04.28 -
[React] 반응형UI에 대처하는 테스트의 자세
반응형 컴포넌트 React를 사용해서 반응형 웹을 만들어 본 사람이라면, 반응형 레이아웃에 대응하기 위해 아래와 같은 컴포넌트(혹은 비슷한 역할을 하는 컴포넌트)를 만들어 본 경험이 있을 거라 생각한다. 예시 1 레이아웃에 따라 렌더링 할 컴포넌트를 분기하는 Switch 컴포넌트 예시 2 children의 노출 여부를 명시하는 Display 컴포넌트 두 컴포넌트의 공통점은 무엇일까? 바로 반응형 레이아웃에 대한 처리를 JSX내부에서 바로 확인할 수 있게끔 컴포넌트화 했다는 점이다. 별도의 스타일 코드로 이동해 확인할 필요가 없고, 직관적으로 어떤 컴포넌트들이 반응형에 따른 분기 처리가 되는지 알 수 있으니 장점이 많다 하겠다. 테스트 코드와 함께 사용 시 발생하는 문제점 하지만 이 컴포넌트는 아쉽게도 테..
2022.03.29 -
내가 우리 팀을 좋아하는 이유
어느덧 이직을 한 지 3개월이 되어간다. 길다면 길고 짧다면 짧은 시간이었지만, 새로운 환경에 적응하기엔 충분한 시간이었다고 생각한다. 나는 지난 3개월간 굉장히 만족스럽게 일했을 뿐만 아니라 이전보다 일에서 느끼는 행복이 더욱 많아졌다. 돌이켜보면 내 행복을 위해 과감하게 이직하기를 잘 했다는 생각이 든다. 새로운 직장에서 만족스러운 부분은 여러 가지가 있지만 가장 만족스러운 부분은 역시나 수준 높은 동료들이라고 생각한다. 기본적으로 동료들의 지식적인 부분의 역량도 뛰어나지만, 건전한 피드백을 바탕으로 서로의 장점을 흡수하고 단점을 개선하려고 노력하는 부분이 정말 좋다. 훌륭한 동료들과 함께 하는 만큼 좋은 개발 문화도 만족스럽다. 1. 이슈가 생겼을 때 모르는 부분을 모호하게 넘어가지 않고 끝까지 파..
2022.03.09 -
멍청함과 마주하는 용기(?)
오늘 블로그 방문자 수가 소리 소문 없이 2만 명을 넘었다. 사실 방문자 수가 오르는데에는 영양가 없는 내용들이 한몫을 단단히 했는데, 그것과는 별개로 내가 블로그를 작성한 지 어느덧 1년 8개월이 되었다는 사실을 깨닫고 좀 놀랐다. 이 블로그는 애증의 블로그이다. 블로그에 들어오는 매 달마다 이전에 작성한 글에서 내 멍청함을 발견한다. 그 때마다 지우고 싶은 욕망과 내버려 두고 싶은 귀찮음이 내 안에서 전쟁을 벌인다. 무식하면 용감하다고 했던가. 이전 글들을 다시 읽으면 나의 용맹함(무식)을 가감 없이 느낄 수 있다. 한 편으로는 보잘것 없는 이 블로그를 통해 나를 좋게 봐주셨던 분들도 생기고(?) 덕분에 좋은 기회가 생겨 좋은 동료들과 함께 하루하루가 행복하게 일하고 있다. 한 달 혹은 일주일 단위로..
2022.02.18 -
graphql-codegen-typescript-mock-data
회사에서 Typescript + GraphQl을 사용하고 있다 보니 테스트에 필요한 mocking data를 만드는 게 어렵지 않다.(타입 추론) 그런데 프로젝트에 테스트가 300개가 넘어가니까 매번 테스트마다 mocking을 해주는게 정말 일이었다;; 이전 회사에서 rest API 작업을 할 때 했던 방법대로 intermock을 통해 mocking을 해보려고 했는데 여의치 않았다. intermock 자체가 지원하는 타입이 제한적이고 미완성이라는 느낌이 많이 나서 사용하지 못하고 있었다 ㅠㅠ [TS] Type과 Interface로 테스트용 Mock Data 만들기 Mock Data의 필요성 프론트엔드 개발을 하는 입장에서는 백엔드 API가 이미 다 준비되어 있고, 인터페이스도 공유가 된 상태에서 작업을 ..
2022.02.18 -
Canvas API
사내 세미나에서 진행한 Canvas api 글인데 블로그에도 올려둡니다~ Canvas api란? Canvas API는 javascript와 Html canvas 엘리먼트를 통해 그래픽을 그릴 수 있는 수단을 제공하는 api로, html5의 구성요소입니다. 애니메이션과 게임 그래픽, 데이터 시각화, 사진 조작 및 비디오 등의 다양한 분야에서 사용되고 있습니다. 주로 2D 그래픽을 다루는 데 사용되고 있으며, 비슷하게 그래픽을 다루는 API 중에선 3D를 주로 다루는 WebGL이 있습니다. WebGL이란? WebGL(Web Graphics Library)은 플러그인을 사용하지 않고 웹 브라우저에서 상호작용 가능한 3D와 2D 그래픽을 표현하기 위한 JavaScript API입니다. WebGL은 HTML5 c..
2022.02.06