Wecode - Project 1 (부트캠프)/Project 1 과정

Project 1- 3일 차: 경래 멘토님 [코드 리뷰] - app.js 뜯어보기 + Layered Pattern

Queen Julia 2023. 9. 14. 08:25

프로그래밍은 이해와 적용이다. 

무슨 함수를 쓰는지 뜯어보아야 한다. 

 

어떤 변수를 쓰는지 보아야 한다. 

궁금해 하고. 

 

(그리고, 코드가 완벽하면 통신할 때 오류가 날 확률이 적은데

주니어의 경우는 대부분 코드의 문제이기에, 

더욱 더 코드를 이해하고 분석해야 한다.)

 

수학 공식처럼, 

함수를 만든 사람이 그렇게 하기로 약속을 하고 공식문서에 넣었기 때문에, 

공식 문서에 가서 왜 쓰는지, 어디에 쓰는지 알아야 한다. 

 

 

자, 이제  app.js를 시작해보자. 

 


 

const http = require("http");     --> http를 가져온다

const jwt = require("jsonwebtoken");
const userServices = require('./Services/userServices.js') 
const threadServices = require('./Services/postServices.js') 

 

const express = require('express');   --> express를 가져온다, express란? http를 간단하게 만든 framework 
const morgan = require('morgan');     --> 서버 통신 현상 logging 기록
const cors = require('cors');     --> 출처 다른 서버 통신 막는 것을 완화 (출신 다른 프-백 서버 통신 위해)
const { dataSource } = require('./models');

const userRouter = require('./routes');   --> 라우팅. layerhandling 시 필요


require('dotenv').config();

const userService = require('./src/services/userService.js') 
const threadService = require('./src/services/threadService.js') 

// app.js를 처음 초기화 세팅엔 안 넣었던 부분인데 계속 추가되는 

const app = express()

app.use(cors());
app.use(express.json())     --> 통신 기반이 json 이기에 

 

--> app.use가 뭘까? app은 위에 보면, express라고 한다. 그렇다면, Express 공식 문서에 가보자. 

--> app.use("경로", 콜백함수) 로 안에는 Path 경로와 콜백함수를 넣어주어야 하고, mount를 하며 쌓아 올린다고 한다. 

콜백함수란, '함수가 함수를 부른다'라는 것이고, 

경로에  없을 때 주어지는 게 "/"가 디폴트 default인데,그럴 경우 계속 돈다. 



app.get("/", async (req, res) => {
try {
return res.status(200).json({ message: "Welcome to Soheon's server!" });
} catch (err) {
console.log(err);
}
});

--> 서버가 작동하는지

 


app.post("/users/signup", userService.userSignup)  //나는 "/users"였는데 헷갈리지 않게 회원가입 표시해주는게 좋겠다
app.post("/users/login", userService.userLogin)
app.get('/posts/read', threadService.readThreads) //게시글 조회  //이게 포스팅 목록 가져올 때 필요app.post('/posts/create', threadService.createThreads)  //게시글 작성

 

 

const existingUser = await myDataSource.query(`
SELECT id, email FROM users WHERE email='${email}';
`);

-->  await myDatasource.query: "서버 연결 후에 DB(query) 연결해야 하니, 굳이 DB 먼저 연결하지 마라, 기다려라"


//서버 시작 server start 
const server = http.createServer(app)--> app.listen도 가능하지만, 현업에서는 http.createServer(app).listen 추천 
const start = async() => {
    try {
        server.listen(portNumber, () => console.log(`Server is listening on ${portNumber}`))
    } catch (error) {
        console.log(error)
    }
}

-->  catch: 예외로 만든 에러 잡을 때 

 

 

myDataSource.initialize() .then( ( ) => {
        console.log("Data Source has been initialized!")
    })

--> initialize 뜻: 실행하다. 서버 connection (initialize 활용하는 곳: npm init, git init -y 에도 쓰이는 )

--> then, 그 후에는, (영어로 계속 생각해보기) 
start();

 


프로그래밍 입문자들이 어려워 하는 이유는,

프로그래밍 사고 = 절차적 사고.

일상에서 30개  절차를 거쳐 사고하지 않기에.

 

연쇄사건

1000개 layer, 파일을 넘나드는  

 

큰 그림이 없기에, 큰 그림이 없는 상태에서 여러 layer를 접하니 까막눈이 되는. 

멘토들이 바로바로 에러에 어떤 걸 하면 되는지 아는 이유는,

이미 많은 에러를 접하면서 봤던 에러이기에. 기억하기에.


Layered Pattern에는 

3개의 Layer가 있다.

Layer Presentation Business Model
  router
controller
service dao 

 

Presentation Layer - Business Layer  - Model Layer 

 

Presentation에는 router, controller  (나타내고 얻어내/ http로 입력, 출력)

Business 에는 service 

Model에는 Dao (Data Access Object 선언, 객체 관리, 호출) _Dao model 이라고 부른다. -> DB -> mysql 연결

 

Model-Dao에 DB 있음. 

-> app.js 로 initialize된 DataSource를 가져다 씀. 

 

Layer하는 나누는 기준은 - user(회원가입 + 로그인 합쳐서)  /CRUD (하나의 포스트)


app.js에서 require 한 이유는, initialize하려고. 

userDao.js에서 require한 이유는 (app.js에서) initialize한 거를 가져다 쓰려고. 

 

우리는 많은 typeorm method 중 .query method (SQL 문) 을 쓰고 있음. 

 

--> 데이터 가져다 쓰기 위해, 

SQL 

(쓰는 방법은, 또다른 개발자가 공식화. 

그래서 insert into 가 아닌, 다른 거 넣으면 동작 안 되는 것. 

그래서 내가 패키지의 공식문서를 봐야하는거 (목적, 이용) ) 

 

 

    const userData = await myDataSource.query(`
    INSERT INTO users (
      name,                    
      password,
      email
      )
    VALUES (
      'jaj',
      '${password}', 
      '${email}'
      )
    `);


이틀 전에는 상대경로와 절대경로가 헷갈렸는데, 여기저기서 코드를 계속 보고 이제는 이해가 된다.

 

현위치 .에서 시작 --> ./source = 상대경로 (현재 위치에서 시작하니까 '상대')

홈에서 시작하니까 ---> Desktop / wecode / Backend team 7 = 절대경로 


함수 이름을 지을 때, 

 

동사 + 목적어

 

ex.

createUser : user를 만든다

createPost : post를 만든다


 

userDao.js 에서 require => 

userService.js에서 const DataSource = require ('./dataSource') 


코드할 때,

파일 하나 안에서만 있으면 안 됨. 

 

'선언' 잘 보고, 어디에서 오는건지

큰 그림 (파일, 폴더) 

 

<controller>  <Service> <Model>
  userService.js userDao.js
  const hashPassword {
nickname,
email,
password}       

const createUse = async (nickname,
email, hashPassword)
// 위치인자로 그냥 3번째 불러내기에 작동되지만, 가독성 x       

                                          
try{
const result =
INSERT INTO
nickname,
email,
password
VALUES
?
?


[nickname, email, hashed] 
// 변수화