基于阿里的Node全栈之路[源码分享]——打造高效的开发流程

上一次,在社区里面有童鞋说,如果系列文章能够有代码作为基石,会更好理解,也对新手会更加的友好,所以这里整理了下我的框架,然后趁着上个周末不出去玩,搭建了一个仿cnode的一个小论坛,并持续的更新下去。

github地址

我的阿里云栖博客

本代码搭建的博客

交流QQ群:428812779

文章列表

基于阿里的Node全栈之路(一)部署Docker

基于阿里的Node全栈之路(二)阿里负载均衡的HTTPS优化方案

基于阿里的Node全栈之路(三)利用阿里云OSS实现前后端分离

基于阿里的Node全栈之路(四)前后端分离进阶-自动上传前端代码到OSS

基于阿里的Node全栈之路(五)前后端分离进阶-接口篇

基于阿里的Node全栈之路(六)专有网络VPC的应用

项目部署

项目分为两部分,前端[www]和后端[api],同时部署也是分开的。
依赖:

Node > 7
Mongodb
Redis

api

后端框架是eggjs,数据库采用mongodb + redis,参数配置可参照下方代码.

/**
 * 参数全部从Docker环境变量中获取
 * @argument mongodb_host mongodb的主机地址
 * @argument redis_host redis的主机地址
 * @argument redis_password redis的访问密码
 * @argument redis_db redis的第几号数据库
 */
const mongodb_host = `mongodb://${process.env.mongodb_host || 'localhost'}/blog`;
const redis_host = process.env.redis_host || 'localhost';
const redis_password = process.env.redis_password || '';
const redis_db = process.env.redis_db || 0;
module.exports = {
  logger: {
    dir: './logs',
  },
  security: {
    csrf: false,
  },
  redis: {
    client: {
      port: 6379,
      host: redis_host,
      password: redis_password,
      db: redis_db,
    },
  },
  mongoose: {
    url: mongodb_host,
    options: {},
  },
};

参数可以自行修改,配好后,构建环境并启动:

npm install & npm run debug
# or
yarn install & yarn run debug

到这里,后端api就启动成功了,可以直接访问 http://localhost:7001/blog/v1/session ,检查是否启动成功。

app

后端框架是vue,采用了vue-cli,模板采用的是webpack,eslint采用airbnb的.

const merge = require('webpack-merge');
const prodEnv = require('./prod.env');
/**
 * 参数从Docker环境变量中获取
 * @argument blog_host 后端api地址
 */
const host = process.env.blog_host ? `"${process.env.blog_host}"` : '"https://api.mumuimp.com/blog/v1"';

module.exports = merge(prodEnv, {
  NODE_ENV: '"development"',
  host,
});

构建环境并启动:

npm install & npm run dev
# or
yarn install & yarn run dev

其实这些参数是可以在系统的环境变量中设置的。
Windows: 参照java环境变量设置,在环境变量中添加blog_host环境变量.(建议在用户变量中添加)
Linux & Mac: 直接在.bashrc或者.bash_profile添加环境变量.


当然!你也可以直接改了它!;)

项目发布

Docker部署api

具体参照基于阿里的Node全栈之路(一)部署Docker

阿里云OSS部署web

创建index.js,具体代码可以参考index-example.js,并填写好你自己的参数:

const store = oss({
  accessKeyId: '< your accessKeyId>',
  accessKeySecret: '< your accessKeySecret>',
  bucket: '< your bucket>',
  region: '< your region>',
});

最后,

yarn run publish

友情推荐:

一个好用的接口管理平台,支持本地部署,开源MIT,去哪儿前端大神团队开发。

亲情推荐:

egg-tablestore,阿里云的tablestore数据库在egg上的插件,为啥亲情推荐呢?因为是我写的, wo lianpi hou.

License

MIT

时间: 2024-12-08 04:32:52

基于阿里的Node全栈之路[源码分享]——打造高效的开发流程的相关文章

基于阿里的Node全栈之路(五)前后端分离进阶-接口篇

上一篇文章我就简单的贴了下代码,放出来不到一天就破千了,这让我非常的意外,也很开心;) 我会好好的把上一篇的代码注释补一下的.然后决定再放一些我的代码和理解,俗话说: Talk is cheap, show me the code! 还记得我的架构中,只有前端静态代码,同时所有的请求是经过跨域发到api上的,那么这次,我们就来好好的分析下request接口的实现和我自己尝试的一种的开发流程--api文档(新接口文档) 先贴上我之前的前后端分离的方式,再简单的介绍下,看过前面文章的同学直接跳过哈!

基于阿里的Node全栈之路(二)阿里负载均衡的HTTPS优化方案

