프로젝트 완성 (느낀점/ 보완해야 할 부분/ 앞으로의 계획)

이 프로젝트를 시작한지 벌써 2달이 지났다. 프로젝트를 처음 기획했던 순간으로부터는 거의 3달 이상. 그 동안, 간단한 웹게임 하나를 만들어보고 싶다는 일념 하에 바쁘게 달려 왔다. 정말, 정말 많은 좌절을 경험한 끝에 마침내, 프로젝트의 마지막을 만날 수 있었다.

 

오늘 두어시간 완성본을 플레이하며 버그 등은 없는지 검토해 보는 시간을 가졌었다. 정말 다행히도 눈에 띄는 버그는 발견되지 않았다. 눈에 띄지 않는 버그들이 코드 안에 잠들어 있지는 않을까 두렵지만, 우선은 오늘 여기까지의 진행과정을 최종본으로 보아도 무방하지 않을까 싶다. 최종 배포 전까지는 아직 시간이 조금 남아 있으니 추가적인 버그는 없는지 계속해서 살펴봐야 할 것 같다.

 

 

내 인생 첫 웹개발 프로젝트인 웹게임 '괴물과 종말의 시간'은 30분 ~ 1시간 가량의 텍스트 기반 게임이다. 개발자인 나 스스로의 기술적 한계와 능력 부족 때문에 최종 완성본은 기획 단계의 그것보다는 훨씬 더 ‘소설’적인 게임이 되어버렸지만 그래도 스스로 웹게임을 개발할 수 있다는 것을 확인할 수 있었던 귀한 시간이었다.

 

이번 작품은 나 스스로 애착을 가지고 만든 작품이었다. 그렇기 때문에 머릿속에 기획했던 많은 것들이 내 기술적 한계로 구현되지 못한 것이 많이 아쉽다. 그러나 나는 꾸준히 성장할 것이라는 사실을 믿기에, 앞으로 나오게 될 ‘괴물과 종말의 시간’의 후속작들은 더욱 만족스러운 작품들이 될 수 있지 않을까 조심스럽게 생각해본다. 내가 성장하는만큼, 내가 만드는 서비스들도 함께 성장해 나갈테지.

 

 

오늘 이 글에서는 우선, 게임의 전반적인 분위기를 아래의 동영상을 통해 가볍게 살펴본 후 내가 프로젝트를 진행하면서 느꼈던 것들, 기술적으로 구현하기 어려웠던 사항들, 앞으로 보완이 필요한 사항들.. 등을 이야기 한 후 글을 마무리짓는 시간을 가져보도록 하겠다.

 

디자인적 감각이 없어 최대한 깔끔하게 ui를 꾸미고자 했다.

 

 

 

개발의도/개발목적

이 프로젝트를 진행하게 된 가장 거시적인 목적은 사실 단순했다. 당시의 내가 웹개발을 공부하고 있었고, 그렇기에 웹개발의 전반적인 프로세스를 이해하고 싶었기 때문이었다. 프론트엔드 그리고 백엔드의 구현을 스스로 해보고 싶었다.

 

당시에는 DB에 대한 생각이 별로 없었기 때문에 자연스럽게 html 등으로 콘텐츠를 정리해 문서로 뷰를 표현하고 자바스크립트로 간단하게 이벤트를 처리할 수 있는 웹게임을 생각하게 되었다. 그리고 추가적으로, TRPG(Tabletop Roll Playing Game: 테이블 위에서 주사위를 가지고 할 수 있는 롤플레잉 게임)에 개인적으로 관심이 많았던 것도 웹게임을 만들기로 결심한 중요한 계기 중 하나로 작용했던 것 같다.

 

 

 

개발하면서 어려웠던 부분

너무 많았다. 진짜, 진짜 너무 많았다. 처음 이 프로젝트를 시작했을 당시 나는 기본적인 html, css, 자바스크립트만 알고 있을 때였다. DOM 요소가 무엇인지, 이벤트를 처리한다는 것이 무슨 의미인지도 모를 때..

 

그래서 처음에는 이벤트를 처리하는 부분에서 많이 애를 먹었다. 애초에 자바스크립트가 그런 것을 할 수 있다는 것도 몰랐기 때문에, 어디에서 어떻게 내가 원하는 기능들을 배우고 구현할 수 있는지, 그런 것을 찾는데 많은 시간을 쓴 것 같다. 결국 자바스크립트에 이벤트를 처리할 수 있는 기능이 있다는 것을 알게 되고, local storage 같은 기능들을 알게 되면서 프로젝트를 조금 조금씩 진행시킬 수 있었다.

 

