한 해를 마무리 하며, “벌써 개발자가 된지 1년이라는 시간이 지났구나” 하는 생각이 들었다. 작년에 워킹홀리데이를 끝내고 다시 돌아와 10월 쯤 취업을 한 후 직업으로 개발을 한지 약 1년이 되었다.

지난 1년을 돌아보니 다양한 경험을 많이 했던 것 같다. SOUNDGYM이라는 서비스를 1년 동안 개발 및 운영해보고, Stack Overflow 점수도 올려보고, React를 직접 하나씩 분석하며 글도 썼다. 처음으로 컨퍼런스(2019 Naver Deview)를 가서 좋은 기술과 문화에 대해 알게된 기회도 얻었다.

호주에서 개발을 시작하다보니 주변에 아는 개발자가 없었는데, 개발자 모임도 나가고, 사이드 프로젝트를 하다 …


작년, 3월 졸업과 함께 떠난 워킹 홀리데이와 함께 개발 공부를 시작했다. Javascript와 HTML, CSS도 모르는 상태로 시작한 내가 10개월이 지나고 보니 어느새, React, React-Native를 통해 웹과 앱을 만들고, Node.js와 Sequelize를 통해 서버를 구현하고 GraphQL-Seoul에 참여하기 시작해 Dooboolab의 해커톡에 참여하고 있다는 것이 새롭게 느껴진다.

처음 개발자로 진로를 정하고, 일을 시작하기 전 6개월은 유튜브와 블로그, 구글링을 통해 혼자 공부했다. 모르는 것이 있으면 오픈채팅에 들어가 질문하는 방식으로 해결했다. 제로초 블로그(조현영님)노마드코더, Evan …


최근 영어 공부의 필요성을 다시 느끼면서 유튜브에 영어 관련 콘텐츠를 찾아보았다. 다양한 콘텐츠들 속에서 우연히 새로운 언어를 배워야 하는 네 가지 이유라는 TED의 강연을 보게되었다

[그림 01] TED 강연 <새로운 언어를 배워야 하는 네 가지 이유> 시간이 괜찮다면 보는 것을 추천한다.

이 강연의 골자는 각 언어에는 그 사회의 구성원이 생각하는 문화가 담겨있고, 그 언어를 배우면서 그 문화를 이해할 수 있다는 것이다. 즉, 새로운 언어를 배우는 과정에서 세상을 이해하는 새로운 관점을 배울 수 있다는 것이다.

최근 <철학은 어떻게 삶의 무기가 되는가?>라는 책을 읽으며 시니피앙(signifiant)과 시니피에(signifié)라는 개념을 알았다. 시니피앙“의미하는 것”이라는 뜻이고, 시니피에“의미되고 있는 것”이라는 …


이 글을 남기는 계기는 Dan Ambramov의 블로그 Overreacted를 보며 React.js에 대해 더 깊이 공부할 필요성을 느꼈기 때문이다.

HTML, CSS, Javascript를 공부하고 바로 React를 시작했을 때 가장 어려웠던 개념이 ref였다.

당시에는 Javascript를 제대로 이해하고 있지 않아 ref 에 대한 공식문서 설명을 이해하기 보다는 ref 라는 기능을 쓰기에 바빴다.

Ref는 render 메서드에서 생성된 DOM 노드나 React 엘리먼트에 접근하는 방법을 제공합니다.

- React Document(리액트 공식문서)

1년간 실무를 하며 ref 를 자주 사용하며 ref 기능의 다양한 사용 예시를 경 …


이 글을 남기는 계기는 Dan Ambramov의 블로그 Overreacted를 보며 React.js에 대해 더 깊이 공부할 필요성을 느꼈기 때문이다.

지난 글을 쓰고 다음 글감을 고민하던 중 스크롤 이벤트를 처리하면서 debounce와 throttle를 쓰는 경험을 하였다.

이 과정에서 그동안 잘 사용하던 event 객체의 내부 값이 null이 되어 사라지는 문제를 겪었고 그간 아무 생각 없이 사용하던 event.persist()에 대한 궁금증이 생겼다.

이에 대한 원리를 파악하기 위해 React의 이벤트 처리와 합성 이벤트(Synthetic Event) 문서를 읽으며 이벤트 풀링과 합성 이벤트라는 개념에 대해 더 구체적 …


