2018년 회고 | YUNHEUR BLOG

2018년 "블로그를 시작해야지"라는 생각을 하고 블로그 개발을 시작했는데, 생각보다 늦어져서 2019년이 코 앞까지 다가왔다. 남은 기능은 천천히 개발하기로 하고, 새해가 되기 전 2018년을 돌아보는 것으로 첫 포스팅을 시작하려고 한다.

웹 개발 시작

2017년 취업 준비를 하면서 하고 싶은 개발 분야가 생겼다. 지금까지 제대로 해본 적이 없는 웹 개발 분야였다. "왜 이때 하고 싶은 분야가 생기는 거야"라는 아쉬움은 "웹 개발을 하는 회사에 어떻게 취업하지?"라는 걱정을 하게 했다. 다행히도 짧은 시간에 사이냅소프트라는 회사에 입사하게 되었고, 웹 개발을 시작할 수 있었다.

배속받은 팀은 프론트앤드와 백앤드 개발을 둘 다 하는 팀이었다. 둘 다 개발한다는 이야기를 듣고 개인적으로 기뻤다. 호의적인 팀장님과 팀원분들 덕분에 팀에도 빠르게 녹아들 수 있었다.

웹서버는 스프링 프레임워크를 사용하기 때문에, 수습 기간 동안 스프링 프레임워크를 사용한 웹 애플리케이션 개발 과제를 줬다. 자바 웹 개발 워크북이라는 책을 사전에 완독하면서 예제를 따라 해본 덕분에, 정해진 기한 내에 개발할 수 있었고 HTTP와 웹 애플리케이션에 대해 조금은 이해할 수 있었다.

업무를 하면서 학습해야 할 것들을 하나씩 스택에 쌓다 보니 성장하고 싶은 열망만으로 2018년에 모두 할 수 없다는 것을 느꼈다. 마침 시작하게 된 업무가 웹 프론트앤드 신제품 개발이었고, 블로그 개발이라는 개인 목표를 설정하면서 2018년은 프론트앤드에 집중하기로 했다.

프론트앤드 개발을 하면서 가장 어려웠던 것은 CSS였다. 수많은 CSS 속성과 레이어에 대한 부족한 이해도는 막연함을 느끼게 해주었다. YouTube에서 코드 스피츠 CSS Rendering 강의를 듣고 이것저것 CSS 속성을 건드려 보면서 시행착오를 겪은 후에야 의도한 대로 CSS를 조작할 수 있었고 어느 정도 두려움이 사라졌다. 그 외에 크로스 브라우징을 하면서 IE와 모바일 사파리 때문에 깊은 분노를 느끼기도 했다.

스터디

프론트앤드에 흥미를 느끼고 있을 때 마음이 맞는 다른 팀 개발자분을 만났고 2명이서 스터디를 시작했다.

첫 번째 주제 : 리액트

리액트의 인기가 높아지고 있어 리액트를 다루는 기술이라는 책으로 스터디를 진행했다. 컴포넌트 개발의 용이함과 Virtual DOM, JSX 문법이 인상 깊었고 Javascript의 ES6 문법을 덤으로 익힐 수 있었다. 특히 BEM 방법론을 적용해서 웹 프론트앤드 신제품을 개발하고 있었는데, 컴포넌트 개발에 대한 이해도를 높이는 데 도움이 되었다.

두 번째 주제 : BEM 방법론을 적용해서 MDN 웹페이지 만들기

