예제 레포지토리프로젝트에서 WYSIWYG을 사용해야 하는 경우가 있는데 대부분의 경우 form의 형태로 사용할것같다. 내게도 그런 상황이 생겼는데 처음으로 경험해보는 일이었기 때문에 기록으로 남겨둔다. (기본적인 텍스트 데이터만 다룬다!)해결하고 싶은 문제는 react

나는 tailwind를 사용할때 react-testing-library를 위해 css파일을 먼저 빌드하는 하는 방법을 사용하고있다.해당 방법에 대한 stackoverflow그리고 아래와 같은 UI를 만들기 위해 css의 ::before기능을 사용하기로 했다. tailw

테오의 스프린트에서 만들었던 토이 프로젝트 '삿치'에 카카오로그인을 붙여 로그인 가능한 서비스로 만들려고 했다. 로그인을 구현하는 김에 JWT의 refresh token을 활용해보면 어떨까? 하는 마음에 검색을 시작했고 silent refresh라고 불리는 방법을 사

테오의 스프린트는 시니어 개발자인 테오가 진행하는 5일동안 구글 스프린트를 경험할 수 있는 행사(?)입니다. 두 회사에서 다른 형태의 스프린트를 경험 해보고 '스프린트'라는 단어를 쓴다고 해서 모두 같은 방식으로 일 하는것은 아니구나를 깨닫고 또 다른 스프린트를 경험하

비단 turborepo만의 문제는 아니고 monorepo를 사용하면서 vscode를 사용하는 경우에 일어 날 수 있는 문제라고 생각합니다.

타입스크립트를 단련해봅시당!

(이 시리즈를 쓰게 된 계기는 사실 이걸 말하고 싶어서 열심히 빌드업 한것이다.)(근데 생각보다 글쓰니까 공부가 더 잘되는 느낌이네)여기까지 공부 한 후 공부한 내용을 자랑확인 하고 싶어 동료에게 물어봤다.나: "나: "아직 최적화 까지는 공부 못했고 defer, as

중요 렌더링 경로 Critical Rendering Path 주요 렌더링 경로란 DOM 파싱 부터 렌더까지의 경로를 말한다. > 주

Render Blocking 요소에 대해서 알아 볼겁니다.Render Blocking이란 Render를 멈추게 하는 것이고 Render가 멈추면 초기 화면이 늦게 뜨기 때문에 사용자에게 더 좋은 경험을 주려면 Render Blocking 요소를 최소화 하는 것이 좋습니

나는 왜 이걸 이제 공부 했을까? 라는 생각이 들정도로 중요 했다. 검색해보면 브라우저 랜더링에 대한 글이 많다. 그러다 Google Developers: Web을 발견했고 그 내용과 의문 그리고 해결을 정리 해 보려고 한다. 랜더링 과정 HTML을 파싱해서 DO

오늘도 회사에서 얻은것을 정리해본다. 회사 입사하고 가장 놀랐던것은 lint와 prettier가 없다는것! 그것은 react의 기초적인 문법과 공통적인 코딩규칙이 없다는것! 그 다음으로 놀란것은 typescript가 없다는것! 이 두개가 나를 엄청 괴롭혔다..

개발은 논리의 흐름을 적는것이기 때문에 그에 맞는 변수명과 함수명을 사용하는것이 대단히 중요하다고 생각한다.그 중 오늘 느낀 아주 작은 것은서버에 비동기통신을 보내 데이터를 받아오는 함수와로컬에서 데이터를 가져오는 함수는 구분되어야 한다. 라는 아주 당연한 것이다.전