그렇게 어느정도 html 문서들이 쌓이고 기능들을 구현하는데 성공하자 대망의 서버 문제가 찾아 왔었다. 서버 관련해서는 한동안 ‘와 이래서 개발자들이 머리가 빠지는구나’ 하는 생각이 들 정도로 상당한 스트레스를 받았던 것으로 기억하는데, 결국 거의 한 달간의 삽질을 끝내고 node.js를 통해 로컬서버를 구축할 수 있었다.

 

그 이외로는, (다른 의미로 많이 머리가 아팠던) html에 쓰여지는 문서를 작업하는 일, 전투시스템이나 판정시스템, 선택시스템 같은 기능을 구현하는 로직을 만드는 일, 효율적으로 코드를 작성하고 유지보수하기 쉬운 설계를 하는 고민을 하는 일(결국 실패했다), 프론트엔드 측면에서 사이트 디자인을 하는 일(의외로 가장 어려웠던 부분 중 하나였다) 등등..을 들 수 있을 것 같다.

 

 

 

 

보완해야 할 점

이 부분은 너무나도 명확하다. 내 실력이 부족하다. 끝.

 

..이라고 말하기엔 (사실은 그게 가장 정확한 답변일테지만) 너무나도 추상적이기 때문에..

 

 

 

이번 프로젝트가 가지는 가장 큰 취약점은, 중복되는 코드가 너무너무 많다는 것이다. 이 부분은 내 실력 부족이라고 밖에 할 말이 없는 것이 html 문서를 작업할 당시 나는 pug와 같은 템플릿엔진을 알지 못했기 때문에, 거의 모든 html 문서에 동일한 메뉴바, footer 관련 코드들이 존재한다. 문서를 작업하면서도 ‘아, 이거 나중에 메뉴바나 footer 추가되거나 삭제되는 거 있으면 꽤 골치 아프겠는데..’ 생각했던 기억이 난다.

 

뒤늦게 템플릿 엔진이라는 것을 알게 되었고 html 파일에서도 다른 html 파일을 임포트할 수 있다는 것을 알게 되었지만(조금 찾아본터라 정확하지 않을 수 있다), 그 때는 이미 거의 모든 문서 작업이 끝났을 때였던 터라 대대적으로 문서를 다시 시작할 수 없었다.

 

그리고 이건 이번 프로젝트를 진행하면서 느낀 것 중 하나인데, 다른 프로젝트도 그러한지는 모르겠지만 이번 프로젝트에서는 자바스크립트 코드 내에서 특정 로직이 계속 반복해서 등장하는 경우가 많았다. 다만 완벽하게 동일한 로직이 아니라, 변수명이라던지 약간의 메커니즘들이 미묘하게 다른.. 그런.. 코드..

 

개발 초기에는 이런 코드들을 일종의 모듈로 삼아 코드양을 최소화하고 유지보수를 하기 용이하게 만들기 위해 굉장한 노력을 쏟았지만, 내 실력의 부족을 이기지 못하고 피를 토하며 넘어지고 말았다. 자바에서처럼 특정 기능들을 객체화 해서 접근해보고자 한 것인데, 음.. 쉽지가 않았다. 결국 자바스크립트 코드 내에도, 정말 많은 중복되는 코드들이 존재하게 되었다.

 

결국은, 실제로 서비스될 예정인 웹게임의 실제 콘텐츠에 비해 그 콘텐츠를 받치는 코드의 양이 비정상적일 정도로 많다는 것이 이 프로젝트의 가장 큰 취약점이 아닐까 싶다. 이게 지금 텍스트 기반의 30분 - 1시간 분량의 가벼운 콘텐츠니 망정이지 그래픽도 들어가고, 기능도 다양해지고 플레이타임도 몇 시간 단위가 된다면 코드단에 발생되는 복잡성, 불안정성은 어마어마하게 증가할 것 같다는 생각을 했었다. 유지보수는 불가능할 정도로 어려워질테고, 코드의 확장가능성도 확연히 떨어질테지. (전체 서비스를 효율적으로 운용할 수 있도록 설계하는 부분, 그리고 그 설계를 구현해 낼 수 있는 실력을 갖추는게 앞으로 나에게 당면한 과제가 되지 않을까 싶다.)

 

 

 

프로젝트 진행 간 무엇을 느꼈는지

