-
20일동안 한 프로젝트에 매달린 썰Frontend/Projects 2022. 7. 23. 16:05
안다는 것은 아는 것을 안다고 하고 모르는 것을 모른다고 하는 것이다.
- 공자내가 이 프로젝트를 시작하게 된 계기는 바로 나를 위해서였다.
성장을 위해 꾸준히 프론트엔드 공부를 해온 나였지만, 누군가 갑자기 "이게 뭐야?"라고 물어봤을 때 제대로 설명해주기가 쉽지 않았다. 과연 이 상태를 알고 있다고 할 수 있을까? 모르는 것을 알고 있다고 착각했던 건 아닐까?
제대로 설명하고 싶다.
프로젝트를 시작하면서 가장 중요하게 생각했던 포인트는 제대로 된 정보를 전달하는 것이었다. 하지만 제대로 된 정보라는 것은 어떻게 확신할 수 있을까? 이 문제를 해결하기 위해 오랜 고민을 했지만 답은 하나였다. 나 스스로 열심히 공부해서 정보에 대한 확신이 있어야 했다. 그래서 다른 부분 못지않게 컨텐츠를 모으는 데 꽤 많은 시간을 할애했다.
끝까지 마무리하자.
그동안에도 여러 번 혼자 프로젝트를 진행한 적이 있지만 기획을 탄탄하게 세우지 못해 제대로 마무리를 하지 못했던 일이 종종 있었다. 하지만 이번에는 제대로 된 기획을 세워 끝까지 마무리를 해보고 싶었다. 허술하게 시작해서 허겁지겁 끝냈던 그간의 시행착오가 있었기에 제대로 된 기획의 중요성을 절실히 깨달았다.
기획만 일주일이 걸렸다.
사용자들이 원활하게 사용할 수 있는 완성도 있는 서비스를 만들고 싶었다. 나아가, 서비스의 인기가 좋아서 후속 프로젝트로 사업체를 차릴 수 있을 만큼 훌륭한 프로젝트를 만들어보고 싶었다. 완성도 있는 기획을 위해 서비스 개요부터 사용자 분석, 서비스 기능과 구성, 컨텐츠, 비즈니스 모델을 적고 와이어 프레임을 그리면서 나름의 기획을 했다. 내 머릿속에서 돌아가는 서비스는 쾌적하고 원활했다. 프론트엔드 개발 지망생들에게 한 줄기 빛이 되어줄 가이드가 될 것 같았다.
그렇게 꽤나 공들인 기획이 영원할 줄 알았지만.. (이미 저 와이어 프레임도 n번째 수정본)
핑클 - 영원한 사랑 막상 개발을 시작하니
기획의 대부분을 덜어내야 했다. 심지어 기획 의도도 수정했다.
원래 기획 의도는 프론트엔드 스킬 체크 후 프론트엔드 로드맵을 그려 공부의 순서를 가이드 해주고 싶었다.
그러나 개발 공부라는 것은 어떤 순서를 따라 학습하기 보다 원하는 것을 선택해서 학습하는 것이 더 효과적일 것이라고 생각했기 때문에 선택은 학습자의 몫으로 남겨두기로 했다. 그래서 나는 학습의 방향성을 제시하기 보다는 정확한 공부 자료를 제공하는 데 집중했다.
마지막 결과 페이지에서 보여주는 화면도 원래는 점수나 퍼센트로 나타내서 객관적인 지표를 보여주고 싶었다.
하지만 저기 있는 문제를 다 맞힌다고 해서 프론트엔드 개발 이론을 모두 알고 있는 것은 아니고, 어떤 것을 알고, 어떤 것을 모른다 해서 우위를 정할 수는 없었다. 내가 중요하게 생각했던 것은 학습자가 모르는 부분에 대한 제대로 된 정보를 제공하는 것이었기 때문에 결과 페이지에서 점수나 퍼센트 표기 대신 모른다고 답한 개념을 나열하고 관련된 학습 링크를 보여주기로 했다.
그렇게 완성된 나의 사이트
프론트엔드 개발자가 되기까지 얼마나 왔을까?
prismatic-basbousa-64b04e.netlify.app
고도화를 해볼까
SEO 적용을 위해 기존의 소스를 가져다가 next.js + React 조합으로 다시 만들어보려고 했다.
그러나 SEO 적용할 만한 페이지가 첫 페이지밖에 없어서 리소스 낭비라는 결론을 내렸다. (절대 귀찮은 것은 아니고.. 제대로 학습할 수 있는 다른 프로젝트를 기획 중이다.)
결과적으로 현재 사이트는 meta 태그만 적용하기로 했다.
다른 직업군이나 데이터베이스 관련해서 고도화시키고 싶었으나 컨텐츠를 만드는데 공수가 너무 많이 들 것으로 예상되어 일단 여기서 토이 프로젝트를 마치기로 했다.
항상 수많은 고민 끝에 나온 프로젝트를 보면
이렇게 심플한 사이트가 나오다니 또 어디 자랑하긴 어렵겠군..
이라는 생각이 든다. 그래도 공신력 있는 자료를 구하기 위해 mdn 문서, 저명한 블로그 글, 유튜브 검색을 통해 수많은 자료를 비교하고 많은 노력을 기울였다. 이 글의 제목처럼 20일이나 이 프로젝트의 매달린 이유는 절반 이상의 시간을 컨텐츠를 구하는데 소비했기 때문이다. 시간을 들인 만큼의 결과가 여기에 나와 있다고 생각한다.
반응형'Frontend > Projects' 카테고리의 다른 글
[Toy Project 기록하기 2] axios로 HTTP 요청 보내기 (0) 2023.02.19 [Toy Project 기록하기 1] 커뮤니티 사이트 기획하기 (0) 2023.02.05 [프로젝트 셋팅] CRA에 Prettier + ESLint 설정하기 (0) 2022.04.24 나의 Toy Project 이야기 : What I Ate Today (0) 2022.02.09 [JavaScript] To Do List 만들기 - 간단편 (0) 2020.11.21