자바스크립트로 개발하는 분들이라면 보통 서버는 express를 사용한다. express는 어차피 http모듈로 만들어 진것이고 koa나 다른 프레임워크등도 비슷하다. 즉 서버를 띄우는데 아무런 문제가 없다. 그런데 프론트는 조금 얘기가 다르다. 아파치나 nginx같은 서버를 따로 만들어야 한다. 세부적인 설정까지 하면 어렵겠지만 사용법자체는 어렵지 않다. 일단은 설치를 한다. mac이라면 brew install nginx를 이용하고 윈도우라면 공식 홈페이지에서 설치하면 된다. (ubuntu sudo apt install nginx) 그리고 원하는 프론트 파일들을 /var/www/html 폴더에 넣으면 끝이다. 웹팩으로 빌드를 했다면 sudo cp -r dist/* /var/www/html/ 이런 명령어로..
드디어 세번째 프로젝트가 끝났다. 이제 남은 프로젝트가 하나밖에 안남았다. 이럴수가... 뭔가 저번프로젝트에 비해 양이 적어서 시간이 남으면 뭘하지?? 라고 생각했었는데 새벽 3시반에야 간신히 끝냈다.... 이번 프로젝트는 진짜 구조를 짜는것과 리팩토링, 코드리뷰, 에러 처리 등에 많은 시간을 들였다. 굉장히 좋은 경험이라고 생각한다. 그런데 그러다보니 애니메이션이라던가 css 부분에 신경을 덜 쓴것같다. 우리팀은 피그마에 있는 내용을 바탕으로 만들었는데 다른팀은 애니메이션을 어마어마하게 적용했다. 우리팀은 진짜 기본적인 부분만 적용을 해서 차이가 느껴졌다. 그 중에 좀 과하다 싶은 것도 있었는데 일단은 사용하는 법을 알고 과한 것은 언제든지 줄일 수 있기 때문에 상관없다고 생각한다. 우리팀원과 나 전부..
벌써 4주차가 끝났다. 벌써 세번째 프로젝트의 절반이 지난것이다. 원래 시작할때는 기능구현을 우선적으로 하자고 했는데 어쩌다보니 기능보다는 구조나 코드에 신경을 많이 썼다. 이번 팀원분은 일단 엄청 꼼꼼하다. 그래서 별생각없이 코드를 짤 수 없다. 원래 생각없이 코드를 짜지는 않지만 설득시키기 위해서는 내가 보다 잘 알아야 한다. 그래서 내가 조금 미흡하게 아는 부분은 설명을 하는데 진땀을 뺐다. 팀원이 프로젝트마다 바뀌는 만큼 다양한 사람들과 협업을 하고 다른 관점에서 볼 수 있기 때문에 도움이 되는 것 같다. 이번 프로젝트는 가계부인데 저번 프로젝트보다 할 작업이 훨~~~~씬 적다. 그래서 그런지 구조에 신경을 많이 썼고 다른 팀들도 마찬가지인 것 같았다. 우선 프론트는 내가 구조를 짜고 백엔드는 팀..
이전에도 글을 썼는데 뭔가 좀 애매해서 처음부터 다시 글을 써볼려고 한다. 이번에도 배포하다가 오류가 나서 몇시간을 날려먹은지 모르겠다. 진짜... 개빡.....친다 이런일이 발생하지 않게 상세하게 글을 써야겠다. 인스턴스 생성 먼저 arm ubuntu로 만들어준다. 인바운드에는 기본 ssh, 80, 3306, 8080을 열었고 아웃바운드에는 전체를 허용해놨다. nodejs 설치 먼저 nodejs를 lts버전으로 깔아준다. 공식사이트 참조(매번 버전이 바뀌기 때문에) https://github.com/nodesource/distributions#installation-instructions 기본 설정 우분투 패키지 업그레이드 및 한글 설정(위에랑 순서가 바뀌어도 상관없을듯??) $ sudo apt upd..
2번째 프로젝트 때 사용한 함수들 시간 parse 함수 db에서 시간을 불러와 몇분전, 몇시간전 이런 함수를 만들었다. 처음에 내가 짰는데 뭐가 틀린지 모르겠지만 틀려서 우리 팀원이 내 코드를 보고 그냥 처음부터 다시 짰다. 더 좋은 방법이 있으면 댓글 달아주세요 const secObj = { year: 31536000, month: 2592000, date: 86400, hour: 3600, min: 60, }; const getTimeObject = (date) => ({ year: date.getFullYear(), month: date.getMonth() + 1, date: date.getDate(), hour: date.getHours(), min: date.getMinutes(), sec: d..
드디어 두번째 프로젝트가 끝났다. 기능 구현을 할 수 있을까 걱정했는데 버그가 있지만 모든 기능을 완성은 했다. 저번주에는 다른팀들을 보고 좌절을 했었는데 결과물을 보니 기능을 끝내지 못한 팀이 더 많았던 것 같다. 그래서 조금은 자신감을 얻었다. 당근마켓같은 웹사이트를 2주도 안되는 기간에 만드는 건 조금 짧긴 하다. 그리고 제약사항 때문에 더 힘들었다. 제약사항은 크게보면 프론트에서 뒙팩, 바벨, 타입스크립트같은 라이브러리를 제외한 라이브러리는 모두 금지고 asyn await 금지, fetch 함수 사용이였다. 그리고 화면이 슬라이드로 나오기 때문에 사실상 spa로 만들어야 했다. 백엔드는 orm이 금지였는데 나처럼 db 3, 4중 조인문을 사용하지 않은 사람들에게는 이게 백엔드 과정인가 싶을 정도로..
바벨 웹개발자라면 최신 기술을 사용하고 싶다. 그런데 최신 기술을 지원하지 않는 브라우저(ie라던가... ie라던가... ie...)가 존재한다. 엄청난 최신 기술이 아니라 나온지 오~~래된 기술도 사용할 수 없는 브라우저들이 있다. 이런 경우에 어떻게 해야할까?? 옛날 기술을 사용한다... 라는 방법밖에 없었다. 없었다.. 라는 것은 지금은 아니라는 것인데 그 이유가 바로 바벨이다. 바벨은 자바스크립트 컴파일러인데 ECMAScript 2015+코드를 이전의 버전으로 바꿔주는 역할을 한다. 이 때문에 지금은 최신 문법을 간편하게 사용할 수 있는 것이다. 물론 우리가 설정을 해줘야 한다. 리액트 cra같은 경우는 이미 설정이 되어있어서 적용이 되는 것이고 바닐라 자바스크립트로 최신 문법을 사용하려면 설정을..