처음 사용자와 만나다
개발을 처음 시작했을 때, 가장 인상 깊었던 순간은 hello world 를 화면에 출력하고, 로컬 환경에서 localhost:3000 으로 웹사이트를 띄웠던 경험이었습니다. 내가 작성한 코드가 눈앞에서 구현되는 것만으로도 큰 성취감을 느꼈고, 그 과정 자체가 너무 신기하게 느껴졌습니다.
하지만 로컬 환경에서의 결과물은 나만 볼 수 있는 사이트일 뿐, 개발의 진정한 목적을 달성할 수는 없었습니다. 제가 생각한 개발의 목적은 세상의 문제를 해결하고, 그것을 사용해줄 유저들이 있어야 비로소 완성된다고 생각합니다.
그렇게 처음으로 '배포'라는 과정을 경험하게 되었습니다. 당시 React를 사용해 간단한 프로젝트를 진행하며 공부하자는 목표로 시작한 프로젝트였기 때문에, 완성도도 낮고 도메인적으로도 일반 사용자들이 필요로 하는 사이트는 아니었습니다. 그래서 단순히 "배포를 해봤다"는 경험으로만 남았습니다.
하지만 두 번째 프로젝트는 달랐습니다. 유저 친화적인 맛집 기반 커뮤니티 사이트를 개발했고, 이를 주변 지인들에게 사용해 달라고 부탁했을 때, 예상보다 많은 친구들이 적극적으로 피드백을 주었고, 덕분에 프로젝트는 더 발전할 수 있었습니다. 처음 hello world 를 출력했을 때와는 또 다른 차원의 즐거움을 느꼈는데요. 실시간으로 사용자가 내 사이트에 접속하고, 그들의 행동이 데이터로 기록되는 과정을 경험하는 것은 매우 흥미롭고 보람찬 일이었습니다😆
하지만 즐거움도 잠시, 다양한 이슈들을 마주하게 되었습니다...
크로스 브라우징 이슈
한 친구로부터 사이트에 접속이 되지 않는다는 연락을 받았습니다. 새로고침을 해도, 기다려도 로딩만 돌고 사이트가 열리지 않는다는 것이었습니다. 사이트가 아예 접속되지 않는 문제라니, 너무 당황스러웠습니다. 문제를 해결하기 위해 친구에게 여러 가지를 확인해 달라고 요청했지만, 친구는 개발자가 아닌 일반 사용자로 개발자 도구나 디버깅 과정을 모르는 것이 당연했기에, 하나하나 설명하며 문제를 함께 확인해 나갈 수밖에 없었습니다.
30분 이상 연락을 주고받으며 결국 문제의 원인을 파악할 수 있었습니다. 친구는 Safari 브라우저(버전 13.1.2)에서 접속하고 있었습니다. 저도 Safari로 사이트에 접속해 봤지만, 제 환경에서는 잘 작동했기에 버전 문제인가? 하는 의심이 들었습니다. 그래서 브라우저 테스트 툴을 사용해 다양한 Safari 버전을 테스트해보니 Safari 14 버전 이하에서는 사이트가 제대로 작동하지 않는 문제를 발견했습니다. 따라서 당시 친구가 사용하던 Safari 13 버전에서는 일부 기능이 정상적으로 동작하지 않았던 것입니다.
크로스 브라우징 관련 이슈와 구체적인 해결 방법은 별도의 블로그 글로 다룰 예정으로 여기서는 다루지 않겠습니다. 하지만 이번 경험을 통해 많은 것을 배우게 되었습니다.
에러 로깅의 필요성을 절감하다
위와 같은 상황에서 친구였기에 하나하나 물어가며 문제를 파악할 수 있었지만, 일반 사용자였다면 어땠을까요..?
사용자와 직접 전화하며 확인할 수도 없고, 사용자가 불편함을 느끼고도 문제를 알리지 않은 채 사이트를 떠났다면, 그 문제를 발견하기까지 굉장히 오랜 시간이 걸렸을 것입니다. 막상 사용자가 문제를 제보했다고 해도 문제를 재현하고 원인을 찾는데 많은 시간이 소요됐을 것입니다. 이러한 경험을 통해 에러 로깅의 중요성을 절실히 깨달았습니다..!
배포된 사이트는 내 손을 떠난 상태이며, 사용자 환경에서 발생하는 다양한 에러를 직접 확인하기는 어렵습니다. 이러한 상황에서 에러 로깅 시스템이 제대로 구축되어 있었다면, 어떤 사용자가 어떤 환경에서 문제를 겪었는지 그리고 어떤 에러가 발생했는지를 바로 확인할 수 있을테고 신속한 대응으로 이어질 수 있었을 것입니다. 이번 문제는 그런 시스템이 구현이 되어 있지 않아 전혀 파악이 되지 않았다는 점입니다.
배운 점과 개선 방향
처음 유저를 만나 내가 만든 서비스를 선보였을 때, 자체적으로 테스트할 때와는 또 다른 여러 상황에서 여러 에러가 발생할 수 있음을 알게 되었습니다. 그럴 때마다 의존할 수 있는 것은 내가 얼마나 에러 핸들링을 잘 해놓았느냐는 점이었습니다. 에러 상황에서 기록을 남기고, 유저에게 최대한 에러임을 인지하지 못하거나 부정적인 인식이 들지 않도록 하는 것이 중요하다는 것을 깨달았습니다.
이번에 그런 부분에서 놓친 점이 있었다는 걸 알게 되었고, 에러 로깅 시스템의 필요성과 중요성을 절감하게 되었습니다. 앞으로는 다음과 같은 점들을 개선할 예정입니다.
-
에러 로깅 시스템 구축: Sentry 와 같은 도구를 사용하여 에러를 실시간으로 추적하고, 대응할 수 있는 시스템을 구축할 것입니다.
-
크로스 브라우징 테스트 강화: 브라우저 호환성 문제를 미리 예측하고 해결하기 위해 다양한 브라우저에서의 테스트를 강화할 예정입니다.
-
사용자 피드백 루프 개선: 기존에는 지인을 중심으로 피드백을 받았다면, 앞으로는 일반 사용자들도 문제를 발견했을 때 쉽게 피드백을 남길 수 있는 시스템을 도입하여, 빠르게 문제를 발견하고 해결할 수 있도록 할 것입니다.
추가 (+이후 프로젝트에 에러 로깅 시스템 도입)
