deathnote.gg 서비스 개발기 ( 2 )

 

그동안의 이야기..

오랜만에 글을 작성합니다.

 

그동안 많은 일이 있었습니다. 작년 12월 왼손잡이들을 포기하고, 개발자로의 꿈을 다시 한 번 품어보면서 앞으로 어떻게 살아가야할지 

많은 고민을 했던 것 같습니다.

 

그러던 와중 백엔드 개발자로서의 꿈을 갖게 되고, 부족한 컴퓨터 공학 기본 지식을 다시 복습하고, 코딩 테스트 준비와 더불어 이제는 더이상 아마추어 개발자가 아닌 프로 개발자가 되기 위한 공부들을 하게 되었습니다. 그러던 중에, 좋은 기회들을 맞게 되었고 탄력이 붙어 몇 달 동안은 하루에 자는 시간(3시간 정도)외에는 맥북 앞에 앉아서 모든 지식을 습득하겠다는 마음으로 처절하게 매달렸던 것 같습니다.

 

결국 좋은 기회를 성공으로 만들어내지는 못했지만, 그래도 덕분에 서버 개발과 더불어, CS지식, PS ( Problem Solving) 스킬 등의 실력을 한단계 업그레이드 할 수 있었던 것 같습니다.

 

그동안은, 그저 사용자가 좋아할만한 서비스를 만드는 것이 개발의 첫 번째 이유였다면, 최근부터는 코드의 퀄리티, 가독성 그리고 큰 규모의 사용자가 있더라도 , 안정적으로 돌아갈 수 있는 서버를 개발하는 개발자가 되는 것이 첫 번째 목표로 변하게 되었습니다.

 

예전에는 서비스를 개발한 다음에 운영을 하는 것이 더 재밌었다면, 지금은 개발하는 과정이 가장 재밌습니다. 백엔드 개발은 파면 팔수록 더욱 더 재밌어지는 것 같습니다 ㅎㅎ

 

서론이 길었군요. 야심차게 개발 중인 Deathnote.gg 개발기 그 두 번째 이야기, 지금부터 시작해보도록 하겠습니다!

 

 

1. 전반적으로 갈아엎은 디자인!

맨 위에 있는 사진이 데스노트의 첫 번째 디자인이었습니다. 하지만, 이는 예전에 너무 급하게 디자인한 결과물이었기도 하고 주변 사람들의 피드백이 좋지 않아 전체적으로 갈아엎기로 결정하고 프론트 단에서 모바일 적응형 웹으로 잘 작동할 수 있도록 CSS 코드를 시원하게 갈아 엎는 과정을 진행하였습니다.

 

새로운 디자인의 메인 화면

원래 검은색과 흰색만으로 서비스를 디자인하려 했지만, 역시 어느 순간 한계에 부딪혔고, 여러 좋은 샘플들을 뒤지면서 검은색과 잘 어울리는 컬러를 찾았고, 적용했습니다. 메인 화면 뿐 아니라, 유저를 검색하고 들어간 화면이나 Footer, Navigation Bar등을 모두 디자인하고, 추가하였습니다

 

 

2. 새로운 기능들!

 

검색어 자동 완성 기능

검색어 자동 완성 기능

새롭게 추가된 기능으로는 일단 첫 번째! 검색어 자동 완성 기능입니다!! 원래는 브라우저 캐시를 통해서만 간단하게 최근 검색 기록을 보여주고 있었지만, 검색어 자동 완성 기능을 아예 개발하면 UX적으로 사용자의 만족도가 훨씬 올라갈 것이라 판단하여 개발하게 되었습니다.

 

구현은, 백엔드 단에서 검색한 이력이 있는 유저를 DB에 넣고 이를 DB Query와 함께 서비스단에  조금의 알고리즘을 추가하여 구현하였습니다. 이 부분은 추후에 더욱 최적화하려 합니다!

 

Deathnote 랭킹 기능

데스노트 랭킹 화면

데스노트는 트롤( 게임을 의도적으로 망치는 유저)을 찾아내고, 공개적으로 신고하고 이를 모든 유저들이 공유할 수 있도록 하는 것이 가장 근본적인 목표입니다. 따라서, 이를 재미있게 한 눈에 확인할 수 있는 랭킹 기능을 추가하였습니다. 

 

Deathnote 공개 수배 기능

공개 수배 기능

 

메인 화면에 공개 수배 기능을 추가하였습니다. 최근에 신고된 유저를 메인 화면에서 보여줌으로써, 서비스가 살아있는 느낌을 주기위해 노력하였습니다. ( 현재는 Mock데이터를 넣어놓아서 페이커 선수 아이디만 올라가 있는 것이니 오해하지 말아주세요 페이커 선수 사랑합니다 ❤️) 이 부분에 대해서는 Up 버튼을 만들어서 실제로 사람들이 공감을 많이 한 유저에 대해서는 Riot ( 롤 개발사 )에 컨택하여 대신 신고를 도와주는 것 까지 진행해보려 합니다.

 

 

 

