venture management

Un projet full stack comprenant vuejs et nodejs

Un projet Vue.js pour vue.js et node.js, lié à vuex,vue-router,express4,sequelize,stylus,axios,etc.

Description du projet

Le système de gestion des risques est un projet développé pendant mon temps libre. C'est un projet simple d'entrée de gamme. On dit que c'est simple car les pages et les fonctions implémentées sont simples, mais cela ne veut pas dire que la technologie utilisée est simple (pour les front-ends juniors).

La plupart des points de vue techniques et element-ui sont utilisés dans le projet, ce qui peut être une référence pour les enfants qui apprennent la vue. Bien sûr, puisque ce projet est également un projet full-stack, c'est également un bon modèle de référence pour certains front-ends qui souhaitent apprendre le nœud. Le projet contient également des jetons de cryptage et d'autres éléments qui seront utilisés dans de vrais projets en ligne. , et tout le monde peut aussi en tirer des leçons.

Étant donné que ce projet est un projet full-stack, avant de démarrer le serveur de nœuds, vous devez installer la base de données mysql et modifier les éléments de configuration de la base de données dans config/index.js. Si vous avez des questions ou si vous trouvez des bugs dans le projet pendant le processus d'installation, vous pouvez me poser des questions dans les numéros et je ferai de mon mieux pour y répondre.

Être paresseux est effectivement une bonne qualité d’un programmeur. J'espère que ce projet pourra aider tout le monde !

pile technologique

• Technologie frontale

vue2 + vuex + vue-router + webpack + ES6/7 + axios + stylet + élément-ui

• Technologie back-end

node.js + express4 + session + suite + mysql + lodash.js + bcrypt + jwt

Fonction d'implémentation

• Connexion -- Terminé
• Inscription -- Complétée
• Demande de renseignements sur l'état du projet/montant – Terminé
• Affichage de la liste et pagination -- terminés
• Ajouter/modifier des éléments -- Terminé
• Page de détails du quota – Terminé
• Déconnexion de l'utilisateur -- Terminée
• Déconnexion - Terminé

Présentation de la structure des répertoires

 |-- 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                        // 说明

Démonstration d'effet

Figure 1

Figure 2

Figure 3

Figure 4

Exploitation du projet

 # 安装依赖
npm install

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

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