https://blog.shiren.dev let the games begin. Mon, 03 Nov 2025 09:22:25 GMT https://validator.w3.org/feed/docs/rss2.html https://github.com/jpmonette/feed ko https://blog.shiren.dev/logo.jpg https://blog.shiren.dev All rights reserved 2024, Sungho Kim https://blog.shiren.dev/ko/post/2025-03-25 https://blog.shiren.dev/ko/post/2025-03-25 Mon, 24 Mar 2025 15:00:00 GMT
혹시 번아웃인 걸까? 하고 의심해봤던 적이 있나요? 대한민국은 특히나 마음 건강에 대해 무심한 편이고 부끄러운 것으로 생각하기 때문에, 증상을 무시하면서 살아가는 경우가 많습니다.. 별 것 아닌 것으로 치부하거나 그저 술 한 잔 마시면, 시간이 지나면 다 풀려야 한다고 여기죠. 그걸 못 이겨내면 나약한 사람인 것 같죠. 스스로 강해야 한다는 방패를 앞에...]]>
혹시 번아웃인 걸까? 하고 의심해봤던 적이 있나요? 대한민국은 특히나 마음 건강에 대해 무심한 편이고 부끄러운 것으로 생각하기 때문에, 증상을 무시하면서 살아가는 경우가 많습니다.. 별 것 아닌 것으로 치부하거나 그저 술 한 잔 마시면, 시간이 지나면 다 풀려야 한다고 여기죠. 그걸 못 이겨내면 나약한 사람인 것 같죠. 스스로 강해야 한다는 방패를 앞에...]]> https://blog.shiren.dev/ko/post/2025-03-04 https://blog.shiren.dev/ko/post/2025-03-04 Mon, 03 Mar 2025 15:00:00 GMT
갈수록 세분화되고 다양화되면서 복잡도가 높아지고 있는 FE 생태계입니다. 새삼스럽죠. 저는 가급적이면 뭐 하나라도 디펜던시를 줄이려는 편입니다. 가급적 표준안에서 변화하지 않는 영역을 더 늘리려고 하죠. 자바스크립트 애니메이션도 그렇습니다. 공개된 오픈소스들을 이용하면 DOM상에서 복잡하고 나이스 한 움직임을 만들어낼 수 있습니다. 하지만 이렇게까지 애니메...]]>
갈수록 세분화되고 다양화되면서 복잡도가 높아지고 있는 FE 생태계입니다. 새삼스럽죠. 저는 가급적이면 뭐 하나라도 디펜던시를 줄이려는 편입니다. 가급적 표준안에서 변화하지 않는 영역을 더 늘리려고 하죠. 자바스크립트 애니메이션도 그렇습니다. 공개된 오픈소스들을 이용하면 DOM상에서 복잡하고 나이스 한 움직임을 만들어낼 수 있습니다. 하지만 이렇게까지 애니메...]]> https://blog.shiren.dev/ko/post/2025-02-28 https://blog.shiren.dev/ko/post/2025-02-28 Thu, 27 Feb 2025 15:00:00 GMT
이력서는 최소한 분기별로 업데이트를 하며, 지난 분기 성과를 반성하고 새로 오는 분기를 계획하는 것이 좋다고 생각합니다. 애초에 회사를 월급도 받고 성과도 만들어, 내 경력을 더욱 풍성하게 만들어 주는 곳이라고 생각하면 좋을 것 같아요. 그러면 절대 수동적으로 일할 수 없습니다. 시키는 일만 하는 것이 아니라, 능동적으로 눈에 불을 켜고 해야 할 일을 찾...]]>
이력서는 최소한 분기별로 업데이트를 하며, 지난 분기 성과를 반성하고 새로 오는 분기를 계획하는 것이 좋다고 생각합니다. 애초에 회사를 월급도 받고 성과도 만들어, 내 경력을 더욱 풍성하게 만들어 주는 곳이라고 생각하면 좋을 것 같아요. 그러면 절대 수동적으로 일할 수 없습니다. 시키는 일만 하는 것이 아니라, 능동적으로 눈에 불을 켜고 해야 할 일을 찾...]]> https://blog.shiren.dev/ko/post/2020-07-27-1 https://blog.shiren.dev/ko/post/2020-07-27-1 Mon, 27 Jul 2020 05:00:00 GMT
이벤트 핸들러는 UI를 개발할 때면 항상 사용된다. 웹뿐만 아니라 네이티브 어플리케이션에서도 약간의 차이가 있을뿐 거의 동일한 추상이 사용된다. 자주 사용되는 만큼 중요하지만 사실 너무 자주 사용되다 보니 가볍게 생각하며 습관적으로 고민 없이 좋지 않은 코드를 만들곤 한다. 자주 사용된다는 건 코드의 양적인 비중도 크다는 것이고 그만큼 조금만 더 신경 쓴다...]]>
이벤트 핸들러는 UI를 개발할 때면 항상 사용된다. 웹뿐만 아니라 네이티브 어플리케이션에서도 약간의 차이가 있을뿐 거의 동일한 추상이 사용된다. 자주 사용되는 만큼 중요하지만 사실 너무 자주 사용되다 보니 가볍게 생각하며 습관적으로 고민 없이 좋지 않은 코드를 만들곤 한다. 자주 사용된다는 건 코드의 양적인 비중도 크다는 것이고 그만큼 조금만 더 신경 쓴다...]]> https://blog.shiren.dev/ko/post/2023-08-07 https://blog.shiren.dev/ko/post/2023-08-07 Mon, 07 Aug 2023 01:00:00 GMT
1년전에 좋은 기회로 취준생과 1~4년 차 개발자를 대상으로 채용과 관련된 강연을 했어요. 전반적으로 구직이나 이직에 도움 될만한 내용들을 준비했는데요. "이렇게 하면 채용될 수 있다"라는 위주의 내용은 가급적 피하려고 노력했지만 어쨌거나 채용과 관련된 내용이다 보니 공장의 쿵쾅 소리같이 너무 세속적으로 느껴졌어요. 그렇다고 근본적인 뭔가를 다루기엔 제 깜...]]>
1년전에 좋은 기회로 취준생과 1~4년 차 개발자를 대상으로 채용과 관련된 강연을 했어요. 전반적으로 구직이나 이직에 도움 될만한 내용들을 준비했는데요. "이렇게 하면 채용될 수 있다"라는 위주의 내용은 가급적 피하려고 노력했지만 어쨌거나 채용과 관련된 내용이다 보니 공장의 쿵쾅 소리같이 너무 세속적으로 느껴졌어요. 그렇다고 근본적인 뭔가를 다루기엔 제 깜...]]> https://blog.shiren.dev/ko/post/2023-04-24 https://blog.shiren.dev/ko/post/2023-04-24 Mon, 24 Apr 2023 10:00:00 GMT
페이지 가시성 API(Page Visibility API)는 이름에서 짐작할 수 있듯 페이지가 현재 유저에게 보이고 있는지 아닌지를 알 수 있게 해주는 API입니다. 정확히 말하면 모니터상에서 보여질 수 있는 상황인지 아닌지겠네요. 유저가 눈을 감거나 다른 곳을 보고 있으면 알 방법이 없으니까요 :) 예전엔 onblur와 onfocus 이벤트를 사용했었는데...]]>
페이지 가시성 API(Page Visibility API)는 이름에서 짐작할 수 있듯 페이지가 현재 유저에게 보이고 있는지 아닌지를 알 수 있게 해주는 API입니다. 정확히 말하면 모니터상에서 보여질 수 있는 상황인지 아닌지겠네요. 유저가 눈을 감거나 다른 곳을 보고 있으면 알 방법이 없으니까요 :) 예전엔 onblur와 onfocus 이벤트를 사용했었는데...]]> https://blog.shiren.dev/ko/post/2023-04-18 https://blog.shiren.dev/ko/post/2023-04-18 Tue, 18 Apr 2023 11:20:00 GMT
세션스토리지(sessionStorage), 로컬스토리지(localStorage)로 구성된 웹 스토리지는 이제 너무 익숙합니다. 다루기 힘들었던 쿠키와는 다르게 클라이언트 저장소로 사용 용도를 명확히 하고 더 나은 사용성으로 이미 우리의 친구가 됐죠. 프론트엔드 개발자가 자주 다루는 로컬 스토리지는 이런 것들을 할 수 있습니다. storage.length...]]>
세션스토리지(sessionStorage), 로컬스토리지(localStorage)로 구성된 웹 스토리지는 이제 너무 익숙합니다. 다루기 힘들었던 쿠키와는 다르게 클라이언트 저장소로 사용 용도를 명확히 하고 더 나은 사용성으로 이미 우리의 친구가 됐죠. 프론트엔드 개발자가 자주 다루는 로컬 스토리지는 이런 것들을 할 수 있습니다. storage.length...]]> https://blog.shiren.dev/ko/post/2023-03-20 https://blog.shiren.dev/ko/post/2023-03-20 Fri, 31 Mar 2023 09:00:00 GMT
프론트엔드 프로젝트를 시작할 때마다 매번 정해야 하는 것들이 있습니다. 개발 환경과 개발 스택을 정하고 대부분 Git이겠지만 형상관리 도구도 정하고 브랜치를 어떻게 관리할지도 정해야 하고 버저닝은 어떻게 해야 할지 등등 프로젝트를 새로 시작할 때면 매번 점검하거나 새롭게 정해야 할 것들이 많았어요. 물론 이미 오랜 기간 숙련된 팀의 경우 기존의 방식을 활용...]]>
프론트엔드 프로젝트를 시작할 때마다 매번 정해야 하는 것들이 있습니다. 개발 환경과 개발 스택을 정하고 대부분 Git이겠지만 형상관리 도구도 정하고 브랜치를 어떻게 관리할지도 정해야 하고 버저닝은 어떻게 해야 할지 등등 프로젝트를 새로 시작할 때면 매번 점검하거나 새롭게 정해야 할 것들이 많았어요. 물론 이미 오랜 기간 숙련된 팀의 경우 기존의 방식을 활용...]]> https://blog.shiren.dev/ko/post/2022-11-21 https://blog.shiren.dev/ko/post/2022-11-21 Mon, 21 Nov 2022 01:00:00 GMT
아직 젊고 건강하다고 생각했습니다. 결국 허리가 나갔습니다. 디스크라고 불리는 노화의 대표적인 질병 추간판 탈출증입니다. 허리가 종종 아팠습니다. 어렸을 때부터 엉망진창이었던 자세를 생각한다면 그래도 지금까지 잘 버텨준 것 같습니다. 코딩 작업과 같은 집중이 필요한 작업을 할 때면 어느덧 자세는 거의 누워있는 자세가 됐었고 뒤늦게 자세를 고쳐잡아도 금방 뒤...]]>
아직 젊고 건강하다고 생각했습니다. 결국 허리가 나갔습니다. 디스크라고 불리는 노화의 대표적인 질병 추간판 탈출증입니다. 허리가 종종 아팠습니다. 어렸을 때부터 엉망진창이었던 자세를 생각한다면 그래도 지금까지 잘 버텨준 것 같습니다. 코딩 작업과 같은 집중이 필요한 작업을 할 때면 어느덧 자세는 거의 누워있는 자세가 됐었고 뒤늦게 자세를 고쳐잡아도 금방 뒤...]]> https://blog.shiren.dev/ko/post/2022-09-22 https://blog.shiren.dev/ko/post/2022-09-22 Thu, 22 Sep 2022 01:00:00 GMT
FSM(Finite State Machine, 유한 상태 기계)은 UI를 구현할 때 가끔씩 사용했었습니다. 기본적인 개념만 응용해서 enum과 조건문을 이용해서 구현했었죠. 정해진 상태들이 많이 있고 상태에 따라 다른 동작들이 가능한 상황에서는 고민 없이 FSM을 적용할 것 같습니다. 그럴 땐 어떻게 코드를 짜도 복잡하기 때문에 코드만이라도 상태에 따른 정...]]>
FSM(Finite State Machine, 유한 상태 기계)은 UI를 구현할 때 가끔씩 사용했었습니다. 기본적인 개념만 응용해서 enum과 조건문을 이용해서 구현했었죠. 정해진 상태들이 많이 있고 상태에 따라 다른 동작들이 가능한 상황에서는 고민 없이 FSM을 적용할 것 같습니다. 그럴 땐 어떻게 코드를 짜도 복잡하기 때문에 코드만이라도 상태에 따른 정...]]> https://blog.shiren.dev/ko/post/2022-05-18 https://blog.shiren.dev/ko/post/2022-05-18 Wed, 18 May 2022 01:00:00 GMT
저는 와인을 좋아합니다. 정확한 기억은 아니지만 와인을 적극적으로 마시기 시작한 시기는 대략 2010년 정도 부터 였던 것 같습니다. 적어도 10년은 넘게 주기적으로 마셨죠. 한 달에 서너 병은 항상 마셨던 것 같습니다. 10년 넘게 마셨으니 뭔가 전문적인 지식도 있고 와인 맛도 잘 구별하고 할 것 같은데요. 딱히 그렇진 않습니다. 그래도 관심이 있어 유튜...]]>
저는 와인을 좋아합니다. 정확한 기억은 아니지만 와인을 적극적으로 마시기 시작한 시기는 대략 2010년 정도 부터 였던 것 같습니다. 적어도 10년은 넘게 주기적으로 마셨죠. 한 달에 서너 병은 항상 마셨던 것 같습니다. 10년 넘게 마셨으니 뭔가 전문적인 지식도 있고 와인 맛도 잘 구별하고 할 것 같은데요. 딱히 그렇진 않습니다. 그래도 관심이 있어 유튜...]]> https://blog.shiren.dev/ko/post/2022-04-28 https://blog.shiren.dev/ko/post/2022-04-28 Thu, 28 Apr 2022 11:00:00 GMT
React(리액트) 18이 얼마 전에 출시했습니다. 개발하시는 프로젝트에 이미 업데이트 했거나 조만간 업데이트 하실 계획일텐데요. 리액트와 Typescript(타입스크립트)를 같이 사용했던 프로젝트라면 반드시 수정해야 할 타입 정의의 브레이킹 체인지 몇가지 공유드립니다. React.FC 타입에서 암묵적인 children 선언 제거 ReactFragment...]]>
React(리액트) 18이 얼마 전에 출시했습니다. 개발하시는 프로젝트에 이미 업데이트 했거나 조만간 업데이트 하실 계획일텐데요. 리액트와 Typescript(타입스크립트)를 같이 사용했던 프로젝트라면 반드시 수정해야 할 타입 정의의 브레이킹 체인지 몇가지 공유드립니다. React.FC 타입에서 암묵적인 children 선언 제거 ReactFragment...]]> https://blog.shiren.dev/ko/post/2022-03-07 https://blog.shiren.dev/ko/post/2022-03-07 Mon, 07 Mar 2022 01:00:00 GMT
이제는 메타(Meta)라고 불러야 하는 페이스북에서 일하는 지인이 휴가차 한국에 입국했었어요. 오랜만에 얼굴도 보고 술 한잔했습니다. 오랜만에 만나는 자리다 보니 참 많은 이야기를 나눴었죠. 어느덧 자리가 무르익으니 늘 하던 대로 또 개발 이야기를 하기 시작했어요. 업무나 개발에 대해 서로 이야기를 많이 나누던 친구다 보니 자연스럽게 그렇게 됐죠. 이 글에...]]>
이제는 메타(Meta)라고 불러야 하는 페이스북에서 일하는 지인이 휴가차 한국에 입국했었어요. 오랜만에 얼굴도 보고 술 한잔했습니다. 오랜만에 만나는 자리다 보니 참 많은 이야기를 나눴었죠. 어느덧 자리가 무르익으니 늘 하던 대로 또 개발 이야기를 하기 시작했어요. 업무나 개발에 대해 서로 이야기를 많이 나누던 친구다 보니 자연스럽게 그렇게 됐죠. 이 글에...]]> https://blog.shiren.dev/ko/post/2022-01-27 https://blog.shiren.dev/ko/post/2022-01-27 Thu, 27 Jan 2022 01:00:00 GMT
최근 주말마다 아이를 위해 리액트로 간단한 게임을 만들고 있습니다. 무한의 계단이란 게임을 너무 집중해서 하길래 게임에서 아이한테 위해가 될 수 있는 중독적인 요소는 빼고 핵심 재미(?)만 갖고 있는 게임을 만들어볼 심산이었죠. 단순히 계단을 좌우로 오르면서 얻은 점수로 아바타를 사거나 해서 캐릭터를 꾸밀 수 있는 게임인데 여기서 점수로 게임 내의 재화를...]]>
최근 주말마다 아이를 위해 리액트로 간단한 게임을 만들고 있습니다. 무한의 계단이란 게임을 너무 집중해서 하길래 게임에서 아이한테 위해가 될 수 있는 중독적인 요소는 빼고 핵심 재미(?)만 갖고 있는 게임을 만들어볼 심산이었죠. 단순히 계단을 좌우로 오르면서 얻은 점수로 아바타를 사거나 해서 캐릭터를 꾸밀 수 있는 게임인데 여기서 점수로 게임 내의 재화를...]]> https://blog.shiren.dev/ko/post/2021-10-05 https://blog.shiren.dev/ko/post/2021-10-05 Tue, 05 Oct 2021 01:00:00 GMT
얼마 전 진행했던 코드리뷰에서 undefined의 사용에 대한 문제로 이야기가 나왔어요. 개인적으로는 너무도 오랫동안 당연하게 null과 undefined를 나름 명확하게 구분했었고, 각 사용처에 맞게 사용하고 있었기에 사실 이 부분에 관해서는 더 알아볼 생각도 없었습니다. 아이러니하게도 이야기가 나왔던 문제는 오해로 생긴 다른 문제였기에 쉽게 해결됐어요....]]>
얼마 전 진행했던 코드리뷰에서 undefined의 사용에 대한 문제로 이야기가 나왔어요. 개인적으로는 너무도 오랫동안 당연하게 null과 undefined를 나름 명확하게 구분했었고, 각 사용처에 맞게 사용하고 있었기에 사실 이 부분에 관해서는 더 알아볼 생각도 없었습니다. 아이러니하게도 이야기가 나왔던 문제는 오해로 생긴 다른 문제였기에 쉽게 해결됐어요....]]> https://blog.shiren.dev/ko/post/2021-08-30 https://blog.shiren.dev/ko/post/2021-08-30 Mon, 30 Aug 2021 01:00:00 GMT
몇 달 전에 ECMAScript 2021 최종 스펙이 공개되었어요. 바로 쓸만한 것도 있고 언어를 조금 더 깊게 활용할 수 있는 기능들도 생겼습니다. 매해 이렇게 달라지고 개선되는 것을 보면서 좋기도 하지만 점점 이것도 무뎌지는진 건지 아니면 개선점이 와닿지 않는 건지 예전만큼 관심이나 파급효과가 적어진 것 같아요. 스펙을 보자마자 조만간 정리해야지 했지만...]]>
몇 달 전에 ECMAScript 2021 최종 스펙이 공개되었어요. 바로 쓸만한 것도 있고 언어를 조금 더 깊게 활용할 수 있는 기능들도 생겼습니다. 매해 이렇게 달라지고 개선되는 것을 보면서 좋기도 하지만 점점 이것도 무뎌지는진 건지 아니면 개선점이 와닿지 않는 건지 예전만큼 관심이나 파급효과가 적어진 것 같아요. 스펙을 보자마자 조만간 정리해야지 했지만...]]> https://blog.shiren.dev/ko/post/2021-06-29 https://blog.shiren.dev/ko/post/2021-06-29 Tue, 29 Jun 2021 01:00:00 GMT
개발을 하다 보면 개발자의 실수로 생긴 코드 상의 문제로 뻘건 에러 메시지를 자주 만나게 됩니다. 개발 중에 버그가 발견된다면 다행이지만 실 서비스에서 에러 메시지가 출력된다면 개발자로써 손발이 오그라들고 식은땀이 솟구칠 겁니다. 자바스크립트는 런타임에서만 에러 메시지를 만날 수 있기 때문에 종종 이렇게 심각한 버그를 놓치기도 합니다. 이 부분에선 요즘...]]>
개발을 하다 보면 개발자의 실수로 생긴 코드 상의 문제로 뻘건 에러 메시지를 자주 만나게 됩니다. 개발 중에 버그가 발견된다면 다행이지만 실 서비스에서 에러 메시지가 출력된다면 개발자로써 손발이 오그라들고 식은땀이 솟구칠 겁니다. 자바스크립트는 런타임에서만 에러 메시지를 만날 수 있기 때문에 종종 이렇게 심각한 버그를 놓치기도 합니다. 이 부분에선 요즘...]]> https://blog.shiren.dev/ko/post/2021-05-17 https://blog.shiren.dev/ko/post/2021-05-17 Mon, 17 May 2021 01:00:00 GMT
저는 반복적으로 하는 작업이 있다면 가장 나에게 맞는 최적화된 루틴을 만들고 그 작업을 할 때마다 생각 없이 그대로 하는 편이에요. 정해진 루틴은 고집스럽게 유지하진 않고요. 경험에 따라 혹은 관련 지식이 늘어남에 따라 루틴을 조금씩 개선합니다. 루틴은 “현재 내가 이 일을 잘 하기 위해 알고 있는 위한 가장 나은 방법”이라고 할 수 있겠네요. 그리고 실행...]]>
저는 반복적으로 하는 작업이 있다면 가장 나에게 맞는 최적화된 루틴을 만들고 그 작업을 할 때마다 생각 없이 그대로 하는 편이에요. 정해진 루틴은 고집스럽게 유지하진 않고요. 경험에 따라 혹은 관련 지식이 늘어남에 따라 루틴을 조금씩 개선합니다. 루틴은 “현재 내가 이 일을 잘 하기 위해 알고 있는 위한 가장 나은 방법”이라고 할 수 있겠네요. 그리고 실행...]]> https://blog.shiren.dev/ko/post/2021-04-20 https://blog.shiren.dev/ko/post/2021-04-20 Tue, 20 Apr 2021 01:00:00 GMT
직장인이라면 자연스럽게 업무를 대하는 태도가 캐릭터 처럼 만들어져요. 개발자도 마찬가지고요. 신입이라고 태도가 항상 나쁜 것도 아니고 경력이라고 항상 태도가 좋은 것도 아니에요. 코딩 스킬처럼 개선될 수도 있고요. 연차가 적을수록 몰라서 잘못된 태도를 갖는 경우가 많습니다. 이렇게 만들어진 태도는 보통 연차가 높을수록 개선되기 힘들다고들 하죠. 태도라는 큰...]]>
직장인이라면 자연스럽게 업무를 대하는 태도가 캐릭터 처럼 만들어져요. 개발자도 마찬가지고요. 신입이라고 태도가 항상 나쁜 것도 아니고 경력이라고 항상 태도가 좋은 것도 아니에요. 코딩 스킬처럼 개선될 수도 있고요. 연차가 적을수록 몰라서 잘못된 태도를 갖는 경우가 많습니다. 이렇게 만들어진 태도는 보통 연차가 높을수록 개선되기 힘들다고들 하죠. 태도라는 큰...]]> https://blog.shiren.dev/ko/post/2021-02-22 https://blog.shiren.dev/ko/post/2021-02-22 Mon, 22 Feb 2021 01:00:00 GMT
(2022-03-04 업데이트: webpack-dev-server, babel, jest 관련 설정 코드가 수정됐습니다.) 파트 1에서는 기본 자바스크립트 개발 환경을 러나와 함께 구축해봤어요. 기본 환경만으로 충분하신 분들도 계시겠지만 보통은 그렇지 않을 겁니다. 이제 두 가지 개발 환경을 추가할 건데요. 타입 스크립트와 리액트 개발 환경이에요. 우선 타...]]>
(2022-03-04 업데이트: webpack-dev-server, babel, jest 관련 설정 코드가 수정됐습니다.) 파트 1에서는 기본 자바스크립트 개발 환경을 러나와 함께 구축해봤어요. 기본 환경만으로 충분하신 분들도 계시겠지만 보통은 그렇지 않을 겁니다. 이제 두 가지 개발 환경을 추가할 건데요. 타입 스크립트와 리액트 개발 환경이에요. 우선 타...]]> https://blog.shiren.dev/ko/post/2021-02-15 https://blog.shiren.dev/ko/post/2021-02-15 Mon, 15 Feb 2021 04:00:00 GMT
(2022-03-04 업데이트: webpack-dev-server, babel, jest 관련 설정 코드가 수정됐습니다.) 개발을 하다 보면 특정 환경에서 빠르게 코드를 작성하고 그 결과를 확인해보고 싶을 때가 있어요. 라이브러리나 프레임웍 혹은 언어를 공부할 때나 아이디어를 빠르게 실험하거나 프로토타입 해보고 싶을 때 그렇지요. 바닐라 자바스크립트로 충분...]]>
(2022-03-04 업데이트: webpack-dev-server, babel, jest 관련 설정 코드가 수정됐습니다.) 개발을 하다 보면 특정 환경에서 빠르게 코드를 작성하고 그 결과를 확인해보고 싶을 때가 있어요. 라이브러리나 프레임웍 혹은 언어를 공부할 때나 아이디어를 빠르게 실험하거나 프로토타입 해보고 싶을 때 그렇지요. 바닐라 자바스크립트로 충분...]]> https://blog.shiren.dev/ko/post/2020-12-01 https://blog.shiren.dev/ko/post/2020-12-01 Tue, 01 Dec 2020 01:00:00 GMT
언젠가부터 브라우저스리스트(browserslist)라는 것이 자주 눈에 띄더니 지금은 FE 개발 환경에서 뺄 수 없는 도구가 되었어요. 아마도 바벨(Babel)이라는 FE 계의 걸출한 스타 프로젝트에서 도입했기 때문일 거라고 생각합니다. 바벨을 사용하는 프로젝트들이 많다 보니 간접적으로 혹은 직접적으로 브라우저스리스트까지 사용하게 되는 것이죠. 사실 좋아요...]]>
언젠가부터 브라우저스리스트(browserslist)라는 것이 자주 눈에 띄더니 지금은 FE 개발 환경에서 뺄 수 없는 도구가 되었어요. 아마도 바벨(Babel)이라는 FE 계의 걸출한 스타 프로젝트에서 도입했기 때문일 거라고 생각합니다. 바벨을 사용하는 프로젝트들이 많다 보니 간접적으로 혹은 직접적으로 브라우저스리스트까지 사용하게 되는 것이죠. 사실 좋아요...]]> https://blog.shiren.dev/ko/post/2020-11-23 https://blog.shiren.dev/ko/post/2020-11-23 Mon, 23 Nov 2020 00:00:00 GMT
5~6년 차 즈음부터 개발자 채용에 조금씩 관여하기 시작했고 현 회사에서는 면접관으로 활동한지 5년이 넘은 것 같다. 면접은 1차 면접에 해당하는 기술 면접이었고 팀의 채용 프로세스를 개선하거나 사전과제, 라이브 코딩 문제 출제에 주도적으로 참여했다. 그간 다양한 개발자들을 만났고 운 좋게도 좋은 개발자들을 많이 채용할 수 있었다. 채용 과정에서 좋은 개발...]]>
5~6년 차 즈음부터 개발자 채용에 조금씩 관여하기 시작했고 현 회사에서는 면접관으로 활동한지 5년이 넘은 것 같다. 면접은 1차 면접에 해당하는 기술 면접이었고 팀의 채용 프로세스를 개선하거나 사전과제, 라이브 코딩 문제 출제에 주도적으로 참여했다. 그간 다양한 개발자들을 만났고 운 좋게도 좋은 개발자들을 많이 채용할 수 있었다. 채용 과정에서 좋은 개발...]]> https://blog.shiren.dev/ko/post/2020-10-05 https://blog.shiren.dev/ko/post/2020-10-05 Mon, 05 Oct 2020 00:00:00 GMT
독서를 습관으로 만들기 위해 그간 많은 노력을 했었다. 습관적으로 SNS를 열면서 “이럴 시간에 책을 읽었으면…” 하고 자주 생각했지만 SNS 아이콘을 터치하는 유혹을 뿌리치기 힘들었다. 여러 가지 시도를 했고 “하루 25분 실행하기: 하루를 대하는 14년차 개발자의 자세” 에서 밝혔다시피 아직 다독가에 비하면 보잘것없지만 그래도 나름 습관 만들기에는 성...]]>
독서를 습관으로 만들기 위해 그간 많은 노력을 했었다. 습관적으로 SNS를 열면서 “이럴 시간에 책을 읽었으면…” 하고 자주 생각했지만 SNS 아이콘을 터치하는 유혹을 뿌리치기 힘들었다. 여러 가지 시도를 했고 “하루 25분 실행하기: 하루를 대하는 14년차 개발자의 자세” 에서 밝혔다시피 아직 다독가에 비하면 보잘것없지만 그래도 나름 습관 만들기에는 성...]]> https://blog.shiren.dev/ko/post/2020-09-07 https://blog.shiren.dev/ko/post/2020-09-07 Mon, 07 Sep 2020 00:00:00 GMT
하루 24시간은 모두에게 공평하지만 그 24시간을 모두가 공평하게 사용하진 않는다. 하루의 여가시간을 어떻게 하면 더 효율적으로 사용할 수 있을까는 나의 오랜 고민거리였다. 단기 목표도 세워보고 장기 목표도 세워보고 포모도로, GTD도 도입하고 간츠도 사용해보고 하루 표준 계획표도 짜보고 일주일 보고서도 만들어봤다. 하루를 온전히 “노력”하기 위한 ”노력”...]]>
하루 24시간은 모두에게 공평하지만 그 24시간을 모두가 공평하게 사용하진 않는다. 하루의 여가시간을 어떻게 하면 더 효율적으로 사용할 수 있을까는 나의 오랜 고민거리였다. 단기 목표도 세워보고 장기 목표도 세워보고 포모도로, GTD도 도입하고 간츠도 사용해보고 하루 표준 계획표도 짜보고 일주일 보고서도 만들어봤다. 하루를 온전히 “노력”하기 위한 ”노력”...]]> https://blog.shiren.dev/ko/post/2020-06-15 https://blog.shiren.dev/ko/post/2020-06-15 Mon, 15 Jun 2020 05:00:00 GMT
각종 커뮤니티에 주기적으로 등장하는 "private 메서드를 테스트하려면 어떻게 하나요?" 혹은 "private 메서드를 테스트해야 하나요?" 와 같은 질문을 보면서 언젠가는 관련해서 정리해봐야겠다고 생각했었는데 꽤 시간이 흘러 이 내용으로 글을 써본다. 주제 자체는 간단한 편이지만 사람마다 생각이 다른 것 같다. 특히 해외 개발자들의 의견이 분분한 것 같...]]>
각종 커뮤니티에 주기적으로 등장하는 "private 메서드를 테스트하려면 어떻게 하나요?" 혹은 "private 메서드를 테스트해야 하나요?" 와 같은 질문을 보면서 언젠가는 관련해서 정리해봐야겠다고 생각했었는데 꽤 시간이 흘러 이 내용으로 글을 써본다. 주제 자체는 간단한 편이지만 사람마다 생각이 다른 것 같다. 특히 해외 개발자들의 의견이 분분한 것 같...]]> https://blog.shiren.dev/ko/post/2020-03-24 https://blog.shiren.dev/ko/post/2020-03-24 Tue, 24 Mar 2020 09:20:00 GMT
언젠가부터 여러 가지 걱정들로 머릿속이 복잡해지고 있었다. 이런 상황에서는 운동과 독서가 해결책이 될 수 있는데 운동은 평소 꾸준히 하는 편이었고 독서량을 많이 늘려봤다. 기술 서적이 아닌 내 삶에 필요하다고 생각하는 주제의 책들을 읽었다. 하지만 뭔가 부족했다. “생각을 정리할 시간이 필요하다.”라고 생각했지만, 막상 생각을 정리할 시간을 내기 힘들었다....]]>
언젠가부터 여러 가지 걱정들로 머릿속이 복잡해지고 있었다. 이런 상황에서는 운동과 독서가 해결책이 될 수 있는데 운동은 평소 꾸준히 하는 편이었고 독서량을 많이 늘려봤다. 기술 서적이 아닌 내 삶에 필요하다고 생각하는 주제의 책들을 읽었다. 하지만 뭔가 부족했다. “생각을 정리할 시간이 필요하다.”라고 생각했지만, 막상 생각을 정리할 시간을 내기 힘들었다....]]> https://blog.shiren.dev/ko/post/2020-03-12 https://blog.shiren.dev/ko/post/2020-03-12 Thu, 12 Mar 2020 02:35:00 GMT
ECMAScript 클래스 필드(class field) 명세중에 Private field 즉 Private Property (이하 Private 속성) 가 있다. 클래스 필드 스펙은 Stage 3(Candidate)까지 올랐으니 아마 곧 Stage 4(Finished)를 거쳐 표준 스펙이 될 것이다. 사실 초기에 명세 문서를 봤을 때는 "드디어 privat...]]>
ECMAScript 클래스 필드(class field) 명세중에 Private field 즉 Private Property (이하 Private 속성) 가 있다. 클래스 필드 스펙은 Stage 3(Candidate)까지 올랐으니 아마 곧 Stage 4(Finished)를 거쳐 표준 스펙이 될 것이다. 사실 초기에 명세 문서를 봤을 때는 "드디어 privat...]]> https://blog.shiren.dev/ko/post/2020-01-11 https://blog.shiren.dev/ko/post/2020-01-11 Sat, 11 Jan 2020 07:00:00 GMT
2019년 11월에 개최한 회사 컨퍼런스 NHN FORWARD에서 프런트엔드에 대한 고민이나 궁금증을 해결할 수 있는 프런트엔드 상담소 를 운영했었다. 다양한 고민이 있었지만, 연차나 직책별로 궁금증과 고민거리들이 비슷하다는 것을 알 수 있었다. 명확하게 묘수를 알려줄 수 있는 트러블 슈팅부터 프런트 엔드 개발자가 가야할 방향까지 다양한 고민이 있었다....]]>
2019년 11월에 개최한 회사 컨퍼런스 NHN FORWARD에서 프런트엔드에 대한 고민이나 궁금증을 해결할 수 있는 프런트엔드 상담소 를 운영했었다. 다양한 고민이 있었지만, 연차나 직책별로 궁금증과 고민거리들이 비슷하다는 것을 알 수 있었다. 명확하게 묘수를 알려줄 수 있는 트러블 슈팅부터 프런트 엔드 개발자가 가야할 방향까지 다양한 고민이 있었다....]]> https://blog.shiren.dev/ko/post/2019-05-22 https://blog.shiren.dev/ko/post/2019-05-22 Wed, 22 May 2019 00:39:00 GMT
레이지 로딩이란? 좋은 기회로 2019년 구글I/O에 참석했다. 웹 기술 세션 중에는 크게 눈에 띄는 세션은 없었지만, 일부 세션에서 소개된 웹과 관련 기술 몇 가지는 흥미로웠다. Native Lazy Loading, Portals, Duplex, Rich Results 정도가 나의 관심을 끌었다. 그중 키노트에서 시작해 몇 개의 세션에서 두루두루 언급한...]]>
레이지 로딩이란? 좋은 기회로 2019년 구글I/O에 참석했다. 웹 기술 세션 중에는 크게 눈에 띄는 세션은 없었지만, 일부 세션에서 소개된 웹과 관련 기술 몇 가지는 흥미로웠다. Native Lazy Loading, Portals, Duplex, Rich Results 정도가 나의 관심을 끌었다. 그중 키노트에서 시작해 몇 개의 세션에서 두루두루 언급한...]]> https://blog.shiren.dev/ko/post/2019-03-28 https://blog.shiren.dev/ko/post/2019-03-28 Thu, 28 Mar 2019 08:53:00 GMT
여기까지 오기까지 내가 처음 SPA 프로젝트를 진행했던 때는 2012년이다. 그때 제일 핫했던 백본(Backbone)을 기반으로 구축한 꽤 큰 규모의 프로젝트였다. 그때는 지금처럼 프론트엔드 개발환경이 좋지 않았고 SPA라는 개념 자체가 겨우 슬슬 알려지기 시작한 시기였다. MVC에서 벗어나질 못한 프레임웍들이 주를 이루었던 프론트엔드 진영이었다. 앵귤러J...]]>
여기까지 오기까지 내가 처음 SPA 프로젝트를 진행했던 때는 2012년이다. 그때 제일 핫했던 백본(Backbone)을 기반으로 구축한 꽤 큰 규모의 프로젝트였다. 그때는 지금처럼 프론트엔드 개발환경이 좋지 않았고 SPA라는 개념 자체가 겨우 슬슬 알려지기 시작한 시기였다. MVC에서 벗어나질 못한 프레임웍들이 주를 이루었던 프론트엔드 진영이었다. 앵귤러J...]]> https://blog.shiren.dev/ko/post/2019-01-11 https://blog.shiren.dev/ko/post/2019-01-11 Fri, 11 Jan 2019 08:07:08 GMT
2018년은 FE개발랩에 좋은 일이 많은 한 해였다. 랩에서 내놓은 오픈소스 프로젝트들이 좋은 반응을 얻었고, 몇 가지 의미있는 성과를 얻었다. 아직 오픈소스 생태계에서 큰 역할을 하지 못하는 대한민국에서 좋은 오픈소스 프로젝트들이 많이 나왔으면 하는 바람으로 몇 년간 우리가 오픈소스를 운영하면서 얻은 나름의 결과를 글로 작성한다. 이 글은 TOAST UI...]]>
2018년은 FE개발랩에 좋은 일이 많은 한 해였다. 랩에서 내놓은 오픈소스 프로젝트들이 좋은 반응을 얻었고, 몇 가지 의미있는 성과를 얻었다. 아직 오픈소스 생태계에서 큰 역할을 하지 못하는 대한민국에서 좋은 오픈소스 프로젝트들이 많이 나왔으면 하는 바람으로 몇 년간 우리가 오픈소스를 운영하면서 얻은 나름의 결과를 글로 작성한다. 이 글은 TOAST UI...]]> https://blog.shiren.dev/ko/post/2018-10-24 https://blog.shiren.dev/ko/post/2018-10-24 Wed, 24 Oct 2018 08:53:08 GMT
원글: Why Using reduce() to Sequentially Resolve Promises Works https://css-tricks.com/why-using-reduce-to-sequentially-resolve-promises-works/ reduce() 를 이용해 순차적으로 프라미스를 해결하는 방법 Promise 객체를 사용하지 않고 비...]]>
원글: Why Using reduce() to Sequentially Resolve Promises Works https://css-tricks.com/why-using-reduce-to-sequentially-resolve-promises-works/ reduce() 를 이용해 순차적으로 프라미스를 해결하는 방법 Promise 객체를 사용하지 않고 비...]]> https://blog.shiren.dev/ko/post/2018-08-14 https://blog.shiren.dev/ko/post/2018-08-14 Tue, 14 Aug 2018 04:58:08 GMT
원글: https://medium.com/scrumpy/dynamic-component-templates-with-vue-js-d9236ab183bb Vue.js에서의 다이나믹 컴포넌트 템플릿 컴포넌트들이 항상 같은 구조로 되어 있진 않다. 그리고 때론 관리해야할 상태들이 많을때도 있다. 이런 문제는 비동기적인 방법으로 해결할 수도 있다. 유즈 케이...]]>
원글: https://medium.com/scrumpy/dynamic-component-templates-with-vue-js-d9236ab183bb Vue.js에서의 다이나믹 컴포넌트 템플릿 컴포넌트들이 항상 같은 구조로 되어 있진 않다. 그리고 때론 관리해야할 상태들이 많을때도 있다. 이런 문제는 비동기적인 방법으로 해결할 수도 있다. 유즈 케이...]]> https://blog.shiren.dev/ko/post/2018-07-10 https://blog.shiren.dev/ko/post/2018-07-10 Tue, 10 Jul 2018 04:58:08 GMT
본 시리즈의 이전 아티클에서는 웹팩4에 대해 다루면서 바로 쓸 수 있는 환경을 만들어봤다. 이번편에는 그 환경 그대로 이용해 ES6 개발 환경을 추가한다. ES6는 이제 충분히 써도 될만한 시기라고 생각한다. "나는 프런트 개발자가 아니기도 하고 브라우저가 모두 지원하지도 않기에 ES6는 아직 못쓴다" 라고 생각하고 있다면 이 글을 통해 생각을 바꿀 수...]]>
본 시리즈의 이전 아티클에서는 웹팩4에 대해 다루면서 바로 쓸 수 있는 환경을 만들어봤다. 이번편에는 그 환경 그대로 이용해 ES6 개발 환경을 추가한다. ES6는 이제 충분히 써도 될만한 시기라고 생각한다. "나는 프런트 개발자가 아니기도 하고 브라우저가 모두 지원하지도 않기에 ES6는 아직 못쓴다" 라고 생각하고 있다면 이 글을 통해 생각을 바꿀 수...]]> https://blog.shiren.dev/ko/post/2018-04-16 https://blog.shiren.dev/ko/post/2018-04-16 Mon, 16 Apr 2018 04:58:08 GMT
최근에 새로운 프로젝트를 진행하게 되면서 기존에 간만 살짝 보고 있던 뷰(Vue, 이하 뷰)를 본격적으로 도입하게 되었다. 사실 팀에서는 리액트를 선호하고 있었으나 회사 내부에서 뷰의 사용이 빠른 속도로 증가하고 있었고 그에 따라 팀내에서도 뷰에 대한 전문성이 필요하게 되었다. 뷰와 리액트는 서로 영향을 주고받고 발전해나가는 도구들이라 비슷한 부분이 많아...]]>
최근에 새로운 프로젝트를 진행하게 되면서 기존에 간만 살짝 보고 있던 뷰(Vue, 이하 뷰)를 본격적으로 도입하게 되었다. 사실 팀에서는 리액트를 선호하고 있었으나 회사 내부에서 뷰의 사용이 빠른 속도로 증가하고 있었고 그에 따라 팀내에서도 뷰에 대한 전문성이 필요하게 되었다. 뷰와 리액트는 서로 영향을 주고받고 발전해나가는 도구들이라 비슷한 부분이 많아...]]> https://blog.shiren.dev/ko/post/2018-02-23 https://blog.shiren.dev/ko/post/2018-02-23 Fri, 23 Feb 2018 04:58:08 GMT
프리미티브에 대한 의문 현재 팀 내부에서는 시니어들이 팀 인력 채용 프로세스를 개선하고 있다. 프로세스 중에서도 현재는 필기시험 문제를 재출제하는 중인데 이게 생각보다 쉽지 않아 매일 매일 서로 의견이 분분하다. 그러던 어느 날 프리미티브에 대한 의견을 나누던 중 자바스크립트의 프리미티브를 객체 같이 사용된다고 설명해도 되느냐 안되느냐의 문제를 놓고 토론을...]]>
프리미티브에 대한 의문 현재 팀 내부에서는 시니어들이 팀 인력 채용 프로세스를 개선하고 있다. 프로세스 중에서도 현재는 필기시험 문제를 재출제하는 중인데 이게 생각보다 쉽지 않아 매일 매일 서로 의견이 분분하다. 그러던 어느 날 프리미티브에 대한 의견을 나누던 중 자바스크립트의 프리미티브를 객체 같이 사용된다고 설명해도 되느냐 안되느냐의 문제를 놓고 토론을...]]> https://blog.shiren.dev/ko/post/2017-11-13 https://blog.shiren.dev/ko/post/2017-11-13 Mon, 13 Nov 2017 04:58:08 GMT
금단의 영역에 손을 대다 에디터, IDE뿐 아니라 업무에 관련된 새로운 도구가 나오면 꼭 써봐야 직성이 풀리는 성격이었지만 언젠가부터 그놈이 그놈이고 저놈이 그놈이고 새로운 기능이 있어도 개발을 할 때 사용하는 기능들은 매우 한정적이라는 사실을 깨닫게 되었다. 인텔리제이도 일년 이상은 사용해봤지만 프론트 엔드를 주로 개발하기에 딱히 IDE가 필요하지 않았고...]]>
금단의 영역에 손을 대다 에디터, IDE뿐 아니라 업무에 관련된 새로운 도구가 나오면 꼭 써봐야 직성이 풀리는 성격이었지만 언젠가부터 그놈이 그놈이고 저놈이 그놈이고 새로운 기능이 있어도 개발을 할 때 사용하는 기능들은 매우 한정적이라는 사실을 깨닫게 되었다. 인텔리제이도 일년 이상은 사용해봤지만 프론트 엔드를 주로 개발하기에 딱히 IDE가 필요하지 않았고...]]> https://blog.shiren.dev/ko/post/2017-09-18 https://blog.shiren.dev/ko/post/2017-09-18 Mon, 18 Sep 2017 04:58:08 GMT
한국은 물론 세계적으로 엄청난 양의 동영상 콘텐츠가 소비되고 있다. 플래시가 대세였던 웹 동영상 기술이 점차 표준 기술인 HTML5 비디오로 전환되었고 요즘은 대부분의 동영상 서비스는 HTML5를 기반으로 서비스되고 있다. 동영상 기술은 점차 고도화되어 네트워크 환경에 따른 최적의 동영상 품질을 스트리밍해 버퍼링없는 서비스를 제공하기 위해 여러 방법들이 모...]]>
한국은 물론 세계적으로 엄청난 양의 동영상 콘텐츠가 소비되고 있다. 플래시가 대세였던 웹 동영상 기술이 점차 표준 기술인 HTML5 비디오로 전환되었고 요즘은 대부분의 동영상 서비스는 HTML5를 기반으로 서비스되고 있다. 동영상 기술은 점차 고도화되어 네트워크 환경에 따른 최적의 동영상 품질을 스트리밍해 버퍼링없는 서비스를 제공하기 위해 여러 방법들이 모...]]> https://blog.shiren.dev/ko/post/2017-04-10 https://blog.shiren.dev/ko/post/2017-04-10 Mon, 10 Apr 2017 04:58:08 GMT
원글: https://tutorials.technology/tutorials/11-webassembly-initial-steps-tutorial.html 소개 웹어셈블리는 미래에 매우 유용하게 사용될 새롭고도 새로운 표준이다. 이 기술은 W3C 커뮤니티 그룹에서 애플, 구글 , 마이크로소프트 그리고 모질라와 함께 개발되고 있다. 이 프로젝트의 초기 시점...]]>
원글: https://tutorials.technology/tutorials/11-webassembly-initial-steps-tutorial.html 소개 웹어셈블리는 미래에 매우 유용하게 사용될 새롭고도 새로운 표준이다. 이 기술은 W3C 커뮤니티 그룹에서 애플, 구글 , 마이크로소프트 그리고 모질라와 함께 개발되고 있다. 이 프로젝트의 초기 시점...]]> https://blog.shiren.dev/ko/post/2017-02-21 https://blog.shiren.dev/ko/post/2017-02-21 Tue, 21 Feb 2017 04:58:08 GMT
자바스크립트는 객체 지향 언어이자 함수를 1급 객체로 취급하기 때문에 함수형 프로그래밍도 가능한 멀티 패러다임 언어이다. 자바스크립트를 조금이라도 다뤄봤던 사람이라면 익히 알고 있겠지만 자바스크립트에는 클래스란 개념이 없어 객체 생성이나 상속이 다른 언어와 다르고 특히 OOP는 주로 프로토타입이란 메커니즘을 통해 이루어진다. 검색을 조금만 해보면 프로토타입...]]>
자바스크립트는 객체 지향 언어이자 함수를 1급 객체로 취급하기 때문에 함수형 프로그래밍도 가능한 멀티 패러다임 언어이다. 자바스크립트를 조금이라도 다뤄봤던 사람이라면 익히 알고 있겠지만 자바스크립트에는 클래스란 개념이 없어 객체 생성이나 상속이 다른 언어와 다르고 특히 OOP는 주로 프로토타입이란 메커니즘을 통해 이루어진다. 검색을 조금만 해보면 프로토타입...]]> https://blog.shiren.dev/ko/post/2017-01-03 https://blog.shiren.dev/ko/post/2017-01-03 Tue, 03 Jan 2017 01:07:08 GMT
원글: https://www.sitepoint.com/functional-reactive-programming-rxjs/ 이 글은 Moritz Kröger, Bruno Mota와 Vildan Softic의 검수를 받았다. SitePoint의 컨텐트들이 최고가 될 수 있게 도와주는 SitePont의 모든 동료 리뷰어들에게 감사를 표한다. 본론으로 들어가기...]]>
원글: https://www.sitepoint.com/functional-reactive-programming-rxjs/ 이 글은 Moritz Kröger, Bruno Mota와 Vildan Softic의 검수를 받았다. SitePoint의 컨텐트들이 최고가 될 수 있게 도와주는 SitePont의 모든 동료 리뷰어들에게 감사를 표한다. 본론으로 들어가기...]]> https://blog.shiren.dev/ko/post/2016-11-15 https://blog.shiren.dev/ko/post/2016-11-15 Tue, 15 Nov 2016 04:44:08 GMT
타임라인 타임라인은 웹페이지를 로드할때나 혹은 유저 인터렉션 등으로 인해 브라우저에서 발생하는 동작들을 레코딩하고 타임라인 형태로 시각화해주는 도구다. 시간의 흐름에 따라 브라우저의 이벤트(여기서의 이벤트는 DOM상의 이벤트가 아닌 브라우저 내부의 동작, 물론 DOM이벤트를 발생시키는 이벤트도 있다)뿐 아니라 CPU, 메모리, 네트워크 사용량과 FPS까지...]]>
타임라인 타임라인은 웹페이지를 로드할때나 혹은 유저 인터렉션 등으로 인해 브라우저에서 발생하는 동작들을 레코딩하고 타임라인 형태로 시각화해주는 도구다. 시간의 흐름에 따라 브라우저의 이벤트(여기서의 이벤트는 DOM상의 이벤트가 아닌 브라우저 내부의 동작, 물론 DOM이벤트를 발생시키는 이벤트도 있다)뿐 아니라 CPU, 메모리, 네트워크 사용량과 FPS까지...]]> https://blog.shiren.dev/ko/post/2016-08-23 https://blog.shiren.dev/ko/post/2016-08-23 Tue, 23 Aug 2016 07:07:08 GMT
원문 http://jdlm.info/articles/2016/03/06/lessons-building-node-app-docker.html by John Lees-Miller 도커를 이용해 노드제이에스 어플리케이션을 개발 하고 배포 하면서 어렵게 배운 팁과 트릭을 공유하고자 한다. 이 튜토리얼 아티클에서는 socket.io chat example을 이용...]]>
원문 http://jdlm.info/articles/2016/03/06/lessons-building-node-app-docker.html by John Lees-Miller 도커를 이용해 노드제이에스 어플리케이션을 개발 하고 배포 하면서 어렵게 배운 팁과 트릭을 공유하고자 한다. 이 튜토리얼 아티클에서는 socket.io chat example을 이용...]]> https://blog.shiren.dev/ko/post/2016-06-27 https://blog.shiren.dev/ko/post/2016-06-27 Mon, 27 Jun 2016 01:07:08 GMT
클로저와 객체 클로저를 처음 접했을때 전혀 이해가 되지 않았던 기억이 난다. 클로저를 제대로 이해하려면 자바스크립트 코어에대한 지식이 적지 않게 필요하기 때문이다. 개인적으로는 자신이 사라지기전까지 스코프의 종결을 미루기에, 바꿔 말하면 자신의 사라지면 자신의 스코프도 종결해 버리기에 Closure(종결) 라고 한때 간단하게 정리 했었다.(뭐 틀린말은 아니...]]>
클로저와 객체 클로저를 처음 접했을때 전혀 이해가 되지 않았던 기억이 난다. 클로저를 제대로 이해하려면 자바스크립트 코어에대한 지식이 적지 않게 필요하기 때문이다. 개인적으로는 자신이 사라지기전까지 스코프의 종결을 미루기에, 바꿔 말하면 자신의 사라지면 자신의 스코프도 종결해 버리기에 Closure(종결) 라고 한때 간단하게 정리 했었다.(뭐 틀린말은 아니...]]> https://blog.shiren.dev/ko/post/2016-03-23 https://blog.shiren.dev/ko/post/2016-03-23 Wed, 23 Mar 2016 01:07:08 GMT
시작하면서 꼭 프론트엔드 개발자가 아니더라도 웹 개발을 하다 보면 한 번쯤은 크롬 개발자 도구를 사용해 봤을 거라 생각한다. 크롬이 버전업할수록 크롬 개발자 도구 역시 나날이 발전해 왔고 현존하는 도구 중에는 최고의 웹 개발자 도구라고 말할 수 있다. 예전 IE6에서 alert과 status로 디버깅을 했던 시절을 생각하면 정말 좋은 세상에 살고 있다는 생...]]>
시작하면서 꼭 프론트엔드 개발자가 아니더라도 웹 개발을 하다 보면 한 번쯤은 크롬 개발자 도구를 사용해 봤을 거라 생각한다. 크롬이 버전업할수록 크롬 개발자 도구 역시 나날이 발전해 왔고 현존하는 도구 중에는 최고의 웹 개발자 도구라고 말할 수 있다. 예전 IE6에서 alert과 status로 디버깅을 했던 시절을 생각하면 정말 좋은 세상에 살고 있다는 생...]]> https://blog.shiren.dev/ko/post/2016-02-18 https://blog.shiren.dev/ko/post/2016-02-18 Thu, 18 Feb 2016 01:07:08 GMT
원문 https://medium.com/developers-writing/how-to-get-a-performance-boost-using-node-js-native-addons-fd3a24719c85#.buw8o2rrn 아마도 천 번 정도는 들어봤을 법한 Node.js(이하 노드)의 네이티브 모듈에 대해 그것이 무엇이고 왜 고려되어야 할지 다뤄본다....]]>
원문 https://medium.com/developers-writing/how-to-get-a-performance-boost-using-node-js-native-addons-fd3a24719c85#.buw8o2rrn 아마도 천 번 정도는 들어봤을 법한 Node.js(이하 노드)의 네이티브 모듈에 대해 그것이 무엇이고 왜 고려되어야 할지 다뤄본다....]]> https://blog.shiren.dev/ko/post/2016-02-15 https://blog.shiren.dev/ko/post/2016-02-15 Mon, 15 Feb 2016 01:07:08 GMT
디펜던시 모듈 관리 기존의 프론트엔드 자바스크립트는 특별히 모듈화나 디펜던시관리에 대한 방법이 없어 필요한 자바스크립트 파일을 정해진 순서에 맞게 직접 스크립트 태그로 로드하고 각각 약속된 네임스페이스에 담아 공유했었다. 이런 방식은 프로젝트가 커질수록 그리고 참여 개발자가 많을수록 문제를 일으켰다. 이후 개발자들에 의해 AMD와 CommonJS 두가지 방...]]>
디펜던시 모듈 관리 기존의 프론트엔드 자바스크립트는 특별히 모듈화나 디펜던시관리에 대한 방법이 없어 필요한 자바스크립트 파일을 정해진 순서에 맞게 직접 스크립트 태그로 로드하고 각각 약속된 네임스페이스에 담아 공유했었다. 이런 방식은 프로젝트가 커질수록 그리고 참여 개발자가 많을수록 문제를 일으켰다. 이후 개발자들에 의해 AMD와 CommonJS 두가지 방...]]> https://blog.shiren.dev/ko/post/2015-10-19 https://blog.shiren.dev/ko/post/2015-10-19 Mon, 19 Oct 2015 01:07:08 GMT
원문 https://code-cartoons.com/a-cartoon-guide-to-flux-6157355ab207#.9nbhrj3of Flux 카툰가이드 플럭스는 현재 웹개발에 대한 토픽들중에 가장 유명하지만 이것을 이해하고 있는 사람은 매우 적다. 본 가이드는 모두가 이해할 수 있도록 도움을 주려 작성되었다. 문제 첫번째로 플럭스가 해결하는 기초적...]]>
원문 https://code-cartoons.com/a-cartoon-guide-to-flux-6157355ab207#.9nbhrj3of Flux 카툰가이드 플럭스는 현재 웹개발에 대한 토픽들중에 가장 유명하지만 이것을 이해하고 있는 사람은 매우 적다. 본 가이드는 모두가 이해할 수 있도록 도움을 주려 작성되었다. 문제 첫번째로 플럭스가 해결하는 기초적...]]> https://blog.shiren.dev/ko/post/2015-09-24 https://blog.shiren.dev/ko/post/2015-09-24 Thu, 24 Sep 2015 01:07:08 GMT
원문 https://medium.com/javascript-scene/what-every-unit-test-needs-f6cd34d9836d 대부분의 개발자들은 어떻게 테스트 해야하는지 모른다. 모든 개발자들을 프로덕션으로 디플로이할 때 발생할 수 있는 결함을 방지하기 위해 유닛 테스트를 해야 한다고 알고 있지만, 대부분의 개발자들은 유닛 테스트의 필수...]]>
원문 https://medium.com/javascript-scene/what-every-unit-test-needs-f6cd34d9836d 대부분의 개발자들은 어떻게 테스트 해야하는지 모른다. 모든 개발자들을 프로덕션으로 디플로이할 때 발생할 수 있는 결함을 방지하기 위해 유닛 테스트를 해야 한다고 알고 있지만, 대부분의 개발자들은 유닛 테스트의 필수...]]> https://blog.shiren.dev/ko/post/2015-08-03 https://blog.shiren.dev/ko/post/2015-08-03 Mon, 03 Aug 2015 04:31:08 GMT
원문 https://medium.com/@kevincennis/currying-in-javascript-c66080543528 자바스크립트에서의 커링 최근 나는 함수형 프로그래밍에 대해 많은 생각을 해왔다. 함수형 프로그래밍은 일종의 커링함수 만들어가는 과정과 같이 재미있는 것이라 생각했다. 커링을 모르는 사람을 위해 설명을 하자면 커링은 n개의 인자를...]]>
원문 https://medium.com/@kevincennis/currying-in-javascript-c66080543528 자바스크립트에서의 커링 최근 나는 함수형 프로그래밍에 대해 많은 생각을 해왔다. 함수형 프로그래밍은 일종의 커링함수 만들어가는 과정과 같이 재미있는 것이라 생각했다. 커링을 모르는 사람을 위해 설명을 하자면 커링은 n개의 인자를...]]> https://blog.shiren.dev/ko/post/2015-06-23 https://blog.shiren.dev/ko/post/2015-06-23 Tue, 23 Jun 2015 05:50:00 GMT
How to Use ES6 for Isomorphic JavaScript Apps 원문 http://medium.com/javascript-scene/how-to-use-es6-for-isomorphic-javascript-apps-2a9c3abe5ea2 이런 저런 소란은 이제 조금 정리됐고, 나는 결국 프로덕션 앱에 ES6를 사용하기 시작했다. 그리...]]>
How to Use ES6 for Isomorphic JavaScript Apps 원문 http://medium.com/javascript-scene/how-to-use-es6-for-isomorphic-javascript-apps-2a9c3abe5ea2 이런 저런 소란은 이제 조금 정리됐고, 나는 결국 프로덕션 앱에 ES6를 사용하기 시작했다. 그리...]]> https://blog.shiren.dev/ko/post/2015-06-01 https://blog.shiren.dev/ko/post/2015-06-01 Mon, 01 Jun 2015 02:50:00 GMT
Reactive MVC and the Vitual DOM by Andre Medeiros http://futurice.com/blog/reactive-mvc-and-the-virtual-dom 웹 프론트 엔드 씬에는 수많은 새로운 프레임웍과 작업 방식들이 나타났었다. 어느 때보다 빠르게 소프트웨어는 레거시화 되었고, 이게 사실 좀 짜증 난다. 그러나...]]>
Reactive MVC and the Vitual DOM by Andre Medeiros http://futurice.com/blog/reactive-mvc-and-the-virtual-dom 웹 프론트 엔드 씬에는 수많은 새로운 프레임웍과 작업 방식들이 나타났었다. 어느 때보다 빠르게 소프트웨어는 레거시화 되었고, 이게 사실 좀 짜증 난다. 그러나...]]> https://blog.shiren.dev/ko/post/2015-05-06 https://blog.shiren.dev/ko/post/2015-05-06 Wed, 06 May 2015 03:31:08 GMT
내용상 중요하지 않은 부분은 생략했습니다. 오역에 대한 제보 언제든지 환영합니다. Common Misconceptions About Inheritance in JavaScript by Eric Elliott 자바스크립트 상속에 대한 일반적인 오해들 원문 https://medium.com/javascript-scene/common-misconception...]]>
내용상 중요하지 않은 부분은 생략했습니다. 오역에 대한 제보 언제든지 환영합니다. Common Misconceptions About Inheritance in JavaScript by Eric Elliott 자바스크립트 상속에 대한 일반적인 오해들 원문 https://medium.com/javascript-scene/common-misconception...]]> https://blog.shiren.dev/ko/post/2015-02-22 https://blog.shiren.dev/ko/post/2015-02-22 Sun, 22 Feb 2015 06:07:08 GMT
2025-02 Updated: Next.js를 사용해 재개발했습니다. 2020-08 Updated: 현재 블로그는 지킬을 버리고 gatsby 를 이용해서 직접 개발한 블로그로 2020년 8월부터 배포했습니다. Github덕에 정말 간편하고 아무걱정없이 블로그를 만들수가 있구나.. Node.js를 애정하는 관계로 Hexo와 고민하다가 결국 Jekyll...]]>
2025-02 Updated: Next.js를 사용해 재개발했습니다. 2020-08 Updated: 현재 블로그는 지킬을 버리고 gatsby 를 이용해서 직접 개발한 블로그로 2020년 8월부터 배포했습니다. Github덕에 정말 간편하고 아무걱정없이 블로그를 만들수가 있구나.. Node.js를 애정하는 관계로 Hexo와 고민하다가 결국 Jekyll...]]>