danmin20/danmin-gatsby-blog

현재 운영하고 있는 블로그입니다 ☺️

이정민 Danmin

👩‍💻 Frontend Developer BLOG | RESUME

우아한형제들 @Woowabros _{^{FE developer (2022.01 ~ now)}}

당근 @Daangn _{^{MVP 인턴십 FE intern (2021.09 ~ 2021.12)}}
우아한형제들 @Woowabros _{^{우아한테크캠프 4기 FE intern (2021.07 ~ 2021.08)}}
네이버 @Naver _{^{Glace CIC / 스마트플레이스 예약 FE intern (2021.03 ~ 2021.04)}}
메가존클라우드 @MegazoneCloud _{^{Commercial Tech Center / CloudOne FE intern (2020.11 ~ 2021.02)}}
트웬티온스 @TwentyOZ _{^{FE intern (2020.06 ~ 2020.10)}}

I would appreciate it if you could visit my guestbook and leave a message.

Quick Start

Just run the danmin CLI like this:

npx danmin

Options:
  -V, --version  output the version number
  -c, --career   display career
  -g, --github   open github
  -b, --blog     open blog
  -r, --resume   open resume
  -h, --help     display help for command

danmin-gatsby-blog's Issues

36-RAF/

개발자 단민 | 애니메이션을 그린다고요? setTimeout 싫어요! requestAnimationFrame 좋아요!

과 이 정확한 타이머 주기를 보장하지 않는다는 사실, 알고 계신가? 과 이 불필요한 리소스를 소비할 가능성이 있다는 사실, 알고 계신가? 과 이 브라우저 작업을 비동기적으로 예약한다는 사실, 알고 계신가?     requestAnimationFrame이란? 은 브라

https://www.jeong-min.com/36-RAF/

52-gatsby-blog/

개발자 단민 | 기술 블로그, 돌고 돌아 직접 만들다 (feat. Gatsby)

👋 소개 X로그, X스토리, X런치, X디엄.. 안 써본 블로그 플랫폼이 없을 정도로 유목민 생활을 해왔는데요, 결국 돌고 돌아 블로그를 직접 만들게 되었습니다! 이 템플릿의 베이스가 되어준 줌코딩 님의 블로그 템플릿도 많은 관심 부탁드리며, 흔쾌히 커스터마이징을 허락해주신 제 사우님, 줌코딩 님께 감사드립니

https://www.jeong-min.com/52-gatsby-blog/

53-sipe/

개발자 단민 | IT 커뮤니티를 직접 만드는 사람이 있다?! SIPE(사이프) 1기 회고글

그 시작은.. 디프만 출신 세 명이 모여 수다를 떨다가 나온 이야기. 😮 “디프만 또 하실 거예요?” 😮‍💨 “커뮤니티는 너무 좋은데, 사이드 프로젝트가 부담스럽긴 해요..” 🤔 “그쵸? 저도.. 사이드 프로젝트 안 하는 동아리는 없나?” �

https://www.jeong-min.com/53-sipe/

30-cors-fe/

개발자 단민 | CORS 에러를 프론트에서 해결? 무시? 아무튼? 해보자!

CORS 에러는 터지는데.. 아무힘이 없는 프론트 개발자가 과연 무얼 할 수 있을까?
  CORS란? CORS (Cross-Origin Resource Sharing)는 웹 어플리케이션에서 다른 도메인의 리소스에 접근할 때 발생하는 보안 이슈를 해결하기 위한 표준 방법이다. C

https://www.jeong-min.com/30-cors-fe/

37-event-loop/

개발자 단민 | 이딴 게.. 타이머? 자바스크립트의 런타임과 Event Loop

지난 글에서 에 대해 알아보았다. 어떤 독자는 해당 글을 읽으면서 한 궁금증이 떠올랐을지도 모른다. ‘왜 은 타이머 주기를 보장하지 않는 거지?’
이를 알기 위해서는 이벤트 루프에 대해 알아야 하는데, 우선 자바스크립트가 어떻게 동작하는지부터

https://www.jeong-min.com/37-event-loop/

34-url/

개발자 단민 | URL엔 왜 케밥 케이스를 쓰는가?

문득 개발을 하면서 라우팅을 하다가 궁금증이 떠올랐다. ‘왜 우리는 URL에 케밥 케이스를 사용하고 있지?’ 뇌 빼놓고 코딩하는 습관을 고치기 위해, URL 컨벤션에 대해 한 번 찾아보았다!
  URL에서 케밥 케이스를 사용하는 이유는 다음과 같다. 가독성과 사용

https://www.jeong-min.com/34-url/

54-2023-retrospect/

개발자 단민 | 도파민 중독자의 2023년

