[node.js] 프로젝트를 마무리하면서 - 정리, 그리고 해커톤

[서비스 URL]

- http://www.politics-watch.com/


[기술 스택]

1) 웹 서비스 : Express(nodejs), firebase(auth) - AWS EC2
2) 크롤링 : request, cheerio, mecab-ya(nodejs) / crond - AWS EC2
3) DB: mysql server(AWS RDS)

[프로젝트 관련 지식]

(1) 목표, 컨셉, 디자인, 기능, 사용자 기능 사용 단계, 개발 순서 등 모든 계획을 짜놓은 뒤(초기 계획) 개발

(2) 버젼 계획이 있어야함 : 초기 버젼 계획을 세우고 추후 생각나거나 기획된 기능은 다음 버젼, 개발 단계에 돌입했다면 최대한 수정없이

(3) 무작정 개발보다는 프로젝트 단계를 지켜나갈 것 : 필요한 정보 설계(DB) -> 기능 설계(쿼리 짜기) -> 뷰 설계 -> 개발

=> 전체적인 컨셉(방향) -> UI -> 기능 구현 : 어떤 버튼이 어떤 기능을 할지 정확하게 알아야 기능 구현을 한 뒤에 기능이 달릴 타겟이 변경되지않음

=> 단계별 개발 / 테스트 : 예를 들어 코멘트 개발이라하면 로그인, 로그아웃(세션 혹은 로컬 및 세션스토리지 사용)부터 개발, 테스트 해보고, 

     mysql 코멘트 테이블 생성 후 CRUD 쿼리 작성해서 테스트 해보고 각각 개발한 것을 종합해서 개발

(4) 개발은 한꺼번에 다하려고 하지말고 단계별로 개발 - 테스트 - 개발을 반복한다 : 한꺼번에 개발하면 디버깅하기가 까다롭고 범위가 넓음

(5) 작업은 백업과 버젼관리가 생명이다 : 팀 작업이라면 github을!(다 날려먹을뻔 했다, 혼자 하는 작업이라 그냥 작업하다가… 혼자할 땐 git을!)

=> 버젼 관리하기

(6) 모듈화 개발 : 개발할 땐 모듈화, 배포할 땐 패키징

(7) 개발 일지 작성 : 나만의 자산이 됨(덜 삽질하게 만들어줌)

[웹 관련 지식]

(1) Auth : 인증서비스, 인증토큰을 받음, 서버측에서는 인증토큰을 DB에 저장, 정보를 요청할 때, 서비스를 이용할 때 인증토큰으로 필요한 정보를 받음

=> 인증토큰 + 사용자 정보(DB)를 저장 => 서비스할 때 매번 요청하는 것이 아니라 그 정보를 가지고 서비스 개발, 이용하도록 함

=> 파베는 액세스 토큰을 저장한 후 콘솔에 보여주고, 로컬스토리지에 사용자 정보 저장함 : 로그아웃 버튼을 만들어서 로컬스토리지 없애기

=> 브라우저 개발자도구(크롬기준) > Application > 로컬스토리지 > 해당 서비스 URL > firebase:authUser 목록 있음(암호화되어 저장)

(2) ajax redirect 문제 : 감싸져있는 태그에 form이 있으면 안됨

(3) get과 post : get 쿼리스트링, post form-data 사용, get은 쿼리스트링으로 데이터를 전달해야함

(4) 브라우저 마다 가지고있는 UI 킷이 있음, 없애려면 css 코드 사용할 수 있음 : 예를 들어 -webkit-appearance: none; 

(5) 브라우저 마다 각각 자바스크립트 엔진의 차이때문인지 실행되지않는 코드들이 있음 : 크로스 브라우징이 중요한 이유인가…..
=> 로컬스토리지 같은 코드는 각각 이름이 달라서일까…..

=> 크로스 브라우징이 중요한 이유!

[nodejs 지식, 자료 저장소]

(1) 모듈화 방법 

- module.exports = 코드 : 곧바로 불러올 수 있게 저장하는 방법

- module.exports.멤버명 : 객체 내에 저장하는 방법

(2) 콜백함수의 리턴값 저장하기

- 콜백함수를 호출하는 함수에 함수 변수나 객체 선언하고 저장하기

