The Lord of React : 리액트 원정대

시작하기 전에

• Code States의 Software Engineering Bootcamp 팀 (이하 SEB) 에서는 특정 학습 컨텐츠나 팀 업무에 필요한 시스템을 단기간에 집중적으로 제작, 업그레이드 하기 위한 소규모 팀, Task Force 를 “원정대” 라는 이름으로 부르고 있습니다.
• 이 글은 SEB 팀에서 React 학습 컨텐츠를 업데이트하기 위한 TF, 즉 “React 원정대”를 마무리 하고 난 후의 회고입니다.
• React 란 Front-end(어플리케이션에서 사용자에게 보여지는 화면) 개발에 사용할 수 있는 여러 “도구” 중의 하나로 이해하시면 됩니다.

Joshua Woroniecki 님의 사진, 출처: Pexels

이 팀은 왜 꾸려졌나요?

React 학습 컨텐츠는 기존의 SEB의 커리큘럼에도 물론 있었습니다. 하지만 우리는 몇 가지 이유에서 “React 원정대”의 결성이 필요하다고 느꼈죠.

• 우선 학습 컨텐츠가 최근 개발 트렌드에 맞추어 업데이트 되어야 한다고 생각했습니다. 업데이트의 주요 골자는 컨텐츠 내용을 Functional Component 위주로 구성하여 “React를 처음 배우는 수강생들이 Functional Component 부터 학습할 수 있도록 하자” 였습니다.
  (React 학습 컨텐츠가 조금 더 요즘 개발 흐름에 맞게 업데이트 되었다! 정도로 이해하시면 됩니다.)

• 또한 우리는 22주간의 코스 기간 내에서 React 를 학습하는 시점을 조금 더 전진 배치하고자 하였는데요, 그러기 위해서는 컨텐츠가 이전보다 친절하고 상세해 질 필요가 있다고 느꼈습니다. 아직 개발 학습을 시작한지 오래되지 않은 수강생들이 React 를 조금 더 친근하게 느끼고 수월하게 학습할 수 있도록 말이죠.

이러한 필요해 의해 React 원정대는 발족되었고, 우리의 원정대 여정은 시작되었습니다.

React 공식 문서를 처음 읽어보면 저 “지구인”의 감정을 이해하게 됩니다. 분명 영어(혹은 한국어)로 되어 있지만, 지구어인듯 지구어 아닌 외계어 같은 생경한 “단어”들 때문이죠.

그래서 어떻게 만들었나요?

(저를 포함하여) 많은 수강생들이 React 를 처음 접하면 ‘익숙해지기’ 까지의 허들이 높다고 느낍니다. 이해하고 받아들여야 할 개념들이 많기 때문이죠. 마찬가지로 우리 또한 이러한 개발 입문자들을 위한 컨텐츠를 만드는 것에 허들을 느꼈습니다.

• 우선 React 공식 문서를 비롯한 다수의 React 입문 학습 자료들은 Classical Component 기반으로 작성되어 있는 반면, (Classical Component란 React 라는 “도구”를 사용하는 과거의 방식 정도로 이해하시면 됩니다. 아! 물론 현재도 여전히 사용하는 방식이기도 합니다.)
• 우리는 앞서 기술한 것과 같이 Functional Component 기반의 컨텐츠를 구성할 예정이었습니다. 따라서 수강생들이 우리의 컨텐츠 만으로도 React에 대해 이해할 만큼 풍부한 구성이 필요했지요.
• 또한 React 가 익숙한 사람 사이에서는 흔하게 사용하는 “단어”이지만,
  입문자는 그 “단어” 자체를 이해하느라 전체 맥락을 놓칠 수 있기 때문에 최대한 이해하기 쉬운 단어로 설명해야 했습니다.
• React 를 사용하다보면 자연히 알게 될 내용과 지금 당장 이해하고 넘어가야 할 내용에 대한 구분도 필요했습니다.

이러한 배경과 고민을 토대로 우리는 이번 원정대에서 중점적으로 다루어야 할 주제를 잡고, 컨텐츠 빌드업을 시작했습니다. 아래와 같은 과정으로 말이죠.

