woo jeongmin

우아한형제들 SOT팀의 권현준님에게 오프라인 보안 특강을 들을 기회가 있었다. 백엔드에서의 보안 뿐만 아니라 클라이언트에서의 보안도 많이 다뤄 유익한 시간이었다. JWT의 Statelessness 가장 인상적이었던 부분은 Statelessness…

프로젝트를 시작하며 react-query를 직접 구현해보기로 했습니다. react-query…

협업을 위한 git 활용팁입니다. git blame 범인색출용이라는 불명예를 가지고 있는 명령어이지만 작성일, 작성자, 커밋 메시지 확인을 위해 없어서는 안되는 명령어입니다. 저는 주로 vim-fugitive를 통해 각 줄에 1대…

axios는 interceptor에 로직을 추가하여 api 요청, 응답을 전/후처리할 수 있습니다. 팀 프로젝트에서는 fetch를 이용하고 있어 그동안 매 api 요청, 응답에 대하여 직접 로직을 작성해 불편함이 있어 fetch로 interceptor…

…

팀의 타입스크립트 컨벤션을 공유합니다. type alias만을 사용한다. type alias는 최신 타입스크립트 버전에서 interface하는 거의 모든 일을 수행할 수 있다. 실제로 이를 반영해 타입스크립트 공식 문서의 type alias…

스코프란 무엇일까요? MDN…

cypress-ci는 Cypress 테스트 자동화 라이브러리로, CI Provider에서 서버 실행과 테스트 실행을 자동화하기 위한 여러가지 기능을 지원하고 있습니다. 개발 배경 체크메이트 팀에서는 Jenkins와 Cypress로 빌드 전 E2E…

아래의 코드는 우아한테크코스 지원 플랫폼의 타입스크립트 전환 작업을 진행하면서 마주쳤던 이슈입니다. axios interceptors가 성공 응답을 처리할 때 body가 없는 경우 리턴 타입을 다음 둘 중에서 고민하고 있었습니다. 나 나 awaited…

What happens when…을 바탕으로 네트워크와 OS, 브라우저에서 일어나는 일을 정리했습니다. URL을 파싱합니다. protocol: hostname: resource…

useEffect? useLayoutEffect? 공식문서를 읽어보자. useEffect - Effect Hook을 사용하면 함수 컴포넌트에서 side effect를 수행할 수 있습니다. useLayoutEffect…

useForm formik, react-hook-form state normalization ref CDD with Storybook CSS in JS with Styled Components

등교 오프라인 교육이 시작되었다. 잠실 캠퍼스 공간이 너무 좋아서 등교가 즐겁다. 코로나…

9주간의 우아한테크코스 레벨1이 끝이 났다. 운좋게도 멋진 사람들을 만나 많이 배웠고 즐겁게 하루하루를 보냈다. 얻은 것이 많은 만큼 아쉬운 것도 많다. 9주간의 느낀 점을 몇가지 키워드로 정리했다. 비대면 코로나 확진자가 다시 증가하면서 레벨…

0.3km 우테코 생활 D+4…

…

…

에디터를 vim에서 neovim으로 옮겼다. 그동안 vim을 사용하면서 coc.nvim에서 LSP가 동작하지 않았는데 neovim으로 옮기면서 터미널에서도 LSP와 IntelliSense를 사용할 수 있게 되었다. 파일 익스플로러도 vim…

…

그동안 수없이 들었던 “UI와 도메인을 분리시켜주세요”라는 피드백.. 분리에 분리를 반복하면서 어느 순간 공통되는 부분들이 보이기 시작했다. 이런 부분들을 모으면 다른 미션에서도 사용할 수 있을 거라는 생각이 들었다. 도메인 의존성 파악하기 MVC…

코드 리뷰에서 innerHTML의 보안 취약점에 대해 피드백을 받고 찾아본 내용이다. XSS란? XSS(Cross-site scripting…

🗣 앞으로 SSAFY를 지원할 예비 지원자분들을 위해 이 글을 작성합니다. SSAFY의 선발 과정과 제가 어떻게 준비했는지 공유합니다. 선발 대상 만 29세 이하 국내외…

구조 Model–view–controller (MVC) is a software design pattern commonly used for developing user interfaces that divide the related program…

코드스피츠 85 거침없는 자바스크립트 1강 자바스크립트 개괄 ES6에서 일어난 일 Class, Object Literal이 새롭게 정의됨 Arrow 함수: 기존 함수가 클래스로 대체하는 기능까지 갖고 있어서 무거웠던 것에 비해 Arrow…

gatsby-plugin-disqus 플러그인 추가 먼저 Disqus 가입을 합니다. Website Name으로 들어갈 shortname을 기억해주세요. gatsby-plugin-disqus를 설치합니다. 에 다음과 같이 설정합니다. Disqus…

gatsby-plugin-google-fonts 설치 보통 웹폰트를 사용하기 위해서는 html의 head에 웹폰트 링크를 넣어 사용합니다. 하지만 Gatsby.js는 빌드할 때마다 index.html을 재컴파일하므로 index.html…

기대 행동 로 user 상태를 받아 를 가리키는 링크를 생성한다. 실제 행동 를 읽을 때 undefined 에러가 발생했다. 코드 원인 비슷한 상황의 스택오버플로우 질문글에 대한 답변이 있었다. React useSelector first returns…

discord.js…

기대 행동 id와 패스워드를 입력하여 사이트 로그인 실제 행동 다음 에러가 발생했다. 원인 서버로부터 오랜시간 동안 응답을 받지 못해 발생하는 에러. 즉 서버에 문제가 있을 가능성이 크다. 해결 서버 측 코드의 변수명의 오타를 발견하여 수정했다.

같은 주제에 대한 글을 모아 볼 수 있도록 태그를 추가해봅시다. 포스트에 태그 추가하기 마크다운 문서에서는 메타데이터를 YAML 헤더에 작성할 수 있습니다. title과 date 다음에 tags…

그동안 티스토리를 블로그로 써오다가 웹 개발 공부 겸 본인 사이트를 만들어 보는 것이 많은 도움이 된다는 조언을 듣고 직접 블로그를 만들게 되었습니다. Gatsby…

기대 행동 gatsby-cli 설치 실제 행동 설치 시 다음 에러가 발생했다. 원인 이것은 M1맥과 같이 애플 실리콘 기반 디바이스에서 발생하는 문제로 node.js 15.3.0에서 해결되었다. 해결 업데이트 후 다시 npx gatsby-cli new…

애플 실리콘 맥에서 native Homebrew와 rosetta 2를 이용한 intel Homebrew를 설치하는 방법을 정리한 글입니다. soffes.blog/homebrew-on-apple-silicon를 참고하였습니다. apple silicon…

인생을 편하게 만들어주는 vscode 단축키 모음 Mac 조합키 일람 command(또는 cmd) shift option(또는 alt) control(또는 ctrl) caps lock 자주 쓰는 바로가기 키 VS Code…

John Ahn님의 기초 노드 리액트 강의를 들으며 따라 구현한 MERN 스택 Boilerplate이다. Node.js…