venture management

Un proyecto completo que incluye vuejs y nodejs

Un proyecto de Vue.js para vue.js y node.js, relacionado con vuex,vue-router,express4,sequelize,stylus,axios,etc.

Descripción del proyecto

El sistema de gestión de riesgos es un proyecto desarrollado en mi tiempo libre. Es un proyecto sencillo de nivel inicial. Se dice que es simple porque las páginas y funciones implementadas son simples, pero eso no significa que la tecnología utilizada sea simple (para front-end junior).

La mayoría de los puntos técnicos de vue y element-ui se utilizan en el proyecto, lo que puede ser una referencia para que los niños aprendan vue. Por supuesto, dado que este proyecto también es un proyecto completo, también es una buena plantilla de referencia para algunos front-end que quieran aprender sobre el nodo. El proyecto también tiene algunos tokens de cifrado y otras cosas que se utilizarán en proyectos reales en línea. , y todos también pueden aprender de ello.

Dado que este proyecto es un proyecto de pila completa, antes de iniciar el servidor de nodo, debe instalar la base de datos mysql y modificar los elementos de configuración de la base de datos en config/index.js. Si tiene alguna pregunta o encuentra errores en el proyecto durante el proceso de instalación, puede hacerme preguntas en los problemas y haré todo lo posible para responderlas.

Ser vago efectivamente es una buena cualidad de un programador. ¡Espero que este proyecto pueda ayudar a todos!

pila de tecnología

• Tecnología frontal

vue2 + vuex + vue-router + paquete web + ES6/7 + axios + lápiz óptico + elemento-ui

• tecnología de fondo

node.js + express4 + sesión + secuela + mysql + lodash.js + bcrypt + jwt

Función de implementación

• Iniciar sesión - Completo
• Registro - Completo
• Consulta sobre la condición del proyecto/monto: completa
• Visualización de lista y paginación - completado
• Agregar/modificar elementos - Listo
• Página de detalles de cuota: completa
• Cierre de sesión de usuario: completo
• Cerrar sesión - Listo

Introducción a la estructura del directorio

 |-- build                            // webpack配置文件
|-- config                           // 项目打包路径
|-- screenshots                      // 效果图截屏
|-- server                           // express后端，用于提供Api
|-- src                              // 源码目录
|   |-- assets                       // 资源文件
|   |-- components                   // 公共组件
|   |-- fetch                        // 接口定义与配置
|   |-- pages                        // 相关页面
|   |-- router                       // 路由配置
|   |-- vuex                         // 状态管理
|   |-- App.vue                      // 页面入口文件
|   |-- main.js                      // 程序入口文件，加载各种公共组件
|-- static                           // 静态资源文件
|-- .babelrc                         // ES6语法编译配置
|-- .editorconfig                    // 代码编写规格
|-- .gitignore                       // git忽略的文件
|-- .postcssrc.js                    // post-loader的插件配置文件
|-- .favicon.ico                     // 网站logo图标
|-- index.html                       // 入口html文件
|-- package.json                     // 项目及工具的依赖配置文件
|-- server.js                        // node server入口文件
|-- README.md                        // 说明

Demostración de efectos

Figura 1

Figura 2

Figura 3

Figura 4

Operación del proyecto

 # 安装依赖
npm install

# 启动vue前端项目(http://localhost:8080/...)
npm run dev

# 启动node后端项目(http://localhost:8081/...)
npm run start