지난 회고에서 말했듯, 2022년은 인생 권태기 그 자체였다. 그랬던 만큼, 2023년은 재밌고 뿌듯하게 살아보는 것이 목표였다. 그렇게 실제로 도파민이 넘치다 못해 폭발하는 한 해를 완성할 수 있었다.   회사에선 말이죠.. 운영도구개발팀 1년동안

https://www.jeong-min.com/54-2023-retrospect/

3-naver/

개발자 단민 | 네이버 전환형 인턴 후기

2021.03.02 - 2021.04.09 동안의 경험에 관한 글입니다.
6주 동안 진행되었던 네이버 전환형 인턴입니다 :)   퇴사가 결정되고.. 3-2의 경우 메가존 클라우드 근무와 학업을 병행했는데, 겨울방학이 끝날 때쯤 더 이상 재학생은 인턴을 받지 않기로 결

https://www.jeong-min.com/3-naver/

guestbook/

개발자 단민 | Guestbook

개발자 단민

https://www.jeong-min.com/guestbook/

13-khu-tech-concert/

개발자 단민 | 경희대학교 테크 콘서트 강연에 서다

사실상 PPT 만든 게 아까워서 쓰는 글. 다시 발표자료를 봤을 때, 가치관이 달라진 부분도 있는 것 같다. 한낱 1년차의 시점으로 만들어진 것이기에 공감 안 가는 부분 있을 수 있음 주의   경희대학교 컴퓨터공학부에서는 최근 TechKHU Concert라

https://www.jeong-min.com/13-khu-tech-concert/

38-apps-script/

개발자 단민 | 구글 스프레드시트 메일 자동화: Apps Script

현재 IT 동아리를 운영 중에 있는 나. SIPE 많관부탁드립니다 😉😉 구글폼으로 서류 원서를 접수받고, 서류 결과 메일을 보내야하는 상황에 다다르는데..   이거, 한 사람 한 사람 메일을 다 따로 보내야 하는 건가?   하지만 개발자로서 그런 노가다를 하

https://www.jeong-min.com/38-apps-script/

48-dns/

개발자 단민 | 우리는 IP 주소를 아모른직다 : DNS

그냥 도메인 주소만 입력하면 뚝딱 되는 건 줄 알았지? 우리가 을 입력하고 화면이 뜰 때까지, 그 뒤에선 수많은 일들이 바삐 일어나게 된다. 우리에게 친숙한 호스트네임을 IP 주소로 변환해주는 DNS(Domain Name System)이 있기에 가능한 일이다. 즉, DNS는 인터넷의 중추로 볼 수 있다. DNS는 계층적인 이름 구조를 가지는데, , , 은 모두 도메인

https://www.jeong-min.com/48-dns/

50-closure/

개발자 단민 | 클로저와 더 가까워지기

closure와 closer해져보자 ㅋ.ㅋ   클로저를 알기 전에, 자바스크립트의 렉시컬 스코핑에 대해 먼저 알아보도록 하자!   스코프(Scope)란? 스코프란 참조 대상 식별자(변수와 함수같이 어떤 대상을 다른 대상과 구분하여 식별할 수 있는 유일한 이름)를 찾

https://www.jeong-min.com/50-closure/

23-vanilla-spa-1/

개발자 단민 | 바닐라JS(TS)로 리액트 SPA 구현하기 | (1) 기본 세팅

별도의 SPA 라이브러리 없이 Single page application을 만들어봅시다! 언어는 타입스크립트, 번들러는 웹팩을 사용하도록 하겠습니다. html과 css 웹팩 플러그인도 함께 설치하고, 바벨 트랜스파일러도 설치합시다. 저는 sass를 사용하기 위한 추가적인 설치를 함께 해주었습니다. devDependencies @babel/cli @babel/core @babel/preset-env @babel/preset-typescript babel-loader css-loader html-loader html-webpack-plugin mini-css-extra

https://www.jeong-min.com/23-vanilla-spa-1/

44-wanted/

개발자 단민 | 원티드에 개발 아티클을 기고하다

원티드 아티클 원티드를 한번쯤은 채용 사이트로 접해 본 경험이 있으리라 생각한다. 나도 취준 때 원티드를 정말 많이 사용하곤 했다. 원티드는 커리어 플랫폼으로 현재 여러 서비스를 제공하고 있는데, 직장인을 위한 다양한 아티클을 만드는 것도 그 중 하나다. 원티

https://www.jeong-min.com/44-wanted/

Uttrances 관련 버그 제보 드립니다.

