NodejsVuePractice

KO | EN

gitlite — search

#react #golang #android #linux #macos #nodejs #awesome #cli #kubernetes #awesome-list #security #mcp #openai #open-source

NodejsVuePractice

(★ 320)

Vue和Node.js学习

NodejsVuePractice Latest Version Download

Download Latest Version (.zip)

// repository documentation

Was this content helpful?

★ 0 (0 ratings)

## 1 Node说明

[一起学 Node.js](https://github.com/nswbmw/N-blog)
[Node.js v8.4.0 文档](http://nodejs.cn/api/)

## 2 博客项目说明

### 项目说明

0 用ES6+Express+mysql+nginx实现的一个简单博客。
1 整个项目是在[一起学 Node.js ](https://github.com/nswbmw/N-blog)的基础上修改的，除了渲染部分原封不动，其他都基本上重写了。这里再次感谢大神的博客，让我顺利的实现部署。但是由于原来项目的局限性，我根据自己的情况做了更改。
2 尽量使用ES6特性，比如`async/await`,`Promise`等来替代回调魔咒。让代码更加可读。
3 用`mysql`和`nginx`是因为我问别人都说生产环境基本都是这个组合。从而谋生了尽量模拟生产环境的想法。`mysql`和`mongodb`还是有很大的区别，在改造的过程中调试数据花费了很多时间。
4 用`nginx`做静态资源处理，`public`目录下的`css`和图片都通过`nginx`静态加载。实现了动静结合。
5 总共有四个数据库表。表的结构放在`数据表建表文件下`。需要模拟的导入就可以了。
6我已经成功部署到阿里云上面。大家可以点击地址查看，我就不改数据库链接数据了，大家别搞事就好。[线上演示](http://47.96.6.227)。
7整个项目还是比较新颖，难度、广度、新鲜度都维持在一个很好地方。主要还是[nswbmw大佬](https://github.com/nswbmw)底子打得好。
8[代码地址](https://github.com/huang303513/Node.jsAndVue.git)在这里。有不足的地方欢迎大家改正更新。在部署或者搭建的过程中遇到什么问题欢迎开issue反馈沟通。
9 `npm install`安装。然后`npm run dev`来本地运行，数据库链接就是我阿里云的服务器。`npm run start`是我部署到阿里云运行的命令。`npm run prd`是本地模拟阿里云环境

### 演示

![](https://github.com/huang303513/Node.jsAndVue/blob/master/gif/13.gif)

## 3 Vue项目说明

1 WeatherVue练手项目，比较简单、但是是一个完整的项目架子，有兴趣的可以自己拉下来看看改改。
2 这段时间比较忙，天气预报页面做的特别粗糙、代码也写的有些乱，暂时搞一个段落。
3这个项目是我作为新手的学习项目，实现了省市区选择、添加加载、不同天气信息切换、基本上正式项目中用到的模块都有涉及。适合想学vue的朋友入门学习资料。
4技术栈是Vue+VueRouter+webpack+Less+VueResource+VueTouch。

### WeatherVue运行步骤:

1 进入WeatherVue目录
2 `npm install`安装依赖初始化项目
3 `npm run dev`运行项目
4 用浏览器打开`localhost:8080`查看运行效果
5 打包运行,`npm run build`。

### WeatherVue演示:

-![img](https://github.com/huang303513/Node.jsAndVue/blob/master/gif/play.gif)

### 参考资料列表:

[http://cn.vuejs.org/v2/guide/](http://cn.vuejs.org/v2/guide/)
[开发一个插件 (for vue.js) 并发布](https://gold.xitu.io/entry/5846978a128fe1006c59db9f)
[vue-router源码分析-整体流程](https://gold.xitu.io/post/584040e1ac502e006cbedb23)
[剖析Vue原理&实现双向绑定MVVM](https://segmentfault.com/a/1190000006599500)
[利用JavaScript数据绑定实现一个简单的MVVM库](https://segmentfault.com/a/1190000004847657)
[vue-cli#2.0webpack配置分析](https://gold.xitu.io/post/584e48b2ac502e006c74a120)
[vue 2 + vue-router 2 实现SPA](http://www.tuicool.com/articles/bu6FJ3e)
[一个vue实现的轮子](https://zhuanlan.zhihu.com/p/24435564)

NodejsVuePractice

NodejsVuePractice Latest Version Download

Today's picks

Was this content helpful?

Recent Feedback

NodejsVuePractice

NodejsVuePractice Latest Version Download

Today's picks

Was this content helpful?

Recent Feedback

Download README