왜 쓰게 되었는가? 서비스를 분석하기 위해 유저의 활동 데이터를 수집해야 한다. frontend layer에서 firebase, mixpanel, airbridge 등의 다양한 툴을 붙여서 분석하고 있지만 전체적인 유저의 추세를 보기에는 간편하고, 시각화도 잘 해주지만 유저 한명한명을 타게팅해서 뭐하나 분석하기엔 어려움이 있었다. backend layer에서는 API를 호출할 때마다 로그를 기록하면되니, 로그만 잘 작성해둔다면 유저가 어디에서 머물고, 어떤 버튼을 클릭하고, 어디에서 이탈하는지 분석할 수 있을것이다. 원래는 어떻게 했는가? 원래도 logging 기능은 있었다. import logger from "../../utils/winston"; ... isUserPriorty: async (_, {..
Express
내가 쓰고 있는 백엔드 기술에 대해 언어, 런타임, 프레임워크 자체에 대해서 조사하고 정리해보고자 한다. 언어 - JavaScript 역사 JavaScript(이하 JS)는 애초에 웹 브라우저를 위해 만들어진 언어다. 1990년대에 주된 브라우저였던 '넷스케이프'(지금은 파이어폭스로 승계되었다고 한다)를 만든 회사인 '넷스케이프 커뮤니케이션즈'에서 정적인 HTML을 동적으로 표현하기 위해 만든 언어이다. 이름이 'Java'Script인 이유는 애초에 만들때부터 만들게될 스크립트 언어가 자바를 구현할 것이고 비슷한 문법을 채용하고자 했다. 더불어 초기에는 LiveScript였으나 Java에서 파생되었다는 점과, 마케팅의 이유로 JavaScript가 되었다고 한다. ECMAScript ECMA(정보와 통신 ..
Ubuntu 20.04(리눅스)에 Apache2를 사용해서 Nodejs+express가 3000포트로 뿌리는걸, 80포트(기본 http)로 client가 들어왔을 때, 연동되도록 포트 포워딩(포트 매핑)을 해주는 과정이다. (3000포트는 예시일 뿐 다른 것도 상관없다) 할 때마다 삽질해서 정리해둔다. 특히 apache와 apache2는 폴더 구조와 내부 설정 구조가 완전히 다르니 정확히 파악해서 사용하자 예전에 서브 도메인으로 바꿔주는건 아래 포스팅에서 참고하면 좋을 듯 https://pypystory.tistory.com/9 먼저 apache2를 설치해준다. sudo apt-get install apache2 아래로 들어가서 아파치 설정을 해준다. cd /etc/apache2/sites-avaliab..
Svelte는 멘토님의 일침과 함께 고이 던져두고, 원래 공부하던 리액트로 돌아왔다. NodeJS는 설치되어 있다는 가정하에 시작한다. 이번엔 카카오API로 로그인을 만들어보고, 다음편엔 sms나 email을 push하는 기능을 만들어볼거다. 개인 프로젝트명을 요약하면 '리액트와 노드JS를 사용해서, sms, email, kakao 메시지를 push하는 기능을 만들껀데, 인증은 카카오 로그인 API로' 정도가 될것 같다. Setting 1. 프로젝트 폴더(빈 폴더)에서 npm init을 해주고, client, server 폴더를 만들어준다. npm init mkdir client mkdir server 2. client 폴더로 들어가서 npx CRA . 을 해준다. cd client npx create-..
Github : https://github.com/wq0212/campus-compass Site : http://campuscompass.site/ 어느날 인스타를 보던 중 본교 아트앤테크놀로지(이하 아텍) 학과에서 해커톤이 개최된 공고를 확인했다. 비슷한 기획이 컴공 학생회 하면서도 말로만 나온적이 있었지만, 구체화 된적은 없었다. (게시물 사용 허락과 해커톤 기획 등을 해주신 아텍 학생회 관계자분들께 다시 한번 감사드린다.) 본인도 웹개발에 관심있고, 최근 웹보안 공부하면서 틈틈이 생각나는 프로젝트 아이디어는 뽑아둔게 몇개 있어서 참여를 결심했다. 결정적으로 대부분 혼자서 개발하거나, 프론트/백엔드 정도로만 나눠서 개발해본적이 있었기에 디자인, PM을 끼고 팀 프로젝트를 경험해보고 싶기도 했다. 직..