很多时候,我们习惯了自己做负载均衡,自己部署nginx,甚至是自己在代码里实现https.没错这些还是蛮能锻炼动手能力的,但重复造轮子这个话题- 我的主题都是基于阿里云,所以默认各位看官都是用了阿里云的,既然是已经上云了,我觉得上云后的公司更应该是把精力放在业务上,其它方面交给云去处理. 不是我想要去夸阿里云,我自己也是考虑过换云的.今年3月份还是4月份的时候,阿里云在深圳的网络波动,导致我平台上几千个订单提交失败.合作方问我发生了什么事情,后来发现是深圳服务器的网络问题.那个时候,我就很郁闷,

基于阿里的Node全栈之路(一)部署Docker

在经历多次项目技术改革,现在的技术架构基本稳定下来了.一个人的开发不容易啊,想在这里分享下自己的一些想法和走过的一些坑,希望能够帮助到大家.下面放下我现在的技术架构. Docker是个好东西,虽然阿里出了函数计算,但在使用的时候,发现还是缺乏些火候,而且现在的函数计算还是比较适合高CPU型api,鄙见鄙见- 阿里docker的流程: 1. 创建code仓库 2. 创建docker镜像 3. 创建docker容器服务 4. 创建docker的时候,阿里会自动部署负载均衡(https的放在下个文章更

基于阿里的Node全栈之路(六)专有网络VPC的应用

本来打算继续讲讲前后端分离的,但是因为我准备的自开发的博客还没做好,所以还是放到后面几篇文章上好了. 这一篇文章,主要想介绍一下一种网络安全的应用.我也希望有高人能一起交流下这种方式的弱点. 如果用过阿里云容器服务的同学应该都知道,容器的载体还是用镜像生成的的服务器,而这些镜像是阿里自己搞的,所以会有所滞后,所以很多时候,会遇到像图中这种情况,而这些漏洞的升级,又逼得你不得不天天维护,因为这种漏洞出现的概率好高. 我们除了天天去检查漏洞外,还有没有其它的办法能够去处理这些问题呢?做个检查漏洞的,

基于阿里的Node全栈之路(三)利用阿里云OSS实现前后端分离

嘿嘿,上篇文章因为在火车上写的,偷懒了,心存愧疚,还是补发一篇吧! 这次嘞,我们聊聊开发上老生常谈的话题,前后端分离.在文章第一篇里,我用了一张我的架构图,这里我把关于OSS的这部分抽出来. 可以看到这种图上,我的docker是只有restful api的作用,在web端应用,客户访问我的网站的时候,是跳转到OSS上的.没错,没错,在我这里,没有使用类似jsp.asp.ejs这些动态页面.先不说两者的优劣,我这里使用的方案,其实蛮有趣的,而且非常的高效实用!对于中型项目是完全行得通的,大型项目架

基于android的无线视频监控,使用源码可是在pc端显示不了

问题描述 基于android的无线视频监控,使用源码可是在pc端显示不了 http://www.cnblogs.com/feifei1010/archive/2012/08/31/2664939.html在这里可以下载到源码这个是pc端开启服务器这个是android上运行不管是我输入0.0.0.0 还是127.0.0.1 我在pc端的程序看不到视频接入 请大神给予指导 谢谢了 解决方案 http://wenku.baidu.com/link?url=QOLtRQ2FoJRl80QAKsz8OaU

c++ directx-求 基于c++的DirectX 11 3D 综合实例 源码

问题描述 求 基于c++的DirectX 11 3D 综合实例 源码 如图,包含天空盒,四种光照,线框模式开关,雾化,镜面,反射,法线映射,着色体,曲面细分. 不是全都有也可以,最起码有五个. 急求,三天内急求,急急急,谢谢了 解决方案 可以尝试和这位博主交流:http://blog.csdn.net/xoyojank/article/category/337624/2 解决方案二: http://download.csdn.net/album/detail/885 解决方案三: [Direct

基于JavaScript实现添加到购物车效果附源码下载_javascript技巧

我们有很多种方法实现将商品添加到购物车,通常的做法是点击"添加到购物车"按钮,会跳转到购物车,在购物车里可以点击"结算"按钮进行结算.而今天我给大家介绍一个更友好的解决方案. 查看演示 下载源码 默认情况下,购物车是隐藏不可见的,当用户点击添加到购物车按钮后,商品信息会添加到购物车,购物车会以按钮的形式出现在页面右下角,点击按钮则会展开购物车,显示购物车中的商品信息,同时也可以对购物车中的商品进行删除或者结算等操作.用户也可以暂时关闭购物车继续购物. HTML结构

基于jquery步骤进度条源码分享_jquery

基于jQuery网页步骤流程进度条代码里面包含两款不同效果的jQuery步骤进度条特效.效果图如下: 在线预览       源码下载 html代码: <div class="step_context test"></div> 当前步骤: 第<input type="text" value="5" id="currentStepVal" />步 <button onclick="