유저 검색 화면

이 부분이 현재 많은 기능들이 추가되어야 할 부분입니다. 

데스노트 Ver2.0 에서는 유저에 대한 리뷰와 신고를 구분했기 때문에, 이 부분에 대한 명확한 구분이 필요하기 도하고, Deathnote 알고리즘 업데이트와 더불어, 알고리즘 설명 추가 혹은 최근 게임 분석 정보 ( 이미 구현은 완료되어있습니다. ) 를 새롭게 추가해야 하는 상황입니다.

 

백엔드 개발은 완료되었지만, 아직 시간이 부족하여 프론트 단 개발을 완료하지 못한 부분이 많은 상황입니다😢 함께 하고 싶으신 프론트 개발자 분 꼭 연락주세요!!!!

 

 

아직 갈 길이 멀다!! 😢

항상 테스트 주도적으로 개발을 하고 싶지만, 개인 프로젝트에서, 그리고 실제로 유저들이 쓰는 서비스를 빠르게 개발하고 테스트 해보려하는 입장에서는 쉽지 않은게 사실입니다... ㅠ 그렇다보니 테스트 코드를 짜는 것이 아직까지도 어색합니다. ㅠㅠ 

실제로 테스트 코드는 해커톤을 할 때나, 혼자서 연습을 하는 프로젝트에서만 작성을 하고 있습니다.. Deathnote.gg 만큼은 철저하게 테스트 코드를 잘 작성해서 새로운 개발자 분과 함께 하거나, 개발 과정에서의 이슈가 최소화 될 수 있도록 하고 싶습니다.

 

 

테스트 뿐아니라, 기능적인 측면이나 효율성 측면에서도 아직 부족한 점들이 많이 보이는 게 사실입니다. 일단 Riot API를 통해서 조회할 수 있는 Limit이 너무 낮은 상황이라 계속해서 Riot에 컨택을 하고 있기도 하고, 기존에 배포한 기능들에서도 버그들이 조금씩 발견되고 있는 상황입니다..! 

 

취준을 하고 있어서 프로젝트에 집중하기가 쉽지는 않지만, 틈틈히 최대한 열심히 개발해서 LOL 게시판에 당당히 홍보해보는 날을 앞당겨 보도록 노력하겠습니다!!

 

 

벌써 유저가 조금씩 늘고 있다!! 🚌

롤링페이퍼 때처럼 극적인 상승은 아니지만, 그래도 SEO 작업을 진행하고 나니 조금씩 유저가 들어오고 있는 상황입니다. 새롭게 연애를 시작하는 것과 같은 설레는 마음을 오랜만에 느껴보니 행복하네요ㅎㅎ

 

 

 

함께 하고 싶으신 분은 연락주세요🙋‍♂️

원래는 혼자서 개발을 진행했었지만, 개발량이 많아짐에 따라 잠시 머신러닝 개발자를 초빙하기도 했었고 현재는 백엔드 개발자 한 분을 구해서 두 명이서 개발을 진행하고 있습니다. 서버 비용은 제가 개인적으로 부담을 하고 있으니, 혹시 추가적으로 함께 개발해보고 싶으신 분은 댓글로 남겨주시거나, 제 github에 있는 메일 주소로 메일 주시면 감사드리겠습니다!

 

※ Deathnote.gg는 수익성을 목표로 하는 프로젝트가 아닙니다. 순전히 League Of Legends ( LOL )의 트롤들을 찾아내고 신고하여, 클린한 게임 문화를 만들어보고자 하는 목표를 가지고 진행하는 프로젝트입니다! ※

 

모집 

- Front-End 

React, JS 경험이 있으신 분

실제 유저가 있는 서비스를 개발하는 경험을 하고 싶으신 분

 

- UI/UX Designer

실제 유저가 있는 서비스를 디자인하고 싶으신 분 ( 혹은 경험이 있으신 분이면 더 좋습니다! )

 

공통적으로 League Of Legends ( LOL )을 평소에 즐겨하시는 분이라면 더더욱 좋습니다!!

 

 

 

 

https://github.com/dong149/deathnote-api-server

dong149/deathnote-api-server

이는 백엔드 코드 깃허브 주소입니다. 사실, Private로 전환을 할까도 고민을 많이 했지만 유저가 많아지기 전까지는 괜찮을 것 같기도 하고 개인 프로젝트이기 때문에 괜찮다 판단하여, Public으로 열어 놓은 상황입니다. 

 

혹시 코드를 재사용하시려하는 분이 계시다면, Star한 번씩만 부탁드릴게요 ㅎ.ㅎ

 

 

https://deathnote.gg

Deathnote.gg : 롤 전적 및 트롤 검색