├── .gitignore
├── ejs
├── index.ejs
├── partials
│ ├── head.ejs
│ └── navbar.ejs
└── features.ejs
├── middlewares.js
├── routes
└── servers.js
├── static
├── demo
│ ├── features.html
│ └── index.html
└── app.js
├── package.json
├── controllers
└── servers.js
└── index.js
/.gitignore:
--------------------------------------------------------------------------------
1 | .idea
2 | node_modules
--------------------------------------------------------------------------------
/ejs/index.ejs:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | <%- include('./partials/head'); %>
5 |
6 |
7 | <%- include('./partials/navbar'); %>
8 |
9 |
Main Page
10 |
11 |
12 |
--------------------------------------------------------------------------------
/middlewares.js:
--------------------------------------------------------------------------------
1 | import colors from 'colors'
2 |
3 | export function requestTime(req, res, next) {
4 | req.requestTime = Date.now()
5 | next()
6 | }
7 |
8 | export function logger(req, res, next) {
9 | console.log(colors.bgGreen.black(`Req.time: ${req.requestTime}`))
10 | next()
11 | }
--------------------------------------------------------------------------------
/routes/servers.js:
--------------------------------------------------------------------------------
1 | import {Router} from 'express'
2 | import {getAll, create, remove} from '../controllers/servers.js'
3 | const router = Router()
4 |
5 | router.get('/api/server', getAll)
6 |
7 | router.post('/api/server', create)
8 |
9 | router.delete('/api/server/:id', remove)
10 |
11 | export default router
12 |
--------------------------------------------------------------------------------
/static/demo/features.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
7 |
8 | Express App
9 |
10 |
11 | Hello Features
12 |
13 |
--------------------------------------------------------------------------------
/ejs/partials/head.ejs:
--------------------------------------------------------------------------------
1 |
2 |
4 |
5 |
6 | <%= title %>
--------------------------------------------------------------------------------
/static/demo/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
7 |
8 | Express App
9 |
10 |
11 | Hello Express
12 |
13 | Go to features
14 |
15 | Download this page
16 |
17 |
--------------------------------------------------------------------------------
/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "express-cc",
3 | "version": "1.0.0",
4 | "description": "",
5 | "main": "index.js",
6 | "type": "module",
7 | "scripts": {
8 | "serve": "nodemon index.js",
9 | "start": "node index.js"
10 | },
11 | "keywords": [
12 | "express"
13 | ],
14 | "author": "Vladilen",
15 | "license": "ISC",
16 | "dependencies": {
17 | "colors": "^1.4.0",
18 | "ejs": "^3.1.5",
19 | "express": "^4.17.1"
20 | },
21 | "devDependencies": {
22 | "@types/express": "^4.17.10",
23 | "nodemon": "^2.0.7"
24 | }
25 | }
26 |
--------------------------------------------------------------------------------
/controllers/servers.js:
--------------------------------------------------------------------------------
1 | let servers = [
2 | {id: '1', name: 'AWS', status: 'working'},
3 | {id: '2', name: 'Google Cloud', status: 'working'},
4 | {id: '3', name: 'Yandex Cloud', status: 'working'},
5 | {id: '4', name: 'Microsoft', status: 'pending'}
6 | ]
7 |
8 | export const getAll = (req, res) => {
9 | res.status(200).json(servers)
10 | }
11 |
12 | export const create = (req, res) => {
13 | const newServer = {
14 | id: Date.now().toString(),
15 | ...req.body
16 | }
17 | servers.push(newServer)
18 | res.status(201).json(newServer)
19 | }
20 |
21 | export const remove = (req, res) => {
22 | servers = servers.filter(s => s.id !== req.params.id)
23 | res.json({message: 'Server has been removed.'})
24 | }
--------------------------------------------------------------------------------
/index.js:
--------------------------------------------------------------------------------
1 | import express from 'express'
2 | import path from 'path'
3 | import {requestTime, logger} from './middlewares.js'
4 | import serverRoutes from './routes/servers.js'
5 |
6 | const __dirname = path.resolve()
7 | const PORT = process.env.PORT ?? 3000
8 | const app = express()
9 |
10 | app.set('view engine', 'ejs')
11 | app.set('views', path.resolve(__dirname, 'ejs'))
12 |
13 | app.use(express.static(path.resolve(__dirname, 'static')))
14 | app.use(express.json())
15 | app.use(express.urlencoded({ extended: false }))
16 | app.use(requestTime)
17 | app.use(logger)
18 |
19 | app.use(serverRoutes)
20 |
21 | app.get('/', (req, res) => {
22 | res.render('index', {title: 'Main Page', active: 'main'})
23 | })
24 |
25 | app.get('/features', (req, res) => {
26 | res.render('features', {title: 'Features Page', active: 'features'})
27 | })
28 |
29 | app.listen(PORT, () => {
30 | console.log(`Server has been started on port ${PORT}...`)
31 | })
--------------------------------------------------------------------------------
/static/app.js:
--------------------------------------------------------------------------------
1 | const App = {
2 | data() {
3 | return {
4 | servers: [],
5 | name: ''
6 | }
7 | },
8 | methods: {
9 | async createServer() {
10 | const data = {
11 | name: this.name,
12 | status: 'created'
13 | }
14 | const res = await fetch('/api/server', {
15 | method: 'POST',
16 | headers: {
17 | 'Content-Type': 'application/json'
18 | },
19 | body: JSON.stringify(data)
20 | })
21 | this.name = ''
22 | const newServer = await res.json()
23 | this.servers.push(newServer)
24 | },
25 | async remove(id) {
26 | await fetch(`/api/server/${id}`, {method: 'DELETE'})
27 | this.servers = this.servers.filter(s => s.id !== id)
28 | }
29 | },
30 | async mounted() {
31 | const res = await fetch('/api/server')
32 | this.servers = await res.json()
33 | }
34 | }
35 |
36 | Vue.createApp(App).mount('#app')
--------------------------------------------------------------------------------
/ejs/partials/navbar.ejs:
--------------------------------------------------------------------------------
1 |
--------------------------------------------------------------------------------
/ejs/features.ejs:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | <%- include('./partials/head'); %>
5 |
6 |
7 | <%- include('./partials/navbar'); %>
8 |
9 |
Features Page
10 |
11 |
12 |
18 |
19 | Loading...
20 |
21 |
22 | -
23 | {{ server.name }}
24 | {{ server.status }}
25 |
26 |
27 |
28 |