[#. Node] 관리자 패널, 대시보드를 제공하는 Admin Dashboard AdminBro 사이드바에 database, model 가져오기 add resource 2

 

 

 

 

 

생각보다 model 가져오는 거에서 헤맸다

localhost:5000/admin에서 왼쪽 사이드바에 모델들을 불러와보자

 

 

 

 

 

 

 

① admin-bro/mongoose 설치

 

npm install @admin-bro/mongoose --save

 

 

 

 

 

 

② index.js에 add resource 설정 추가

 

const AdminBro = require('admin-bro')
const AdminBroExpress = require('@admin-bro/express')
const AdminBroMongoose = require('@admin-bro/mongoose')		// 추가
const User = require('./models/User')	// 추가
const Admin = require('./models/Admin')	// 추가

AdminBro.registerAdapter(AdminBroMongoose)	// 추가

const adminBro = new AdminBro({
  databases: [ mongoose ]		// mongoDB 전체 가져오기
})

const router = AdminBroExpress.buildRouter(adminBro)

app.use(adminBro.options.rootPath, router)

 

 

index.js 전체 코드 

 

const express = require("express");
const app = express();
const path = require("path");
const cors = require('cors')

const AdminBro = require('admin-bro')
const AdminBroExpress = require('@admin-bro/express')
const AdminBroMongoose = require('@admin-bro/mongoose')		// 추가
const User = require('./models/User')	// 추가
const Admin = require('./models/Admin')	// 추가

const config = require("./config/key");	// mongoDB 설정 파일

const mongoose = require("mongoose");

const connect = mongoose.connect(config.mongoURI,
  {
    useNewUrlParser: true, useUnifiedTopology: true,
    useCreateIndex: true, useFindAndModify: false
  })
  .then(() => console.log('MongoDB Connected...'))
  .catch(err => console.log(err));

AdminBro.registerAdapter(AdminBroMongoose)	// 추가

const adminBro = new AdminBro({
  databases: [ mongoose ]		// 수정
})

const router = AdminBroExpress.buildRouter(adminBro)

app.use(adminBro.options.rootPath, router)

const port = process.env.PORT || 5000

app.listen(port, () => {
  console.log(`Server Listening on ${port}`)
});

 

 

 

 

 

 

③ model 설정

models/Admin.js

 

const mongoose = require('mongoose');

const adminSchema = mongoose.Schema({
    id: {
      type: String,
      maxlength:50
    },
    password: {
      type: String,
      minglength: 50
    },
    name: {
      type: String,
      maxlength: 10
    },
    role : {
      type: Number,
      default: 0
    },
})

const Admin = mongoose.model('Admin', adminSchema);

module.exports = { Admin }

 

User.js도 똑같이 만들어 주면 된다

 

 

 

 

 

 

 

 

페이지를 새로고침 하면 이렇게 왼쪽에 모델을 잘 불러온다

모델만 불러오면 이 대시보드에서 CRUD는 물론, 필터링도 가능하다

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

* datadatabases가 아니라 resources로 간단하게 가져올 경우에는 이렇게도 가능하다

 

 

 

 

⑴ index.js

 

const AdminBro = require('admin-bro')
const AdminBroExpress = require('@admin-bro/express')
const AdminBroMongoose = require('@admin-bro/mongoose')		

const Us = mongoose.model('us', { name: String, email: String, surname: String })	// 추가
const Ad = mongoose.model('Ad', { name: String, email: String})	// 추가

AdminBro.registerAdapter(AdminBroMongoose)	

const adminBro = new AdminBro({
  resources: [ Us, Ad ],
})

const router = AdminBroExpress.buildRouter(adminBro)

app.use(adminBro.options.rootPath, router)

 

 

이렇게 왼쪽 사이드바에 model을 잘 가져온다