프로젝트(42)
-
2. Node 가계부 만들기 [ .env 파일 사용, Mysql Sequlize 연결, Mysql 동기화 ]
1. package.json 실행 스크립트 생성 script에 실행 스크립트를 작성 "scripts": { "start": "node ./app.js" } 2. app.js (dotenv) 사용, .env 파일 생성 .env 설정 : https://crispypotato.tistory.com/86 Node, Express에서 dotenv사용해서 env파일 사용하기 먼저 dotenv를 다운받는다. npm i dotenv 1. 환경변수를 설정 확인 할 수 있게 환경변수를 확인 할 수 있게 www 파일에 환경 변수 확인 값 설정한다. 2. .env 파일 / .env.fail 파일을 만든다 성공시 .env파일 crispypotato.tistory.com 2-1. .env 파일 생성 .env 파일 내용 //cor..
2022.05.23 -
1. Node 가계부 만들기 [ 필요 파일/라이브러리 생성, 설치]
1. app.js 파일 생성 (메인 파일) 2. npm init 명령어 실행 => package.json 파일 생성 3. 필요 라이브러리 설치 [ dependencies ] 서버에 올라가서 사용 가독성을 위해 두 줄로 작성합니다~ npm i compression cors dotenv express express-validator http-errors jsonwebtoken npm i morgan mysql2 passport passport-jwt passport-local sequelize [ devDependencies ] 개발시에만 사용 npm i -D eslint eslint-config-standard eslint-standard 순서대로 진행 후 폴더 구조 4. app.js 코드 작성 app.j..
2022.05.22 -
0. Node 프로젝트 가계부 만들기 소개
2년전 만들었던 개인 프로젝트를 보니 중복코드가 많고 에러처리가 제대로 되어 있지 않는거 같아 리팩토링 하는 리뷰를 작성 할 예정입니다! Back-Server만 리팩토링이 진행 됩니다. 기능 구성과 DB구성은 2년전 프로젝트와 같게 진행되고 변수 명이 살짝 변경됩니다. api 설명 api는 크게 3가지 분류로 나뉩니다. 1. /user => 회원 가입 2. /login => 로그인 3. /accounts => 가계부 기능 가계부 기능 - 카드별 사용 금액 저장 - 현금 사용 금액 저장 - 수익 발생시 수익 형태 금액 저장 - 특정 날짜 [ 일, 월, 년 ] 사용금액 확인 - 특정 날짜 [ 일, 월, 년 ] 특정 카드 사용금액 확인 - 큰 카테고리, 작은 카테고리 저장 2년 전 프로젝트 https://cr..
2022.05.22 -
8. Node 프로젝트 가계부 만들기 (api 생성)
지난 글 : https://crispypotato.tistory.com/172 7. Node 프로젝트 가계부 만들기 (back-end와 api 연결) 지난 글 : https://crispypotato.tistory.com/134 6. Node 프로젝트 가계부 만들기 (Vue, 라이브러리 설치) npm i axios Vue2와 Vue-cli 이용해서 프로젝트를 제작한다. 1. Vue-cli를 설치한다. npm i -g @vue/cli.. crispypotato.tistory.com api가 연결이 되면 해당하는 rest api에 맞게 전송 해야한다. 전송 메소드 방식 get, delete params post, put, patch body /src/api/ 디렉토리 안에 url.js라는 파일을 생성한다. ..
2022.01.16 -
7. Node 프로젝트 가계부 만들기 (back-end와 api 연결)
지난 글 : https://crispypotato.tistory.com/134 6. Node 프로젝트 가계부 만들기 (Vue, 라이브러리 설치) npm i axios Vue2와 Vue-cli 이용해서 프로젝트를 제작한다. 1. Vue-cli를 설치한다. npm i -g @vue/cli 2. Vue-cli를 사용하여 프로젝트 생성 ex) vue create test-vue vue create Vue2 Default 로 설정 하고 엔.. crispypotato.tistory.com 요약 설치 한 axios를 이용하여 back-end와 통신을 한다. vue interceptor를 이용하여 로그인, 비로그인 상태를 구별 하여 전송시 인증 토큰 유무를 결정한다. vue Interceptor 설명 참고 : http..
2022.01.16 -
6. Node 프로젝트 가계부 만들기 (Vue, 라이브러리 설치)
npm i axios Vue2와 Vue-cli 이용해서 프로젝트를 제작한다. 1. Vue-cli를 설치한다. npm i -g @vue/cli 2. Vue-cli를 사용하여 프로젝트 생성 ex) vue create test-vue vue create Vue2 Default 로 설정 하고 엔터를 입력하면 자동으로 프로젝트가 생성된다. 3. 필요한 라이브러리들을 설치 해 준다. 프로젝트 디렉토리로 이동하여 axios, vuex, dayjs, vue-router, vuex-persistedstate를 설치한다. npm i axios vuex dayjs vue-router vuex-persistedstate axios : 백엔드 서버와 통신하기위한 라이브러리 vuex : 데이터를 중앙에서 관리하는 저장소 dayj..
2021.09.11