CSS와 BEM 방법론에 대해 이해도를 조금 더 높이기 위해 MDN 문서 중 한 페이지를 BEM 방법론을 적용해서 만들어보기로 했다.
UI에서 문맥상 독립적으로 존재할 수 있는 블록을 구분하는 게 처음에는 쉽지 않았다. "재사용을 할 수 있는가?"라는 측면으로 구분을 하려고 하니 어려웠는데 "이게 나중에 재사용을 할 수 있으려나?"라는 의문이 계속 들었기 때문이다. "UI에서 독립적인 이름을 가질 수 있고, 개발자들과 나누어서 개발해도 문제가 없는가?"라는 측면으로 생각하니 조금은 더 쉽게 구분할 수 있었다.
작은 컴포넌트(블록)별로 하나씩 개발하니 하나의 웹 페이지를 조립하는 것은 배치만 신경 쓰면 돼서 쉽고 빠르게 완성할 수 있었다. BEM 방법론의 조금은 괴상한 명명법을 적용하면서 작은 컴포넌트가 큰 컴포넌트의 요소가 될 때 영향을 미치 않도록 주의를 해야 함을 느꼈다.
리액트, 뷰와 같은 라이브러리 또는 프레임워크를 사용하지 않는다면 BEM 방법론을 활용하는 것도 좋은 방안이라 생각이 든다.
독립적인 컴포넌트들 : https://yunheur.gitlab.io/toy-bem-style-mdn/anatomy.html
조립된 웹 페이지 : https://yunheur.gitlab.io/toy-bem-style-mdn/index.html

세 번째 주제 : 디자인 패턴

유튜브에서 코드 스피츠 CSS 수업 영상을 본 후 한 번씩 코드 스피츠 블로그에 방문했었다 어느 날 수업 모집 공고가 뜬 것을 확인하고 스터디원분을 설득해서 함께 신청하고 수업을 들었다.
모든 프로그램은 변한다는 불변의 원칙하에 실무에서의 복잡한 프로그램도 나중에는 수정하고 확장을 하게 될 것이다.
이 수업은 강사님께서 상황에 따라 어떻게 객체의 역할을 구분하고 격리하는지 실무적으로 지식과 경험을 공유해 주셨고, 수강생들이 스스로 문제를 해결할 수 있도록 기반을 만들어주기 위해 노력해주셔서 감사함을 느꼈다. 단순하게 돌아가는 프로그램을 만드는 것에서 만족해하지 말고, 언제든 프로그램은 변화한다는 것을 고려해서 매번 고민하고 개발해야겠다는 생각을 가지게 되었고 마인드 업을 많이 할 수 있었다.
매 수업이 끝나고 받은 감동을 스터디원분과 맥주 한 잔씩 하며 공유했는데 그립다 (먹태가 그리운건…)

네번째 주제 : 블로그 개발

리액트를 조금 더 다뤄 보고 싶어서 리액트 기반의 정적 페이지 생성기인 Gatsby를 사용해 블로그를 개발했다.
잘 작성된 Gatsby 문서와 많은 Starter 프로젝트들 덕분에 구조나 사용법을 익히는 것은 어렵지 않았다.
어려움은 UI 디자인이었다. 디바이스의 화면 크기에 따라 단순하지만 사용하기 편한 UI를 고민하는 게 쉽지 않았다. 잘 만들어진 블로그나 웹 페이지들을 참고할수록 선택 장애가 오는 것을 느꼈다. 제일 빠른 방법은 원하는 UI를 배치해보는 것이라 생각했고, Adobe XD를 사용해 배치해보면서 원하는 UI를 찾을 수 있었다.
아직 남은 기능들(검색 기능, 목차 등)이 남았지만, 조금씩 추가하고 유지보수하면서 다듬어 나가야겠다.

컨퍼런스

올해는 DEVIEW 2018 1일 차 하나만 참석을 했다. 프론트앤드에 관심이 생긴 지 얼마 안 되었을 때인데 다루는 세션이 많아서 재밌게 들었다. 내년에는 조금 더 많은 컨퍼런스에 참여해봐야겠다. 지방에서 서울로 올라오니 좋은 듯

올해 조금이라도 알게된 것들

