2020년 1월 돌아보기

제레인트20·2020년 2월 5일
0

2020년 돌아보기

목록 보기
1/4
post-thumbnail

들어가기 전에

처음 회사에 들어와서는 코드에 적응하고 숙달하는 과정을 거쳤고, 동작하는 프로그램을 빠르게 만드는데 집중했습니다. 그 과정 속에서 코딩 속도나 프론트엔드 구조에 대한 이해 등의 성장을 이룰 수 있었습니다.
(말을 순화해서 이정도인겁니다. 진짜 지옥의 행군을 경험했고, 지금도 그걸 해냈다는게 신기할 지경입니다. 동시에 이게 돌아가? 라는 불안감은 항상 마음속 깊은곳에 있는 상태입니다 ㅠㅠ)

그러나, 작년 12월부터 성장이 느려지고 있다는 느낌을 받았습니다.
아무래도 빠르게 많이 만들어야 하는 상황 속에서 충분한 고민을 하지 못한게 아닐까 하는 반성과 함께, 2020년에는 매달 돌아보기를 통해 성장하는 개발자가 되는 기회를 가져볼까 합니다.

프론트엔드 환경 (참고사항)

  • React
  • Redux / Redux-saga
  • Next.js / Now
  • Webpack / Babel
  • styled-jsx

모바일 버전 오픈 & HOTFIX

만들고 있는 웹페이지의 모바일 버전을 오픈하게 되었습니다. 오픈 과정에서 제가 크게 느낀 포인트를 아래 적어보았습니다.

뒤로가기 버튼으로 팝업 닫기

모바일에서는 닫기 버튼보다 뒤로가기 기능이 좀 더 편하기 때문에 사람들이 자주 쓰는 것을 확인했습니다.
유저는 팝업이 떠 있을때 뒤로가기를 눌러서 이전에 본인이 보고있던 페이지로 돌아가길 원했는데, 팝업은 계속 떠있고 팝업 뒷부분의 페이지가 바뀌는 문제가 계속 발생했습니다.

이걸 해결하기 위해 Next.js 에서 제공하는 router.beforePopState 를 사용하였습니다.
JS 에 있는 popState 가 발생하기 전에 router 를 조작할 수 있는 기능이고, 이걸 통해서 팝업이 있을 때 뒤로가기 버튼을 누를 경우 팝업을 닫도록 구현하였습니다.

자세한 내용은 예제와 함께 2월 중 글을 올릴 예정입니다.

덧붙임 1 - Shallow Routing

beforePopstate 를 사용하면 Next.js 에 있는 Shallow Routing 도 원하는 움직임으로 만들 수 있었습니다. 이것도 글을 올릴때 같이 올릴 수 있도록 하겠습니다.

덧붙임 2 - 개발자들의 같은 고민

위 사항이 구현이 끝나고 나서야 저와 비슷한 고민을 한 글을 발견할 수 있었습니다.
보고 나서 2가지 생각이 들었습니다.

  1. 아 내가 먼저 적을껄....(아니 jereint20 네가 감히 어디에 비빌려고 ㅋㅋㅋㅋㅋㅋ)
  2. 역시 사람의 고민은 거기서 거기야

물론 제 글보다 훨씬 더 귀한 정보가 들어있는 글이기 때문에 여기에 같이 링크로 남겨둡니다.

KakaoTalk 공유하기 버튼

카카오톡이 설치되 있는 핸드폰은 정상적으로 동작하는데, 설치가 안된 경우 아무런 동작을 하지 않던 문제가 발생했습니다.

Kakao Developers 에서 관련 기능을 찾고 쉽게 추가할 수 있었습니다.(installTalk: true)

어려운 문제는 아니었지만, 이 문서를 보면서 개발할 때 어디까지 고려해야 하고, 문서를 어떻게 작성해야하는지 고민하는 시간을 가지게 되어 기록으로 남겼습니다.

덧붙임 1 - 작업시 참고했던 링크

Publishing

신규 기능 개발을 위한 준비과정

1월 중순 이후부턴 퍼블리싱 에 집중했습니다. 신규 개발되는 기능의 API 가 나오는 동안 디자인된 화면을 web 으로 구현하는 작업을 했는데, 그동안에는 퍼블리셔에게 의존하던 작업을 직접 하게 되었을때 생기는 고민이 있었습니다.

