프로그래밍/Proejct

Project #1. 백호 조기축구회 홈페이지

가라멜 2019. 8. 8. 10:50
반응형

나름 3년간 이런저런 일을 하면서 

이런저런 사이드 프로젝트를 시작했는데, 그나마 완성 직전까지 갔던 프로젝트.

 

1. 목표 

매주 일요일 조기축구회를 나가고 있는데 젊은 피의 유입이 너무 적다. 아직도 내가 10년째 제대로된 막내. 

그간 20대들이 조금씩 거쳐갔지만 정착을 하지 못하였다. 새로 들어오는 친구들도 없고..

그래서

(1) 조기축구회 홈페이지를 만들면 구글링 하다가 하나라도 얻어걸리지 않을까

(2) 조기축구회에 대한 열정이 조금 식고 있는데, 열정을 회복할 기회

(3) 프로축구리그 처럼 우리도 리그전 기록을 세분화 해서 관리하면 좀더 재밌게 찰 수 있지 않을까

(4) nodejs 를 한번 맛보자.

 

가 이번 사이드 프로젝트의 목표였다.

 

2. 기간

 2019.02~2019.03 약 두달

 

3. 사용기술

javascript, nodejs, express, sequelize, jquery, mariaDB, summerNote API, Trello, git(github), semanticUI

 

4. 프로젝트 진행 후기

nodejs 나 express 를 처음 사용해봤다.

스프링을 통한 웹 프로젝트는 아무래도 현재도 하고 있는 일이다 보니 여러번 해봤지만,

요즘 노드js 가 뜨고 있다길래 해보고 싶었다.

사실 react도 붙이고 싶었는데 맘속으로 정한 마감기한(3월)까지 도저히 못할 것 같았다. 

3월인 이유는 뭐 다른것은 없고, 그냥 올해 리그전이 시작하기 전에 홈페이지를 오픈하고 싶었다. 

리그전은 4월 시작.

3월 첫째주에 조기축구회 사람들에게 홈페이지를 만들고 있다고 공지하였고, 

4월 전까지 프로필 정보 및 촬영을 협조받기로 하였는데...

3월 둘째주에 십자인대 파열 부상을 입었다. ㅋㅋㅋㅋㅋㅋㅋㅋㅋ

덕분에 조금이나마 붙잡고 있던 열정이 짜게 식어버렸다.

그 말은 결국 미완성 프로젝트가 되버렸다.

 

5. 프로젝트 총평

http://whitetigerfc.cafe24app.com/

 

http://whitetigerfc.cafe24app.com/

이 홈페이지는 크롬 브라우저에 최적화 되어 있습니다. 크롬을 제외한 다른 브라우저 사용시 컨텐츠가 정상적으로 보이지 않을 수 있습니다. 크롬이 없으신 분은 아래 링크를 통해 다운로드 받은 후 방문해 주세요. 크롬 다운로드

whitetigerfc.cafe24app.com

일단 카페24에서 가장 저렴한 것으로 호스팅을 하여 외부에서도 접속할 수 있도록 하였다.

1년에 5천원 쯤이니 연습용으론 꽤나 만족스러운 가격

전체적인 레이아웃은 맨체스터유나이티드 홈페이지, 전북,수원등 K리그 구단들의 홈페이지들을 참고하였다.

CRUD 기능이야 어느 플랫폼이나 거기서 거기인데다 어려운 SQL문을 요구하지도 않기 때문에 어렵지 않았다.

다만 몇가지 측면에서 약간 어려움을 겪었다.

 

1. 이미지 저장을 어떻게 처리할지

 > 아무래도 DB서버를 사용하는 것도 아닌데다가 500원짜리 호스팅으로는 200MB 정도 밖에 사용하지 못하기 때문에 이미지 처리를 어떻게 할지가 가장 큰 고민이었다. 

 > 컨셉으로는 공지사항 및 게시글에서도 이미지를 넣는 것이 가능해야 했기에.. 

 > 일단 ckeditor 를 사용하고 내장된 이미지 프로세싱을 따라서 처리하려고 했는데 이게 꽤나 애먹였다. 그래서 결국

  summerNote 로 변경! 변경하고 나니 이미지도 DB로 별도의 처리를 거치지 않고도 저장할수 있도록 변환해주어서

 쉽게 해결되었다. 

 > 파일형태로 저장하지 않고 DB에 Byte 형태로 저장하니 용량 문제도 해결! 빠밤

 

2. 화면간 데이터를 어떻게 주고받을 것인지

 > 선수단 ~ 선수상세 정보로 이어지는 흐름에서 정보를 어떻게 보낼지 고민을 많이 했는데..

 > 뭐 어떻게 해야 되는지도 모르겠고 해서 그냥 쿼리스트링으로 날려버림.. 선수 번호가 유니크값이기 때문에 

번호만 날려서 상세정보땐 DB에서 상세정보를 다시 가져오는 것으로 처리했다. 뭐가 효율적인지는 잘 모르겠다.

 

 

이외에도 프로젝트 중 nodejs 나 express 를 잘몰라서 생기는 여러가지 문제점이 있었는데, 대표적인 것이

Sequelize 부분.. 아무래도 기존 스프링-마이바티스를 주로 사용하다보니 , 로우쿼리를 날리는 것이 익숙.. 

(하이버네이트를 연습해봐야 하나 고민했다)

하여튼 결국 Sequelize와 로우쿼리를 조합해서 프로젝트를 진행했다. 

 


 

십자인대가 파열되고 입원 - 수술의 기간 등등을 핑계로 미완성인 채로 마쳤지만

그래도 node js 를 살짝 맛본듯 하다. 물론 제대로 맛보진 않았지만

어쨌든 사이드 프로젝트잖아! 

재활이 끝나고 축구에 대한 열정이 다시 생기면 새로 만들려나..? 

 

반응형

'프로그래밍 > Proejct' 카테고리의 다른 글

Side Project  (1) 2019.08.07