본문 바로가기
  • 삽질하는 자의 블로그
공부용-사이드프로젝트/Nodejs - 미니프로젝트-쇼핑몰

1. 구상하기, 세팅하기, 기본 가입페이지만들어보기

by 이게뭐당가 2022. 9. 19.

나만의 작은 쇼핑몰을 만들어보자. 하핫. 물론 로컬이다 하핫.

 

[ 구상 ]

0. 공통

 : 로그인, 회원가입, 로그아웃 ... 

1. 사용자

 : 상품보기, 상품 정보보기, 카트담기, 결제하기, 완료페이지 ...

2. 관리자

 : 상품 등록, 상품 정보 등록, 모든 사용자 결제완료페이지 보기 ...

 

MVC 패턴을 기반으로 하여 시작해보았다!

 

[ 서버 생성, 데이터베이스연결, 필요한 패키지 연결]

 

1. 서버를 열고, mongoDB기반의 데이터베이스를 연결하고, ejs view engine을 설치하여, VIEW를 깔고가자

 

<app.ejs> 좌, database<우>

npm init 을 통해, 패키지 설치 기반을 다지는 것을 잊지 말자!

컨트롤러에는 route들의 필요한 function

db 에는 db

middleware 에는사용자 지정 middleware가

얘는 뭐 패키지고

public 에는 css와, AJAX나, 반응형으로 만들 javascript 파일이

routes에는 나의 라우트들이!

view에는 html파일이 들어갈것이다!

APP.js는 메인파일이고

 

 

 

 

 

2. 라우트를 분리하여 인증이 필요한 auth-route를 빼내고, 여기부터 시작해보자.

<routes>

3.라우트 에 auth-route파일을 만들어, get  request로 연결하고, controller로 기능을 넘겨주었다.

module.exports로 빼내고, <routes> , <controllers> , <ejs> 는 하나가 되었다.

 

4. 필요한 view 작업을 슬쩍슬쩍 해주고, 껍데기를 완성시킨다.

signup 기본 템플릿

얼추 작업하니 봐줄만 하다.

 

5.  signup page에 db로 넘겨줄 값을 받아서, db로 값을 넘겨보자! 나중에 MODEL 폴더로, 또 리팩토링할거다. 으윽

 

서버와 로컬간에는 JSON 데이터로 옮겨다니므로,

사용가능한 javascript 코드로 변환시켜주는 

app.use(express.urlencoded({extended:false}))

미들웨어 코드를 잊지말고, req한다!

 

 HTML에서 기본 검증을 실행했지만, 그것만으로는 전혀 전혀전혀전혀 효용가치가 없다.

검증 코드도 잘 써주도록한다.

길기도해라. 일단 이걸로 데이터베이스에 값은 넣어봤다.

 

이제 시작이다! 으쌰!

댓글