CSS, SCSS : 원하는 웹페이지를 스타일링 하거나 다른 사람들이 작성한 것을 수정할 수 있게 되었다 (처음에는 수정하는 것이 두려웠는데..ㅠ 이젠 괜찮아 진듯)
Javascript : 처음에 프로토타입 기반의 언어가 익숙지 않아서 이 언어를 좋아할 수 있을까? 싶었지만 곧 최애 언어가 되었다. 인사이드 자바스크립트 책이 이해하는 데 많은 도움이 되었다.
Typescript : 사용은 하고 있지만, 아직 잘 몰라서 문서를 읽어봐야겠다.
Webpack : 빌드 환경 구축은 할 수 있지만, 충분히 이해하지 못해서 문서를 계속 읽어봐야겠다.
Gatsby : 블로그를 개발하면서 어느 정도 친해진 것 같다.
React + Redux : 리액트를 다루는 기술의 예제와 블로그를 개발하면서 쪼오금 알게 된 것 같다.
Spring Framework : 아직 친해지기에 멀었다. 소스코드를 추가하거나 수정하는 것은 어렵지 않지만 어떻게 동작하는지 추상적으로 알고 있어서 내년에 제대로 공부해봐야겠다.
Docker : 도커를 이용해서 Confluence + Jira 환경 구축이나 배포 환경 구축을 해보면서 조금씩 익숙해졌지만, 아직 자동화를 할 때 사용해본 적이 없어 내년에 다양하게 활용해봐야겠다.
Adobe XD : UI 프로토타입을 만들기 위해 활용해 보았는데 단순한 기능 덕분에 쉽게 적응해서 사용할 수 있었다.

행복을 찾아서

통기타 : 입사 후 상무님께서 몇 달간 매주 한 번씩 통기타 수업을 해주셨는데 기본적인 것들을 차근차근 알려주셔서 혼자 연습하면서 몰랐던 것을 많이 배울 수 있었다. 수업이 끝나고 꾸준히 연습해야 한다는 열정은 조금 바빠지니 식어버렸고 통기타 위에 먼저가 쌓여버렸다..ㅠ
건강플랜 소모임 : 한 달마다 하나씩 건강과 관련된 체험을 하는 소모임에 참여했는데 남산 봄꽃 놀이, 가평 수상 레저, 한강 나이트 카약, 경복궁 야간 관람, 실탄 사격 등 다양한 체험을 할 수 있어서 행복했다.
따릉이: 서울에 살게 되면서 가장 마음에 들었던 건 따릉이인데, 집 근처에서 따릉이 자전거를 빌려 한강까지 천천히 타고 가면서 주변 구경을 하는 것에 소소한 행복을 많이 맛보았다.
UMF 2018 : 체인스모커즈 라이브를 직접 듣게 되다니..ㅠ 너무 행복했다.
보령 머드 축제 : 꿀잼..!
하노이 : 처음으로 가족들과 해외여행을 갔다. 6개월 동안 해외여행을 한 경험 덕분인지 편하게 계획을 짜고 가족들이 원하는 것들을 모두 반영해서 가이드를 할 수 있었다. 부모님이 앞으로도 가이드를 잘 부탁한다고 하셨다. 장안과 하롱베이의 아름다운 풍경이 아직 아른거린다.
더 적다보면 술술술 밖에 없을 꺼 같아 생략스.. 술이 싫다...

내년에 할 것들

블로그 포스팅 꾸준히 하기
다양한 컨퍼런스 참여하기
커뮤니티 활동하기
사용하는 기술에 대해 조금 더 깊게 학습하기
1일 1커밋하기
컨트리뷰트 하기
그림 배우기
소확행 찾기

Bye 2018

2018년은 1년차 개발자로서 모르는 것을 하나하나 익혀가면서 웹개발이 무엇인지 알아가고 성장하기위해 노력한 한 해였다. 성장하고 싶다는 열정이 식지 않도록 잘 유지해가면서 2019년에도 즐겁게 달려봐야겠다 :-)