"내가 어떻게 만들어야 다음 작업자가 API를 연결할때 편할까?"

제가 다니는 회사를 기준으로 이야기를 하겠습니다. 저희는 퍼블리셔가 View 부분을 작업해주고, 그 작업을 프론트엔드가 받아서 API 연결 및 기능 로직을 완성시키는 구조를 가지고 있습니다.

이번엔 틀을 깨고 퍼블리셔는 프론트엔드 작업을 해보고 프론트엔드 개발자도 퍼블리싱을 해보는 좋은 기회를 얻게 되었습니다.

그 과정에서 제가 했던 고민 중 하나를 예를 들어 설명하겠습니다. 이번에 만든 부분 중 데이터의 목록을 보여주는 View 부분을 만드는 과정이 있었습니다. 목록에는 당연히 Filter, page 등의 기능이 나중에 들어올텐데, 프론트엔드 작업자가 API와 연결할 때는 어떻게 작업하실지, 그렇다면 내가 퍼블리싱 작업시에 어떤 부분 혹은 공간까지 만들어서 전달해야 하는지 고민을 많이 하게 되었습니다.

'그냥 만들면 되지, 뭐가 어렵겠어?' 란 생각으로 가볍게 시작했는데, 이번 과정을 통해 협업, 즉 같이 일하는 과정에서 상대를 배려하기 위해서 어떤 생각을 해야하는지 고민하는 좋은 시간이 되었습니다. (중요한건 서로 대화하면서 맞춰나가는게 좋지 않을까 생각하지만, 작업자가 확실히 정해지지 않아 먼저 만들어두고 나중에 작업자에게 설명해야 한다는 점이 좀 아쉬웠습니다.)

Conference 참석

처음으로 Conference 에 참석했습니다. 원체 잘 움직이는 성격이 아니어서 매우 어색하고 어려울까봐 걱정 많이 했는데, 발표자 중 친구가 한명 있어서 조금 편안한 마음으로 참석했고, 발표들도 잘 듣고 왔습니다.
모든 발표가 기억에 남고, 많은 생각을 하게 해주셨지만, 제 1월을 움직이게 해준 발표는 "미생 김재즈 면접본 이야기" 였습니다.

9년차 개발자의 입장에서 미생 이라는 말씀이 어폐가 있다고 생각하면서 듣기 시작했는데,
(사실 전 부럽고 배아프고 그랬습니다. 난 이제 0~1 년 사이를 왔다갔다 하는 개발자인데 부럽다 ㅠㅠ && 아니 오히려 내가 미생이고 저사람은 아닐텐데 왜 저런 단어를 쓰시지! 쳇! 이런 약간 삐딱한 느낌 한스푼 추가)

오히려 듣고 나니 모든 삶 자체가 미생이 아니었나 싶은 생각이 들었습니다.
(삐딱한 느낌을 가진 제가 죄송합니다 ㅠ)

그 발표 덕분에 10년 계획도 세우고, 회고도 쓰고 좋은 영향을 받았다고 생각합니다.

덧붙임 1 - 친구 잘 두어야한다!

대학때 만난 친구인데, 그 친구 덕분에 참 좋은 경험을 했고, 다음에는 저곳에 참여해서 같이 무언가를 이루는 노력을 같이 하고 싶었습니다.
(너무 오랜만에 나 필요할때만 연락해서 미안해! 다음에 꼭 밥 살께)

덧붙임 2 - 제가 참석한 Conference

1월 소감

  1. 기술 공부가 좀 더 필요하다.
    • 잔디콘(Conference) 에 다녀와서 다른분들의 성취를 보고 자극받았습니다.
  2. 영어 공부도 좀 더 필요하다.
    • beforePopstate 를 한번에 검색할 수 있는 영어 실력!
  3. 미래를 그리면서 살자
    • 평생 인생은 미생과 같은것.

개인적인 기록을 위한 글인데, 여기까지 읽어주셔서 감사합니다.

profile
글쓰고 코딩하는 직장인

0개의 댓글