처음 코딩을 시작했을 때, 콘솔에 hello world를 찍기 위해 10줄도 되지 않는 코드를 작성하면서 만약 실제로 프로젝트를 하게 되면 몇줄 정도의 코드가 필요할까 궁금해 했었던 적이 있었다. 그때는 막연히 ‘100줄은 너무 적겠지..? 그렇다면 1000줄? 와 그건 너무 많은가..?' 이런 생각을 했었는데 그때로서는 1000줄 이상의 코드를 작성한다는 것이 말이 되지 않게 느껴졌었다.

 

 

 

프로젝트를 마치고 나서, 문득 그 때의 생각이 들어서 지금까지 작업한 코드가 몇 줄인지 대강 세어보았다. 중복되는 코드를 모두 제거해도 가볍게 1000줄 이상은 나올 것 같았다. 가능하면 2000줄도 넘을 것 같은데.. 하는 생각도 들었다.

 

문득 과거의 내가 지금 프로젝트의 코드양을 알게 되면 어떤 생각을 할까 궁금해졌다. 아마, 경악하고 기겁하지 않았을까? 그런데 만약 프로젝트 폴더의 구조를 보여주고, 파일들이 어떻게 정돈되어 정리되어 있는지를 보여준다면? 아마 꽤 할 만 하다 생각할지도 모르겠다.

 

 

 

 

과거의 나는 코드의 양이 많아지면서 필연적으로 발생할 수밖에 없는 복잡성과 난해함에 대해 많은 겁을 먹었던 것 같다. 코드가 100줄이 넘어가고, 200줄이 넘어가면 그것들의 관계들을 어떻게 파악하며, 만약 코드 내에서 버그라도 발생하면 어떻게 디버깅을 해야 하는지. 그 때의 나에게 그것은 하나의 공포였었다.

 

그런데 이번 프로젝트를 진행하면서 알게 된 한 가지 분명한 사실은 코드가 늘어난다고 해서 코드의 복잡성과 난해함이 비례해서 증가하지 않을 수도 있다는 것이었다. 설계를 잘 하고, 디버깅 도구를 잘 활용한다면 코드가 1000줄이던, 2000줄이던 크게 문제가 되지는 않는다는 것을 깨달았다. (물론 그만큼 설계를 잘 해야 하겠지만...)

 

 

 

한편으로는, 내가 2달 이상 피땀흘려 작업한 코드로 만든 이 웹게임이 빠르면 30분이면 플레이가 끝날 수 있는 것이라는 것을 알게 되었을 때는 새로운 종류의 공포를 느끼기도 했었다. 이렇게 기능도 빈약하고, 플레이 타임도 짧고, 심지어 디자인도 엄청나게 허접한 이런 프로젝트도 능히 1000줄을 넘길 수 있다면 네이버나 유튜브, 넷플릭스처럼 실제로 서비스되는 전문적인 웹페이지들은 얼마나 거대한 로직들에 의해 구현되었을까 하는 생각을 했었던 계기가 되기도 했다.

 

정리해보자면, 이번 프로젝트는 나에게 "야, 너도 웹페이지 만들 수 있어! 봐봐, 해냈잖아!"와 "아직 갈 길이 멀지? 이제 시작인걸 ^^"을 동시에 말해 준.. 그런 시간이었던 것 같다.

 

 

 

앞으로의 계획

우선은 당분간 공부에 조금 더 집중하고자 한다. 프로젝트를 하면서 참 많은 것을 느꼈다. 그리고 그만큼 궁금한 것, 배우고 싶은 것이 많아졌다. 더 나은 서비스를 생산할 수 있는 개발자가 되기 위해, 그리고 내가 가지고 있는 상상을 현실로 만들 수 있는 그런 개발자가 되기 위해 보다 깊은 공부가 필요한 시점이 아닐까 하는 생각을 하게 되었다.

 

아키텍처에 관해 공부 해보고 싶다는 생각을 하게 되었다. 그러나, 아직은 시기상조라는 생각이 들어 당분간은 알고리즘, 네트워크, 자바, 자바스크립트, 스프링, node.js와 같이 실제 코드 상에 표현될 수 있는 공부를 하고자 한다.

 

한편, 아직 프로젝트가 완전히 끝난 것은 아니기에 (로컬서버를 구현하는데는 성공했지만 실제 서비스까지 약간의 작업이 더 필요하다) 시간을 두고 프로젝트를 지켜보면서 잠재적인 버그 등을 점검하고자 한다. 동시에 AWS 같은 것들을 공부하면서 프로젝트를 실제로 서비스하는 방법을 구체화 해야겠지.

 

 

 

 

음.. 그럼 오늘은 일단 조금 쉬고, 내일부터 다시 새로운 목표와 도전과제를 향해 앞으로 달려가야겠다..!