#4.3 Cleaning Codes & Exports

이원규·2022년 6월 2일
0

Itube

목록 보기
12/46
post-custom-banner

Cleaning Code

-> 아직까지도 코드가 더러움(라우터 안에 컨트롤러가 있는게 보기 힘듦). 따라서 우리는 controller 파일을 하나 만들 것임.

  1. src폴더에 controller파일을 하나 만든다.

  2. controller파일 내에 userController, videoController 파일을 만든다.(global controller는 안 만들어도 됨 -> user가 이용할 사이트니까 유저가 이용할 부분은 userController파일에 넣을거고 video에 필요한 부분은 videoController에 넣을 것임.)

  3. 각 라우터 내의 컨트롤러를 지운다! (컨트롤러만 지워야함)
    ex)

const handleHome = (req,res) => res.send("home");

이렇게 생긴 애들만 지우는 걸로!

  1. 강의를 시청한 뒤, 각 컨트롤러 파일에서 각각의 역할에 맞는 컨트롤러를 작성하고,Export해주고,
    각 라우터 폴더에서 import해준다.

Export

  1. Export Deafault
    const HANDLE = (req, res) => res.send("HANDLE");
    export default HANDLE

    import 원하는NAME from 주소

    -> export default는 해당 폴더를 import한다면 default된 변수가 import
    되는 것임.

  2. Export
    export const HANDLE = (req, res) => res.send("HANDLE");

    import {HANDLE} from 주소

    -> export이름과 import이름({}안에 있는거)이 같아야 함!

import 시, 주소 찾는법

-> .. :상위 폴더로 이동(해당 파일에서 벗어남)

-> . :외부 위치의 폴더로 이동(지금의 위치)

Code 정리

server.js

import express from "express";// 혹은 "node_modules/express"
import morgan from "morgan";
import globalRouter from "./routers/globalRouter";
import userRouter from "./routers/userRouter";
import videoRouter from "./routers/videoRouter";

const PORT = 4000;

const app = express(); 
const logger = morgan("dev");
app.use(logger);

app.use("/",globalRouter);
app.use("/videos",videoRouter);
app.use("/users",userRouter);


const handleListening = () => 
   console.log(`Server listening on port http://localhost:${PORT}`);


app.listen(PORT, handleListening);

Controller

userController

export const join = (req, res) => res.send("join");
export const edit = (req, res) => res.send("Edit");
export const remove = (req, res) => res.send("dlelte");

videoController

export const trending = (req,res) => res.send("Home Page Videos")
export const watch = (req,res) => res.send("Watch a Video");
export const edit = (req,res) => res.send("Edit Video");

Router

globalRouter

import express from "express";
import { join } from "../controllers/userController";
import { trending } from "../controllers/videoController";

const globalRouter = express.Router();

globalRouter.get("/",trending);
globalRouter.get("/join",join);

export default globalRouter;

userRouter

import express from "express";
import {edit, remove} from "../controllers/userController";

const userRouter = express.Router();

userRouter.get("/edit",edit);
userRouter.get("/remove", remove);

export default userRouter;

videoRouter

import express from "express";
import {watch, edit} from "../controllers/videoController";

const videoRouter = express.Router();

videoRouter.get("/watch",watch);
videoRouter.get("/edit",edit);

export default videoRouter;
profile
github: https://github.com/WKlee0607
post-custom-banner

0개의 댓글