bono-podo-kakaoent / gatsby-blog Goto Github PK

View Code? Open in Web Editor NEW

2.0 2.0 4.0 29.18 MB

github page by gatsby

License: MIT License

JavaScript 70.56% Shell 1.40% SCSS 28.04%

gatsby-blog's People

Contributors

Stargazers

Watchers

Forkers

ifubabz rheehot riverpark94 sculove

gatsby-blog's Issues

2018/04/15/why-nextjs/

[nextjs] nextjs는 어떻게 동작하는가? | bono blog

nextjs 로 프로젝트를 진행한지도 반년 가까이 흘렀습니다. nextjs는 서버사이드렌더링(SSR)과 code splitting 등을 지원하는 reactjs 전용 프레임워크입니다. 2 년도 채 안되는 시간에 벌써 5.x(곧 버전 6 도 나올것 같네…

https://blueshw.github.io/2018/04/15/why-nextjs/

2015/06/29/remind-of-knou/

난 2년동안 다녔던 방송통신대학에 대한 회고 | bono blog

저는 비전공자입니다. 그래서인지 소프트웨어 개발일을 하면서 늘 비전공자 딱지를 달고 일을 해왔던거 같습니다. 사실 학위라는게 그 사람의 실력을 말해주는 것도 아니라 큰 의미가 없다는게 평소의 제 생각이기도 합니다만, 막상 일을 하다보면 내가

https://blueshw.github.io/2015/06/29/remind-of-knou/

2020/09/27/css-in-js-vs-css-modules/

CSS-in-JS(Styled Components) vs CSS-inCSS(CSS Modules) 성능 비교 | bono blog

지난번 포스팅(CSS-in-JS에서 CSS-in-CSS로 바꿔야 하는 이유)에는 CSS-in-JS에서 CSS-in-CSS 방식으로 변경해야 하는 이유에 대해 설명했다. 요약해보면, 다음과 같다. 성능에 초점을 맞춘다면 , 개발 생산성에 초점을 맞춘…

https://blueshw.github.io/2020/09/27/css-in-js-vs-css-modules/

2020/06/14/seo/

[Frontend 바로 알기] 검색엔진 최적화 (SEO: Search Engine Optimization)를 위한 9가지 방법 | bono blog

는 검색 결과 순위를 높이는 작업을 의미한다. 사용자가 구글에서 검색어를 입력하면, 검색엔진은 인덱싱해둔 수많은 웹 페이지 중 가장 적합한 순서대로 결과를 노출한다. 결과를 노출하는 순위를 결정하는 알고리즘은 공개되어 있지 않다. 하지만, 다

https://blueshw.github.io/a

2020/03/30/weight-of-diploma/

대학 졸업장은 의외로 가볍다 | bono blog

어떻게든 좋은 대학에 입학하자 지금은 어떤지 잘 모르지만, 내가 학교에 다닐 때는 중학교만 들어가도 대학입학을 준비했다. 준비라 할게 딱히 특별한 건 아니다. 이외에 딱히 잘하는게 없다면 좀 더 좋은 대학에 입학하기 위해 공부에 매진한다. 수학

https://blueshw.github.io/2020/03/30/weight-of-diploma/

2020/03/09/the-reason-for-reading/

책을 읽는 솔직하고 현실적인 이유 | bono blog

의외로(?) 사람들이 잘 안 믿지만, 나는 책을 좋아한다. 일 년에 100권씩 읽는 열렬한 독서가는 아니지만 일 년에 대충 30~40권쯤 읽는다. 일이 바쁘거나 다른 것에 빠져있을 때가 아니라면 항상 읽는 책이 두어 권 있다. 종류나 장르도 가리지 …

https://blueshw.github.io/2020/03/09/the-reason-for-reading/

2020/01/27/svg-path-onscroll/

[interactive web] 스크롤에 따라 svg path 변화시키기 (1부터 9까지 숫자 변형하기) | bono blog

스크롤하면 숫자 1부터 9까지 모양이 점진적으로 변하도록 만들어보았다. 각 숫자의 형태를 만들기 위해 웹에서 사용가능한 벡터 이미지인 SVG를 이용해 구현했다. SVG가 뭐지? 라는 분들이 있다면 W3Scools의 SVG Tutorial을 읽어보자.…

https://blueshw.github.io/2020/01/27/svg-path-onscroll/

2019/10/13/show-items-on-scroll/

[interactive web] 스크롤(scroll) 이벤트로 목록을 더 아름답게 만들어보자 | bono blog

애플의 웹 사이트는 멋지다. 사이트에 특별한 기능이 있는건 아니다. 대부분 제품 소개 페이지다. 제품 소개페이지를 얼마나 잘 만들었길래, 뭐가 멋지다는걸까? 의문이 들 법하다. 그런데, 하나하나 살펴보면, 정말 세심하게 공들인 느낌이다. 단순한 웹

https://blueshw.github.io/2019/10/13/show-items-on-scroll/

2018/03/12/this/

[javascript] this는 어렵지 않습니다. | bono blog

this 는 어렵지 않습니다. this 를 어렴풋이 알고는 있지만, 누가 물어봤을때 제대로 대답해 줄수 있도록 정리해보겠습니다. 많은 개발자들이 javascript 의 this 를 혼란스러워합니다. 사실 개념 자체가 어렵진 않습니다. 다만, 다른 프…

https://blueshw.github.io/2018/03/12/this/

2020/09/14/why-css-in-css/

CSS-in-JS에서 CSS-in-CSS로 바꿔야 하는 이유 | bono blog

는 쉽지 않다. 처음 배울 때는 ‘이 정도쯤이야?’라는 생각이 들 정도로 쉬워 보인다. 실제로 러닝커브가 그리 높지는 않다. 그래서 과거에는 주로 신입이나 경력이 짧은 사람에게 맡기는 경우가 많았다. 당시에는 프론트엔드 영역이 명확히 나뉘어 있지

https://blueshw.github.io/2020/09/14/why-css-in-css/

2018/02/27/async-await/

[javascript] async, await를 사용하여 비동기 javascript를 동기식으로 만들자 | bono blog

async, await 는 ES8(ECMAScript2017)의 공식 스펙(링크)으로 비교적 최근에 정의된 문법입니다. 를 사용하면 비동기 코드를 작성할 때 비교적 쉽고 명확하게 코드를 작성할 수 있습니다. 자바스크립트는 싱글 스레드 프로그래밍언어기…

https://blueshw.github.io/2018/02/27/async-await/

2020/05/09/know-html-semantic-elements/

[HTML 바로 알기] Semantic Web을 위한 Semantic Elements | bono blog

은 웹에서 를 담당한다. 웹페이지의 뼈대를 만들고 레이아웃을 구성한다. 웹사이트마다 구성은 다르지만, 대체로 헤더(Header), 내비게이션(nav), 콘텐츠(main), 그리고 푸터(footer)의 조합으로 만들어진다. 각 영역은 기능에 따라 구분…

https://blueshw.github.io/2020/05/09/know-html-semantic-elements/

2020/05/05/know-front-end-right-away/

Frontend 바로 알기 | bono blog

의 영역이 점점 커지고 있다. 과거의 프론트엔드는 HTML과 CSS와 약간의 Javascript(이하 JS)를 다루는 영역이었다. 흔히 웹 퍼블리셔의 역할인 UI개발이 주된 업무였다. 하지만, 웹의 기능이 복잡해지고 동적 요구사항이 늘어나면서 과거 …

https://blueshw.github.io/2020/05/05/know-front-end-right-away/

2018/09/15/pass-by-reference/

[javascript] call by value | bono blog

의문은 아래와 같은 코드에서 시작되었습니다. 객체를 매개변수로 받는 함수에 새롭게 만든 객체를 인자로 전달하였습니다. 그리고 함수에서 obj 변수에 새로운 객체를 할당하였습니다. 과연 는 어떤 값이 출력될까요? Call By Value 가끔 일하…

https://blueshw.github.io/2018/09/15/pass-by-reference/

2016/01/20/shallow-copy-deep-copy/

얕은 복사(shallow copy) vs 깊은 복사(deep copy) | bono blog

이번에는 객체의 복사에 대해서 알아보려고 합니다. 객체의 복사는 크게 얕은 복사(shallow copy)와 깊은 복사(deep copy)로 나뉩니다. 얼핏 들으면 단어 자체의 의미가 모호하게 느껴질 수도 있습니다만, 사실은 크게 어려운 개념은 아닙니…

https://blueshw.github.io/2016/01/20/shallow-copy-deep-copy/

2020/05/20/disqus-to-utterances/

bono's blog

글을 씁니다.

https://blueshw.github.io/2020/05/20/disqus-to-utterances/

2017/07/01/arrow-function/

[ES6, react] 리액트에서 화살표 함수(arrow function)는 선택이 아닌 필수 | bono blog

리액트를 개발하다보면 이런 코드를 본적 있을것입니다. this(아마도 react 클래스 객체)에 속한 어떤 메서드를 다시 this 에 bind 한다라?? 굳이 왜 이런짓을 해야하는지 의문이 들만합니다. 리액트에서 이러한 코드가 빈번하게 작성되는 이유…

https://blueshw.github.io/2017/07/01/arrow-function/

2017/06/26/presentaional-component-container-component/

[번역] 프레젠테이션 컴포넌트와 컨테이너 컴포넌트 | bono blog

원본 : https://medium.com/@dan_abramov/smart-and-dumb-components-7ca2f9a7c7d0 2 년이나 지난 글이지만, 컴포넌트를 어떻게 구현해야 하는 문제에 있어서는 이만한 가이드가 없다고 생각해서 번역해…

https://blueshw.github.io/2017/06/26/presentaional-component-container-component/

2018/09/20/writing_and_marathon/

글쓰기와 마라톤의 공통점 | bono's blog

…

https://blueshw.github.io/2018/09/20/writing_and_marathon/

2020/05/17/know-css-block-formatting-context/

[CSS 바로 알기] Block Formatting Context | bono blog

프론트엔드 개발에서 Block Formatting Context(이하 BFC)라는 용어는 그리 자주 사용하지 않는다. 아예 들어본 적 없는 사람도 많을 것 같다. 그러나, BFC는 용어에 비해 어렵지 않다(용어가 많아 조금 헷갈리긴 하다). 누구나 …

https://blueshw.github.io/2020/05/17/know-css-block-formatting-context/

2020/05/30/table-of-contents/

bono blog

프론트엔드 엔지니어. 글을 씁니다.

https://blueshw.github.io/2020/05/30/table-of-contents/

2020/01/19/travel-with-unfriendly-people/

친하지 않은 사람들과 여행하기 | bono's blog

사람마다 여행하는 스타일은 다르다. 혼자서 다니는걸 좋아하는 사람, 친한 친구들과 여럿이서 같이 다니는걸 좋아하는 사람, 한번도 가보지 않은 새로운 여행지로 떠나길 즐기는 사람, 익숙한 곳으로 가는걸 좋아하는 사람 등. 나는 이중에 혼자서 다니

https://blueshw.github.io/2020/01/19/travel-with-unfriendly-people/

2020/10/11/gatsby-blog-to-css-modules/

gatsby 블로그에 CSS Modules 적용하기 | bono blog

지금껏, 이 블로그는 로 CSS를 작성하고 있었다. 대표적인 CSS-in-JS 방식이다. 블로그는 스타일 코드가 많지 않기 때문에 CSS-in-JS로 만들어도 충분하다. 하지만, 조금이라도 빠르게 만들어보기 위해 CSS Modules 방식으로 변경해…

https://blueshw.github.io/2020/10/11/gatsby-blog-to-css-modules/

2019/09/15/rule-is-freedom/

규칙이 곧 자유다 | bono blog

무라카미 하루키는 다양한 장소에서 소설을 쓴다. 일본, 유럽, 미국 등 다양한 장소에 머무르며 소설을 쓴다. 일본에 있으면 아무래도 잡일이 이것저것 많이 들어오기 때문에 소설에 집중하기 위해 외국으로 나간다 한다. 성공한 유명한 작가이기 때문에

https://blueshw.github.io/2019/09/15/rule-is-freedom/