Nodejs/koa2应用 - 构建一个很酷的web相册.

Koa-album

基于Nodejs和Koa2的一个web相册应用，代码逻辑不算太难，也算是koa的入门吧。没有使用到一些常用的中间件，比如koa-static和koa-router,都是自己做的轮子,原生做静态资源和路由处理，有空再认真看下它们的源代码。

前端方面还做了个类似fancybox的图片预览器gallery.js,和lazyload,样式配色什么的,都按照自己喜欢地来了。

Github地址

在线预览

如果无法预览可能是服务器到期了……可以开启本地服务。

本地预览

安装项目依赖

npm install 

启动本地服务 访问localhost:8888 即可看到效果

node app.js

修改JS/CSS代码

gulp dev

压缩JS/CSS代码

gulp build

截图预览

主要文件和目录介绍

├─views 模板文件
├─static 静态文件 主要是页面压缩过后的 CSS/JS
├─src 前端脚本目录
│ ├─css
│ │ ├─_import gallery效果(类似fancybox实现)
│ │ │ └─gallery.sass
│ │ ├─style.sass 主要的样式
│ │ ├─mobile.sass 响应式
│ │ ├─media.sass 媒体查询
│ │ ├─flow.sass 流式图片布局（这个还没用到）
│ │ └─base.sass 基础样式
│ └─js
│ │ ├─utils.js
│ │ ├─lazyload.js lazyload
│ │ ├─index.js 主脚本
│ │ ├─gallery.js gallery脚本
│ │ └─dom.js 一些dom的操作扩展
├─assets 相册目录
│ ├─albums
│ │ ├─AlenaAenami
│ │ └─Wallhalla
│ ├─sites.json 站点信息
│ └─albums.json 相册信息
├─lib node端脚本
│ ├─helpers ejs辅助函数
│ │ ├─partial.js
│ │ ├─js.js
│ │ ├─helper.js
│ │ └─css.js
│ ├─utils.js
│ ├─router.js 路由
│ ├─render.js ejs渲染函数
│ ├─mime.js
│ ├─handler.js 处理函数
│ ├─error.js
│ └─data.js 数据获取工具
├─.babelrc
├─.gitignore
├─app.js 程序入口
├─README.md
├─package.json
├─package-lock.json
└─gulpfile.js

如有什么疑问欢迎到github开issues。