이 글을 남기는 계기는 Dan Ambramov의 블로그 Overreacted를 보며 React.js에 대해 더 깊이 공부할 필요성을 느꼈기 때문이다.

리액트는 기본적으로 데이터를 부모 컴포넌트에서 자식 컴포넌트로 전달하는 단방향 데이터 흐름을 지향한다. 하지만, 컴포넌트를 만들 때 종종 단방향 데이터 흐름보다는 공유되는 데이터 관리가 필요할 때가 있다.

리액트 공식 문서에서는 전체 UI의 테마나 로그인 한 유저 정보 등을 보관할 때 사용한다고 하며 실제로 Context API를 적용한 경우는 현재 SOUNDGYM 앱의 오디오 플레이어 위치를 전역적(Global)으로 관리하기 위해 사용하고 있다.


이 글을 남기는 계기는 Dan Ambramov의 블로그 Overreacted를 보며 React.js에 대해 더 깊이 공부할 필요성을 느꼈기 때문이다.

이번 글은 지난 글을 공부하며 발견한 Functional Component의 코드를 분석하며 React v16.8부터 추가된 React Hooks에 대해 깊이 알아보기 위해 쓰는 글이다.

최근 1년 동안 React를 처음 접하게 되는 사람들은 자연스럽게 React Hooks와 함께 React를 시작하곤 한다. 처음 내가 제로초님의 NodeBird 강의를 들으며 개발을 시작했을 때도 Hooks를 이용해 대부분의 컴포넌트를 만들었다.

1년이 지난 지금useState, useCa …


Do as I say, not as I do

이 글을 남기는 계기는 Dan Ambramov의 블로그 Overreacted를 보며 React.js에 대해 더 깊이 공부할 필요성을 느꼈기 때문이다.

이번 글은 지난 글을 읽고 나에게 피드백을 주신 고마운 분이 알려준 자료를 보고 React의 Update 스케줄링 과정에 대해 알아보는 글이다.

해당 글은 리액트를 처음 접하는 사람이 읽기에 다소 어려울 수 있지만, 나와 같이 리액트를 배우며 “도대체 어떻게 동작하는거야?” 라는 생각이 드는 개발자들에게 도움이 될 것이라 생각한다.

지난 글을 통해 리액트 내부 코드를 열었을 때, ReactDOM.render API가 리액트 컴포넌트 트리를 가지고 렌더링 큐(업데이트 큐)에 …


이 글을 남기는 계기는 Dan Ambramov의 블로그 Overreacted를 보며 React.js에 대해 더 깊이 공부할 필요성을 느꼈기 때문이다.

React에 대한 복습과 조금 더 문서를 꼼꼼히 읽는 과정을 글로 옮기기 위해 글을 쓰다보니 생각보다 많은 부분에 대해 고민하고, 정리하게 되었다.

확실히, 안다고 생각하며 넘어가는 것 보다 내가 이해하고 관찰한 것이 맞는지 글로 남겨보는 것이 중요한 것 같다.

지난 글을 쓰고난 후 React의 어떤 부분을 다시 한번 확인해볼지 고민했다. 최근에 Custom Hooks를 만드는 재미에 빠져서, Hooks에 관련된 글을 쓸까 하다가 아직 Hooks가 내부적으로 어떻게 동작하는 지 …


이 글을 남기는 계기는 Dan Ambramov의 블로그 Overreacted를 보며 React.js에 대해 더 깊이 공부할 필요성을 느꼈기 때문이다.

React.js를 통해 웹 및 앱(RN)을 개발한 일을 한지 약 6개월이 지났다. 지난 6개월 간 GoF Design Pattern도 익히고, 서버리스 솔루션 Firebase에 대해서도 배우며 개발자로 여러가지를 익히는 시간이 되었다.

하지만, 문득 돌이켜보니 React에 대한 깊은 이해가 부족하다는 것을 깨달았다. “React는 Virtual DOM을 사용한다.”, “Hooks를 쓰면 함수형 컴포넌트에서도 state를 쓸 수 있다.”, “Context API를 쓰면 전역적으 …

Stark Jeon

@ React + React Native + Node Service Developer. https://github.com/Jeontaeyun

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store