Dropdown 컴포넌트보통 버튼의 오른쪽에 화살표를 표시하고, 버튼을 클릭하면 (주로) 하단에 나타나는 어떤 항목들의 목록을 보통 드롭다운이라고 부른다.Jul 16, 2022Jul 16, 2022
Next.JS hydration 스타일 이슈 피해가기Next.JS를 사용해 웹을 만들어가다보면, 어느 순간 Hydration 이슈를 마주치게 된다. 이번엔 그 상황이 언제, 왜 생겨나는지를 파악해보고, 이걸 피해가를 방법을 알아보자.Jan 24, 2021Jan 24, 2021
WebP 이미지 사용하기구글에서 개발한 WebP는 이미지를 손실 압축하는 대신 용량을 획기적으로 줄여주는 이미지 포맷입니다. JPEG 포맷보다 압축률이 30% 정도 높다고 하지만, 제가 생각하는 최대의 장점은 PNG를 사용해야만 했던, 투명도가 있는 이미지도 압축할 수…Jun 20, 2020Jun 20, 2020
React와 Typescript의 미묘한 불일치리액트는 타입스크립트로 짜인 코드가 아니다. 이것은 타입스크립트와 리액트를 동시에 사용하려고 할 때, 특히 타입스크립트를 제대로 써 보고자 할 때 걸림돌로 작용한다.Apr 2, 20182Apr 2, 20182
GraphQL을 오해하다이번엔 GraphQL을 처음 접한 순간부터, 토이 프로젝트(서버)를 만드는 동안 내가 겪었던 착오와 오해, 햇갈렸던 개념들을 복습해보고자 한다. GraphQL이 대체 뭔가 하는 질문에 대해서는 다른 글을 보길 바란다. GraphQL을 전혀 모르는…Jun 4, 20174Jun 4, 20174
Do we need Redux? (Part 2)Part 1에서는 Flux에서 Redux로 갈 때의 장점이 무엇인지, 어떤 방식으로 동작하기에 그런 장점을 얻는지에 대해 알아보았다. 이번 글은 Flux의 구조를 유지하면서도 큰 변화 없이 Redux의 장점-주로 테스트 가능성-을 얻어오기 위한…Apr 28, 2017Apr 28, 2017
PostCSS 소개JS로 Transcompile되는 CoffeeScript나 TypeScript같이, CSS를 편하게 작성하기 위한 새로운 문법 역시 지속적으로 제시되어왔다. Sass가 있었고, less, stylus도 있다. 그중 가장 최근에 등장한 PostCSS를…Apr 8, 2017Apr 8, 2017
Do we need Redux? (Part 1)회사에서는 React v0.13 때부터 시작해 이전 프로젝트들을 flux(-utils)를 사용해 프로젝트를 진행해왔다. 그런데 모두들 리덕스를 쓴다. 묘하게 대세에 뒤쳐지는 느낌이 든다. Redux로 코드 베이스를 뒤엎어볼까?Apr 7, 2017Apr 7, 2017
팝업과 메시지 with React브라우저의 기본 다이얼로그는 마음에 들지 않을 때가 많다. 물론 지속적인 변화를 통해 디자인도 점점 진화하고 있고, 과거와 비교하면 매우 깔끔해지기도 했다. 하지만 브라우저마다 다른 모습을 하고 있고, 커스터마이징이 어렵다보니 디자이너들은 모든…Mar 25, 2017Mar 25, 2017
React 프로젝트의 디렉토리 구조2023년판 새 글을 확인해주세요 :) https://yanggoon.dev/showcase/project-structureFeb 23, 20173Feb 23, 20173
Conditional Rendering for React리액트에서는 조건부 렌더링을 사용하기 위한 방법으로 아래와 같은 방식을 제시하고 있다.Dec 24, 2016Dec 24, 2016