Error: utterances is not installed on danmin20/danmin-gatsby-blog. If you own this repo, [install the app](https://github.com/apps/utterances). Read more about this change in [the PR](https://github.com/utterance/utterances/pull/25)

깃허브 플러그인 앱 설치를 안하셨거나, Uttrances의 설정 오류인 것 같습니다.

32-hosts/

개발자 단민 | hosts 파일을 수정해서 local domain을 변경해보자!

hosts 파일이란? hosts 파일은 운영체제가 호스트 이름을 IP 주소에 매핑할 때 사용하는 파일이다. 우리가 주소창에 url을 입력하면 DNS를 통해서 해당 도메인의 실제 IP 주소로 접속하게 되는데, 이 때 DNS를 통하지 않고 원하는 IP 주소로 접속하고자 할 때 hosts 파일을 수

https://www.jeong-min.com/32-hosts/

39-file-blob-url-arraybuffer/

개발자 단민 | 그들의 사각관계?! 이미지 업로드 미리보기를 구현하고 싶습니다 : 1탄

침착맨 라이트노벨 제목 월드컵 편을 보고 재밌어서 써본 제목입니다   파일을 다루는 일이 생길 때마다 구글링을 하게 되는 것 같다. 나만 그런 거 아니겠지? 여튼 그래서 들고와 본 주제!   Blob, File, 그리고 URL File, Blob, 그리고 URL은 웹 애플리케이션에서 파일과 데

https://www.jeong-min.com/39-file-blob-url-arraybuffer/

31-formdata/

개발자 단민 | file과 json data를 formData에 같이? 따로! 넣어보자

폼과 관련된 서버 통신 작업을 할 때, 보통은 이미지를 업로드하는 api와 폼데이터를 전송하는 api를 함께 사용해 서버로 데이터를 전송하곤 했다. 그러던 어느 날, 파일은 파일대로 json data는 json 대로 넣어서 하나의 api를 사용해 같이 전송해달라는 서버 개발자의 요청을 받게 되었는데…   FormD

https://www.jeong-min.com/31-formdata/

9-2022-retrospect/

개발자 단민 | 2022년 한 해 되돌아보기

1월. 우아한형제들 입사 뭐니뭐니 해도 올해 가장 큰 사건은 정직원으로 입사를 한 것. 원하던 회사에서 새해를 시작하는 건 무엇보다 짜릿한 일이었다.   2월. 졸업식 이전 회고글에도 올린 사진이지만 한번 더 올려야지 ㅋㅎ 휴학없이 비대면 수업 제대로

https://www.jeong-min.com/9-2022-retrospect/

8-2021-retrospect/

개발자 단민 | 드디어 컴퓨터공학 척척학사, 나의 4년은 어떠했나

입학 나는 경희대학교 컴퓨터공학과에 18학번으로 입학했었다. 사실 컴퓨터공학과에 생각이 있었던 건 아니다. 당시엔 개발 붐이 일어나기 전이었기에, 컴공이라는 과를 떠올리지도 못했다. 수시파 친구들의 경우 생기부와 자소서를 3년 내내 관리해야 하다

https://www.jeong-min.com/8-2021-retrospect/

59-reduce/

개발자 단민 | find 그만 쓰고 reduce 어때요? reduce로 map 만들기

배열에서 특정 값 찾을 때, find만 쓰진 않았나요? 자바스크립트 배열을 다룰 때, map, forEach, find, findIndex 등의 메서드는 정말정말 유용한 친구들이다. 하지만 매번 똑같은 배열에 대해 루프를 여러 번 돌아야 한다면..? 루프의 루프의 루프를 돌아야 한다면..? 우리들의 시간은 소

https://www.jeong-min.com/59-reduce/

33-modal/

개발자 단민 | React에서 모달 한번 잘 만들어보자 (feat. createPortal & ref)

삐까뻔쩍 나도 한번 잘살아보자🎵 웹사이트를 만들다 보면 피할 수 없는 그것… 바로 모달 창 만들기..! 드롭다운이 아닌 일반적인 모달의 경우 화면 전체를 채우게끔 구현을 해야 하는데, 이 때 사용할 수 있는 몇 가지 팁을 정리해보려 한다. 현재 내 블로그에 있는 컴포넌

https://www.jeong-min.com/33-modal/

35-css-module/

개발자 단민 | CSS Module : 인라인(inline)은 나빠요!

개인적으로 보통은 styled-components나 emotion을 사용한 CSS-in-JS 기법을 많이 쓰는데, 이번 글에서는 생략하도록 하겠다.   외부 CSS 프레임워크를 쓰는 우리 팀. 하지만 CSS 프레임워크 하나로 모든 게 뚝딱 완성될 리는 없었다. 어쨌거나 CSS 커스터마이징

https://www.jeong-min.com/35-css-module/