주소록 만들기 / module

· module : 보다 작고 이해할 수 있는 단위로 나뉘어진 것

 - 본체에서 분리되어 작은 부분으로 유기적으로 구성되어 있다가,

 필요할 때 본체에 합류하여 그 기능을 수행할 수 있는 것

· 모듈화 : 거대한 문제를 작은 조각의 문제로 나누어 다루기 쉽도록 하는 과정

(출처 : http://www.ktword.co.kr/test/view/view.php?m_temp1=2226 )

 

-> module은 다른 파일에 있는 object를 불러와서 현재 파일에서 사용하는 것

 

 

다른 파일의 object를 불러오기 위해서는 해당 object를 module.exports에 담아주어야 함

다른 파일의 module을 불러오기 위해서는 require 함수 사용. 

require 함수의 parameter로 대상 module의 상대위치와 파일이름을 문자열로 넣는다. 

- js파일만 module로 불러올 수 있기 때문에 파일이름에서 .js는 생략

- module이 node_modules폴더에 있다면 위치 생략 가능(npm install로 설치한 package)

 

예제) main.js에서 my-module.js를 호출하기

main.js와 같은 위치에 my-module.js를 둔다.

파일 위치

// my-module.js

const myModule = { 
  name: "suin",
  age: 21,
  aboutMe: function(){
    console.log("Hi, my name is " + this.name + " and I'm " + this.age + " year's old.");
  } 
};

module.exports = myModule;

- myModule 오브젝트를 만든 후, module.exports에 넣어준다.

 

// main.js

const m = require('./my-module');

console.log(m.name);
console.log(m.age);
m.aboutMe();

- 변수 m에 ./my-module.js에서 호출된 module을 담는다.

  -> my-module.js의 myModule obeject와 main.js의 변수 m이 동일하게 된다.

실행 결과

 

---

기존의 index.js 파일 하나에 모든 서버코드를 작성하였지만,

코드가 길어지게 되면 파일을 나누는 것이 개발에 효율적이기 때문에 

개별 파일로 원래 코드를 분리하고 express를 사용하여 라우팅을 관리하도록 할 것이다.

파일구조

index.js 코드에서

Contact model -> models/Contact.js

contact route -> routes/contacts.js

home route -> routes/home.js

로 이동한다.

 

//index.js

const express=require('express')//모듈 가져오기
const mongoose=require('mongoose')
const methodOverride = require('method-override')
const app = express()//어플리케이션 생성

// DB setting
mongoose.connect(process.env.MONGO_DB);
const db = mongoose.connection; 

db.once('open', function(){
  console.log('DB connected');
})
db.on('error', function(err){
  console.log('DB ERROR : ', err);
});

app.set('view engine','ejs')//템플릿 엔진
app.use(express.json());
app.use(express.static(__dirname+'/public'));
app.use(express.urlencoded({extended:true}));
app.use(methodOverride('_method'));

//Routes
app.use('/', require('./routes/home'));
app.use('/contacts', require('./routes/contacts'));

//port setting
const server=app.listen(3000, ()=>{
  console.log('Start Server : localhost:3000')
})

//Routes

app.use('/', require('./routes/home'));

app.use('/contacts', require('./routes/contacts'));

익스프레스 앱과는 app.use()로 연결되어 있다(라우팅 미들웨어)

첫 번째 인자로 주소를 받아서 특정 주소에 해당하는 요청이 들어왔을 때만 미들웨어가 동작한다.

 

주소가 /로 시작하면 routes/home.js을,

          /users로 시작하면 routes/contacts.js을 호출한다.

 

use 대신 HTTP 메서드(get, post, delete 등)도 사용가능하다.

※ use 매서드 - 요청 주소만 일치하면 실행

   HTTP 매서드 - 주소 & http메서드 모두 일치하는 요청에 의해 실행

 

//routes/home.js

const express=require('express')
const router=express.Router()

router.get('/', function(req, res){
  res.redirect('/contacts');
});

module.exports=router;

const router=express.Router()

router 객체는 express.Router()로 만든다.

 

index.js의 app.use('/', require('./routes/home'));와

home.js의 router.get('/', function(req, res){

  res.redirect('/contacts');

});

가 합쳐져 /으로 GET요청을 했을 때 이 모듈의 콜백함수가 실행된다.

 

마지막에 module.exports=router;로

router 객체가 모듈이 되어 require시에 사용된다.

 

//routes/contacts.js

const express=require('express')
const router = express.Router()
const Contact= require('../models/Contact')

// Contacts - Index
router.get('/', function(req, res){
    Contact.find({}, function(err, contacts){
      if(err) return res.json(err);
      res.render('contacts/index', {contacts:contacts});
    });
});
  
// Contacts - New
router.get('/new', function(req, res){
    res.render('contacts/new');
});
  
// Contacts - create
router.post('/', function(req, res){
    Contact.create(req.body, function(err, contact){
      if(err) return res.json(err);
      res.redirect('/contacts');
    });
});
  
//Contacts - show
router.get('/:id', function(req,res){
    Contact.findOne({_id:req.params.id},function(err,contact){
      if(err) return res.json(err);
      res.render('contacts/show',{contact:contact});
    });
});
  
//Contacts - edit
router.get('/:id/edit',function(req,res){
    Contact.findOne({_id:req.params.id},function(err,contact){
      if(err) return res.json(err);
      res.render('contacts/edit',{contact:contact});
    });
});
  
//Contacts - update
router.put('/:id',function(req,res){
    Contact.findOneAndUpdate({_id:req.params.id},req.body, function(err,contact){
      if(err) return res.json(err);
      res.redirect('/contacts/'+req.params.id);
    });
});
  
//Contacts - destroy
router.delete('/:id', function(req,res){
    Contact.deleteOne({_id:req.params.id},function(err){
      if(err) return res.json(err);
      res.redirect('/contacts');
    });
});

module.exports=router;

const Contact= require('../models/Contact')

Contact model을 require로 호출한다.

 

home.js와 마찬가지로

index.js의 app.use('/contacts', require('./routes/contacts'));와

contacts.js의

router.get('/', function(req, res){

    Contact.find({}, function(err, contacts){

      if(err) return res.json(err);

      res.render('contacts/index', {contacts:contacts});

    });

});

가 합쳐져 /contacts으로 GET요청을 했을 때 이 모듈의 콜백함수가 실행된다.

get 외의 put, post, delete도 마찬가지이다.

 

// models/Contact.js

const mongoose = require('mongoose');
const contactSchema = mongoose.Schema({
  name:{type:String, required:true, unique:true},
  email:{type:String},
  phone:{type:String}
});

const Contact = mongoose.model('contact', contactSchema);

module.exports = Contact;

 

기존의 코드를 분리하고 위치를 바꾼 것이기 떄문에 이전과 실행결과가 변함 없다.

출처·참조 : https://backback.tistory.com/341

Node - Express [Router 객체로 라우팅 분리]

https://www.a-mean-blog.com/ko/blog/Node-JS-%EC%B2%AB%EA%B1%B8%EC%9D%8C/%EC%A3%BC%EC%86%8C%EB%A1%9D-%EB%A7%8C%EB%93%A4%EA%B8%B0/%EC%A3%BC%EC%86%8C%EB%A1%9D-Module%EB%A7%8C%EB%93%A4%EA%B8%B0

Node JS 첫걸음/주소록 만들기: 주소록 - Module만들기 - A MEAN Blog