(3) 동적 언어 : 컴파일 타임이 아니라 런타임에 자료형이 정해짐 : 한 변수에 여러 자료를 덮어쓰기

(4) pm2로 서버 온 해둘 때 : ejs(뷰 템플릿)은 변경되지않음 - pm2 재시작을 해줘야함

(5) mysql 모듈 : 쿼리 문법 에러 이외에 일치하는 값이 없더라도 에러가 나지않음 /* 주의할 것 */

(6) express : 프로젝트 구동 -> app.js (start file -> 미들웨어 함수 실행) -> 프로젝트를 off하지않는 이상 실행된 상태 유지

=> 스코프, 변수 값 상태 등 그대로 유지 : 페이지 새로고침을 했을 때 통신만 새롭게 할 뿐 서버는 그대로 돌아가는 중)

=> express 프로그래밍 할 때 유의할 점 : index.js는 계속 돌고 있는데, 요청할 때 그 상태값을 주는 것
    => 전역 변수 사용할 때 초기화되겠지? 라고 생각하면 안됨(함수는 새롭게 호출되는 것이기 때문에 상관x

[프론트 관련 지식]

(1) 버튼 내부에 텍스트가 아닌 아이콘 등 내부에 들어가는 태그가 있다면 외부에 이벤트 리스너를 달아두면 안됨
=> 내부에도 적용되어서 e.target이 여러개로 될 수 있음

(2) mouseover + mouseleave : 클릭이벤트 중 쓸모가 많은 이벤트

[aws 지식 + 자료 저장소]

(1) mysql 자료 : http://docs.aws.amazon.com/ko_kr/AmazonRDS/latest/UserGuide/CHAP_MySQL.html

(2) vpc 보안 그룹 관련 자료 : http://docs.aws.amazon.com/ko_kr/AmazonVPC/latest/UserGuide/VPC_SecurityGroups.html

(3) Route53 : 도메인 바로 살 수도, DNS만 전용 DNS 주소를 발급받아 외부 도메인 네임서버 업체의 네임서버에서 aws 것으로 변경할 수 있음

=> ping 주소 : 해당 명령어로 주소의 IP 주소를 알아낼 수 있음(요청하고 원활하게 응답을 받는지 확인하는 명령어)

(4) IAM, Elastic beanstalk : 알아보기, aws 프로덕트를 사용할 땐 IAM이 필수라고 하던데(해커톤 AWS 사용 발표 코너에서)

[mysql 지식, 자료 저장소]

(1) mysql 공식 문서 : https://dev.mysql.com/doc/refman/5.7/en/tutorial.html

(2) mysql timezone 세팅 : set time_zone = ‘Asia/Seoul’;

(3) 현재 시간을 기본값으로 지정하기(timestamp) : https://dev.mysql.com/doc/refman/5.7/en/timestamp-initialization.html

(4) id값 자동 증가, 유일한 값 설정하기 : 레코드명 데이터타입 NOT NUMM AUTO_INCREMENT, ……, PRIMARY KEY(레코드명)

=> https://dev.mysql.com/doc/refman/5.7/en/example-auto-increment.html

(5) 테이블 삭제 : drop table 테이블명;

(6) 디폴트값 넣기 : 레코드명 데이터타입 DEFAULT 값
(7) 쿼리만 잘 짜면 생각하는 레코드 형태를 리턴받을 수 있음 : 복수의 컬럼 레코드 중복되면 뽑히지않게, 특정 날, 시간에 맞게 뽑기 등

[리눅스 지식, 자료 저장소]

(1) 환경변수 지정 : export로 선언, ~/.profile 명시

=> ~/.profile 을 실행해야함 : ~/.bash_profile에서 source .profile 쉘 명령어를 추가해줘야 로그인할 때 환경변수를 인클루드함

(2) crontab 파일 권한은 644, crond로 돌릴 쉘스크립트 파일의 권한은 실행권한 부여해주기, 실행 제대로 안된다면 /var/log/cron 살피기

=> crotab 파일 권한 잘못하면 bad mode로 실행안됨

=> 쉘스크립트 파일 실행 권한을 일반 유저(파일을 돌릴)에게 허가 해주지않으면 실행못해서 실행안됨

=> 모든 에러는 로그를 살펴보는 것부터

(3) 서버 에러는 SELinux 문제가 많더라구…. 확인하기 : cat /var/log/audit/audit.log | grep nginx | grep denied

(4) 프록시 서버 개념 : https://ko.wikipedia.org/wiki/%ED%94%84%EB%A1%9D%EC%8B%9C_%EC%84%9C%EB%B2%84

(5) 일반적으로 돌렸을 때 에러가 나지않고, 타 프로그램을 통해서 돌릴 때 에러가 난다면 환경변수(env)를 의심해보자 : crontab, pm2

=> crontab의 경우 환경변수를 가져오지않는다함 : 유저별로 crontab을 사용하는데, 같은 환경변수를 사용한다면….

    => 별도의 쉘스크립트를 지정해줘서 환경변수를 가져오는 것처럼 만들면 됨

[firebase 지식, 자료 저장소]

(1) 페이스북 로그인 관련 firebase api docs : https://firebase.google.com/docs/reference/js/firebase.auth.FacebookAuthProvider

(2) 파베 유저자료(구글, 페북, 이메일) : https://www.slideshare.net/sungbeenjang/firebase-for-web-2-authentication

(3) uid는 시간에 따라서 변경됨 : 식별자를 사용할 것(같은 이메일 계정 당 1개의 아이디만 만들 수 있도록 설정한 뒤)

(4) 특정 정보를 받아올 때만 토큰이 필요함, 그외엔 세션을 사용하자
=> 최초 로그인(토큰 받아오고, 토큰으로 정보를 받아와서(자바스크립트) ajax 통신(서버로 정보를 건네줌: express-session)

=> 다음 프로젝트부터는 firebase 제공 함수는 최소한으로 사용

=> express-session 모듈 사용 : https://www.npmjs.com/package/express-session 

=> 이미지는 요청해서 가져오는 것이므로 파이어베이스를 거쳐야함

=> 브라우저 세션이 존재하면 : 모든 정보를 가져오는 것이 아니라 최소 정보만(유저들이 보는 부분) 뷰에 등록하고 나머지는 서버에서 체크하기

=> 클라이언트 사이드 랜더링 : 세션스토리지 / 서버 사이드 랜더링 : 세션(express-session)

=> 토큰 관리는 간편하고, 과정도 간단하게 만들어놨지만 이후 사용에 있어서 클라이언트, 서버 각각 나눠서 두번 작업을 해줘야하고 각각 저장하는 곳이 달라 통신 작업도 만들어줘야하고… 파베를 쓴다고 확 정하는 것보다 효율을 따져볼 것.....;;

=> auth는 auth를 제공하는 측 네이티브를 사용하는게 오히려 편리할 수도 있겠다 생각이 듬

[해커톤이 끝난 시점에서]

1) 현재에서 만족하지않을 것 : 작년보다 훨씬 발전한 모습이지만 해커톤에서 본 친구들 모습을 보면 아직 많이 모자람을 느낌

2) 현재 실력을 대변하는 커리어를 쌓았음 : 실력을 더 키워서 커리어를 계속해서 쌓아보자

=> 실력을 키우면서 실력을 결과물로 보여줄 수도 있어야함

3) 기술은 하나의 도구, 도구를 어디에 활용하느냐가 중요 : 많은 사람이 모인 만큼 다양한 아이디어가 나옴

=> 요근래 들었던 아이디어들보다 훨씬 더 참신하고 훨씬 더 도움이 많이 될 것 같은 아이디어가 많았음

=> 기술에 대한 실력을 쌓고 결과물을 만들되 어떤 결과물을 만들 것인가? 왜 만드는가를 명확하게 짚기

4) 팀을 만들 땐 인위적이기보다 진짜 아이템에 대한 공감, 열의, 능력 모든걸 잘 봐야겠다고 생각 : ㅠㅠㅠ......
5) 굉장히 자신감이 생김 : 작년엔 진짜 손도 못댔는데.... 올해는 A-Z까지 다 시도해보고 어느정도 구현도 하고....ㅎ
6) 다시 시작 : 부족한 부분, 공부하고 싶었던 부분 공부하면서 프로젝트 기획 - 개발까지 다시!