• 우선 이번 컨텐츠를 통해 꼭 학습하고 넘어가야 할 내용들을 Achievement Goal 로 설정하고,
• 각 Goal 을 성취시키기 위해 교수해야 할 내용들에 대한 자료를 수집하였으며,
• 이 자료를 바탕으로 컨텐츠에 넣어야 할 내용을 추리고 학습 진행 순서를 만들었습니다.
• 이렇게 자료와 학습 순서가 결정된 후에는 이를 바탕으로 각각의 레슨과 실습 예제, 최종적으로 Sprint 라고 부르는 학습 과제를 만들었습니다.

Sayantan Kundu 님의 사진, 출처: Pexels

결과는 어땠나요?

이 여정을 한 문장으로 표현하자면 “고객과 Product에 대해 이렇게 깊이 고민해 본 적이 있었나” 하는 시간들이었습니다.

우리가 만드는 학습 컨텐츠가 곧 Code States 라는 기업의 Product 가 되는 것이기 때문에 무엇하나 허투루 넘길 수 없었고요, 나의 학습을 위한 것이 아닌 수강생의 학습을 위한, 즉 고객을 위한 컨텐츠이기 때문에 단어 하나의 선택도 신중해야 했습니다. 따라서

• 기술적인 이견이 없어야 했기 때문에 혹여나 다른 해석의 여지가 있을 만한 단어인지 다시 한번 생각해 보아야 했고,
• 스스로 이해하고 있다고 생각하는 부분이 100% 확실한지 다시 한번 검증하는 과정이 필요했습니다.
• 또한 입문자의 눈높이에 맞추어야 했기 때문에 어려운 기술적인 용어는 배제하면서 알기 쉽게 작성해야 했지요.
• 심미적인 부분도 중요하기에 레슨에 필요한 이미지, 슬라이드 구성, 텍스트의 배치도 고민해야 했습니다.
• 문맥과 맞춤법은 너무나도 당연하고요.

더불어 이 글을 쓰는 저 또한 Code States 의 크루로 합류하기 이전에는 SEB의 수강생이었습니다. 따라서 수강생 시절에 모르거나 어렵게 느꼈던 부분들을 이번 컨텐츠를 소비하는 수강생들은 쉽게, 중요한 부분을 놓치는 일 없이 학습하도록 만들고 싶었죠.

Code States 를 통해 커리어 전환을 하기 전에는 의류를 수출하는 회사에서 근무했었고, 그 곳의 저에게 있어 “고객”은 저 멀리 북아메리카 대륙에 있는 “바이어”, “Product”는 바다 건너 베트남이나 인도네시아의 공장에서 생산되는 “Garments” 일 뿐이었습니다. 부끄럽지만 물리적 거리를 핑계 삼아 고객과 Product 에 대해 깊게 생각해 본 적이 없네요. 그저 “고객은 상사들이 상대하는 분들이고, Product 는 공장장님이 알아서 해 주시는 것” 이라 생각했습니다. 하지만 이번 과정에서는 고객과 Product를 대하는 자세가 조금, 사실 많이 달랐습니다.

내가 만든 Product 가 즉각적으로 수강생들에 의해 소비(학습)될 것이라는 생각에 Product 와 고객 입장이라는 흔한 수식어가 정말 실감나게 다가왔습니다.

게다가 대단한 선배는 아니지만 후배 수강생들은 React 를 조금 더 쉽고 재미있게 학습했으면 좋겠다는 생각도 있었지요.

최대한 완성도 있게 만들고 싶었고 그러기 위해 노력했지만 첫 술에 배부를 수는 없겠지요. 그래도 무사히 원정대 업무는 마무리되었고, 컨텐츠는 수강생들에게 배포되었습니다. 물론 배포가 되었다고 해서 끝이 아닌 만큼 My precious — React 컨텐츠의 개선을 위해, 더 나은 컨텐츠 제작을 위해 “Product 와 고객에 대해 다시 고민해 보아야겠습니다.”