A Set of Movie Website Management System Implemented by Vuejs Nodejs and Mongodb

A Set of Movie Website Management System Implemented by Vuejs Nodejs and Mongodb

Technology stack vue + vue-router + nodejs + koa2 + mongodb + nginxThe entire system needs environment nginx (distribute requests to nodejs, http2, ssl), nodejs (data processing), mongodb (data storage)

This is a set of movie website management system implemented by nodejs+mongodb

Technology stack vue + vue-router + nodejs + koa2 + mongodb + nginx

The entire system needs environment nginx (distribute requests to nodejs, http2, ssl), nodejs (data processing), mongodb (data storage)

Disclaimer

This project is for learning reference only, please do not use it for any commercial or illegal purposes. I shall not bear any legal liabilities arising therefrom!

Preview

             

Dart-Cms-Manage (Backstage)

Backstage management system part (using vue family bucket)

Dart-Cms-Flutter (Android)

Android APP is developed using google flutter technology

Plug-in

By default, Cms only has three plug-in collection plug-ins, including cover uploading Qiniu CDN, static resource generation, and playback source url replacement. Please click the link below to download more collection plug-ins. Or develop your own collection plug-in development plug-in, use plug-in, download plug-in => plug-in tutorial, plug-in development, install plug-in

Lazy deployment

Hand in hand to develop nodejs movie cms system ③: Lazy deployment of pagoda panel

Description

Requirements: nodejs >=7.6 mongodb >=3.4

installation

#Installation dependencies
npm install

## Initialization data (to create a default data)
npm run build

## Global installation pm2 forever
npm install pm2 forever -g

## Main program starts
pm2 start app.js -i max --name app

## Regular task startup 
forever start cron.js

Part of the configuration in the nginx configuration file

server {
    listen 80 ; 
    ## http mandatory redirect https 
    rewrite ^(. * )$ https:// $host $1 permanent ;
}
server {
    location / {
        proxy_set_header Host $ HTTP_HOST ; 
        proxy_set_header the X--Real-IP $ REMOTE_ADDR ; 
        proxy_set_header the X--Forwarded-the For $ proxy_add_x_forwarded_for ; 
        proxy_set_header the X--nginx-Proxy to true ; 
        ## here because nodejs just opened http, so nginx forwarded to the requesting nodejs of, nodejs own can only identify himself open http, rather than HTTPS 
        ## so the need to add a header field manual that tells nodejs, the current protocol is http or HTTPS 
        proxy_set_header-the X-proxy-protocol " HTTPS " ; 
        ## to the proxy's local agent to background nodejs 
        proxy_pass http://127.0.0.1:9999 ;
    }
    ## Monitor ssl 443 port 
    the listen 443 ssl HTTP2 ; 
    ## fill this domain, open the domain verification only allow access to the domain name 
    server_name xxx.com ;

    ## Open ssl 
    ## Specify ssl certification path 
    ssl_certificate /etc/ssl/xxx.com_chain.crt ; 
    ## specify the private key file path 
    ssl_certificate_key /etc/ssl/xxx.com_key.key ; 
}

system login

Management system address http://localhost:9999/manage/index.html User name: root Password: 123456

Project structure

├─backup // Data backup storage folder
│
├─build // Initialize the database
│   │
│ └──initBase.js // Database initialization operation
│
├─static // static files - front and back pages
│
├─script // Script directory - capture script
│
├─methods // The front-end and back-end logic processing methods follow the mvc mode
│   │
│ ├──manage // Backstage management system catalog - method
│   │
│ ├──public.js // public method of front-end page - method
│   │
│ └──web.js // Front-end page method - method
│
├─router // Global routing directory - interface summary
│   │
│ ├──manage // Backstage management system directory - routing
│   │
│ ├──manage.js // use management system directory - routing
│   │
│ └──web.js // use front-end display routing - routing
│
├─middleware // Middleware directory
│   │
│ ├─router.js // used to verify various paths
│   │
│ ├─service.js // Used to verify that the website is open/closed (the foreground part)
│   │
│ └─userIp.js // Used to process user ip (nginx proxy or nodejs ipv4)
│
├─utils // tool method, configuration file
│   │
// Cookie ├─cookie │ < = > the session storage middleware > mount ctx.sessin1
│   │
// token ├─token │ < = > the session storage middleware > mount ctx.session2
│   │
│ ├─pipeline // mongodb pipeline query model
│   │
│ ├─authToken.js // verify that the token is valid
│   │
│ ├─baseConnect.js // mongodb connection file
│   │
│ ├─config.js // initialize database configuration parameters
│   │
│ └─tools.js // Tool function
│
├─app.js // project main file (using pm2 guardian)
│
├─cron.js // Timed task file (use forever guard alone)

Download Details:

Author: abcd498936590

Source Code: https://github.com/abcd498936590/Dart-Cms

vue vuejs javascript

Bootstrap 5 Complete Course with Examples

Bootstrap 5 Tutorial - Bootstrap 5 Crash Course for Beginners

Nest.JS Tutorial for Beginners

Hello Vue 3: A First Look at Vue 3 and the Composition API

Building a simple Applications with Vue 3

Deno Crash Course: Explore Deno and Create a full REST API with Deno

How to Build a Real-time Chat App with Deno and WebSockets

Convert HTML to Markdown Online

HTML entity encoder decoder Online

8 Popular Websites That Use The Vue.JS Framework

In this article, we are going to list out the most popular websites using Vue JS as their frontend framework. Vue JS is one of those elite progressive JavaScript frameworks that has huge demand in the web development industry. Many popular websites are developed using Vue in their frontend development because of its imperative features.

Vue Native is a framework to build cross platform native mobile apps using JavaScript

Vue Native is a framework to build cross platform native mobile apps using JavaScript. It is a wrapper around the APIs of React Native. So, with Vue Native, you can do everything that you can do with React Native. With Vue Native, you get

How to Make a Simple Vue Custom Select Component

In this article, you’ll learn how to build a Vue custom select component that can be easily be styled using your own CSS. In fact, it’s the same component that we use in production on Qvault, and you can see it in action on the playground.

Creating a Custom Tooltip Component in Vue

There are plenty of libraries out there that will have you up and running with a good tooltip solution in minutes. However, if you are like me, you are sick and tired of giant dependency trees that have the distinct possibility of breaking at any time.

Vue ShortKey plugin for Vue.js

Vue-ShortKey - The ultimate shortcut plugin to improve the UX .Vue-ShortKey - plugin for VueJS 2.x accepts shortcuts globaly and in a single listener.