如何设计一个基于Node.js和Express的网站架构

推荐使用Webstorm打开项目。打开项目后，代码结构如下图所示：
在主体结构中从上到下介绍。 app 文件夹包含了所有后端代码； build 文件夹中包含了最新数据库备份； config 包含有网站整体的配置； logs 文件夹包含网站后端记录的日志文件； node_modules 是包含所有的 nodejs 依赖包（源代码中初始没有此文件夹，运行 npm install 命令后所有加载的依赖包放置在此文件夹中）； public文件夹包含了所有的前端代码，包括JavaScript、less、、Webfont等； bowerrc中定义了 bower 管理前端库的下载地址； bowerjson 则配置了项目需要的前端库；jshintre-client 和 jshintrc-server 分别为前后端JavaScript代码规范检查规则；travisyml 为[travis]（travis-ciorg/）自动编译配置； appjs 为nodejs启动脚本文件； buildsh 为单独编写的自动发布bash命令；gruntfilejs为 grunt 配置文件；newrelicjs为 newrelic 的配置文件，用于监控网站性能； packagejson 包含了所有nodejs依赖包配置。
项目后端结构
项目后端代码架构如下图所示：
主要分为两大部分： app 和 config 。 app 里面按照职责不同来分类，每个脚本文件对应于不同的模块； api 文件夹包含了所有api对应的业务逻辑代码， helper 放置一些公用方法，如邮件发送、日志记录、数据库连接等等； templates 放置的是静态邮件模板； views 是后端页面模板，使用了 handlebar 模板引擎，其中 >使用github作为静态博客的托管，比如jekyll、hexo等
使用git来管理自己的工作文档（使用纯文本文件markdown，word之流的不适用）
使用github来向开源程序的作者提问题（比email更方便一些，且能得到更多的人的帮助）
使用git做网站维护（每次先将网站的服务器上的程序程序下载到本地，修改过commit到git后再覆盖到网站的服务器上）
使用git做程序代码收集器，使用分支和标签的功能来管理同一套的程序各种主题、插件等内容。

Github在3月19号开放了新的项目展示页面（Showcase），Showcase根据项目属性来组织、定义一系列的开源项目列表，可以更清晰的发现你所需要的开源项目。在3月26日的Showcase中，Github放出了一个新的类目：支撑Github的开源技术，这里列举了Github所使用的一些主要的开源项目。
如下是这些开源项目的介绍：
linguist
语言识别库，能够自动根据项目的代码来识别你所使用的语言。 在你的项目源代码页面，可以看到一个彩条，点开以后会显示项目中的编程语言比例。linguist主要通过文件的后缀来识别，对于一些通用的扩展名，例如m文件，linguist通过一些语言的特征片段来做判断。由于编程语言很多，linguist还不能覆盖所有语言的检测。
jquery-pjax
pjax是Github的联合创始人之一defunkt的作品，它使用html的pushState特性与ajax，可以实现页面内容动态局部刷新，当点击项目源代码页面中具体的一个文件或者文件夹时，你将会看到页面的其他部分是不变的，只有定义的页面DOM会刷新，这里使用的就是pjax。
elasticsearch
Eleasticsearch支撑了Github的搜索功能，2年之前Github使用Solor做搜索，随着用户和托管项目的增加，索引的大小超过了solor节点的最大存储空间，也出现了很多的问题，Github团队在思考解决方案时决定使用Elasticsearch做替换。Github最开始使用ES时，使用了44台亚马逊EC2实例，每台实例配备2T的存储，其中8台实例指负责查询请求。目前，Github已经将原有的EC搜索集群迁移到了东海岸的一个数据中心，使用8台物理主机替换了44台EC2。
Rails
Ruby实现的MVC Web框架。Github的用户界面和功能大部分基于Rails构建，不过需要注意的是现在虽然Rails的项目版本已经发展到了Rails 4，但是Github依旧使用的是自己维护的23分支，对于不保持和现有的Rails主版本号一致的原因，Github员工Kneath做了如下的解释：
花更过的时间来升级更新Rails，将会减少为用户构建新特性的时间，我们更关注用户；
性能问题是一个很重要的考虑。在过去的几年中，我们极大的减少了响应时间。而升级Rails不仅会带来一个更慢的框架，而且还会引入一个不同的架构——我们需要再根据新的框架特性来定位优化性能。我们对于现有的框架已经做了很多的优化以保持性能稳定，最主要的是：将时间花费在升级上不会让我们的架构更快。
过去的三年我们一直在升级这个堆栈，不升级Rails版本我们依然可以使用新的特性。
Redis
Redis是K/V存储系统，知名的NoSQL实现之一，在Github，主要使用Redis来进行队列中的异常处理。在Github早期，曾尝试过很多的基于Ruby的队列机制，也曾使用Amazon SQS，但是这些方案都不能在Github快速增长的同时满足稳定性要求，最终Github迁移到了使用Redis的技术方案resque。
sprocket
Sprocket是一个网站资源打包的Ruby库，它不仅能够管理JavaScript和CSS资源，还可以按照pipline的方式来流式预处理CoffeeScript、Sass、SCSS和LESS代码等；
libgit2
libgit2是一个可移植、纯C语言实现的Git核心方法类库，提供API重新链入Git方法。Github的背后使用的原生的git来实现commit、push等功能，但是使用libgit2来针对桌面应用调用、Ruby代码中调用等；
rugged
libgit2的Ruby类库；
bcrypt-ruby
OpenBSD bcypt()密码哈希算法的Ruby实现；
html-pipeline
html-pipline是一个gem包，可以将现有Github前端HTML中的一些特性进行流式处理，例如在Github的评论框中，你可以@某一个人、输入emoji的表情、使用markdown的语法来写内容等，但是这些都是由单独的插件来控制的，html-pipeline可以流式的使用相应的插件处理原始内容，例如先将markdown转义成html，继而自动添加emoji表情，然后进行代码的语法高亮等。
gemoji
在2013年的QCon北京前夜：Github Drink Up活动中，来自Github的工程师Tim在现场的活动中谈到了他们的一个文化：使用emoji。他解释道：“很多情感使用文字不能做出形象的表达，但是使用emoji表情却能够起到不一样的效果”。在Github现有评论框或其他内容中，都可以看到emoji的身影，所使用的就是gemoji这个gem包。
jekyll
Jekyll是一个静态博客生成的程序，Github中项目的Page页面，默认选型使用的就是jekyll。
gollum
Gollum是一套基于git的wiki系统，Github项目的wiki系统背后使用的就是这套开源框架；
octokitrb
Github API的官方Ruby SDK；
Hubot
Hubot是Github自行开发的一个聊天机器人，当然它已经超过了聊天机器人的范畴，Github作为一个异步办公的团队，日常的协作、沟通很大部分依赖于聊天室，通过Hubot，Github的员工可以在聊天室中给机器人定制一些特定的回复、3D打印模型，甚至通过hubot来部署生成环境的代码、获取服务状态等，在2013年的QCon北京中，Giuthub的工程曾针对如何使用Hubot做运维进行过分享：《ChatOps at GitHub》。
d3
d3是使用JavaScript实现的数据可视化框架，使用HTML、SVG和CSS等，在d3的基础之上发展处诸如crossfilter、NVD3js等一系列扩展或者简化框架，并且形成了一个良好的社区。作者mbostock目前供职于NYTimes，d3是他的博士论文项目，目前Github使用d3来展示托管项目提交历史、记录等的可视化效果图。
plax
plax是控制视差元素的JavaScript类库，你可以在404、505等页面看到它的实现效果。
ace
Ace是一个使用Javascript开发的代码编辑器，具备语法高亮、快捷键绑定等特性， Github使用Ace实现基于web的代码编辑功能。
zepto
Zepo是一个JavaScript框架，其特点是兼容现有jQuery API的同时，自身体积十分小；
zeroclipborad
Github的“点击复制到粘贴板”的功能就是使用的zeroclipboard，zeroclipboard使用一个不可见的Adobe Flash动画来实现复制粘贴，并提供Javascript的API接口以供调用。
charlock_holmes
charlock_holmes用来检测字符编码格式，并可以自动将字符编码转化成UTF-8。
puppet
服务器运维工具，可以进行自动化部署、集群管理等。
moment
moment是一个日期框架，用于解析、验证、格式化日期等，其中一个常用的功能是将原始的Javascript时间类型转化成方便阅读的时间说明格式，例如：”2小时之前“、”3天之前“这种形式。
bower
前端资源包管理工具，可以通过bower install <package>的形式将常用的前端资源下载到本地的项目目录中，例如：bower install bootstrap将会自动下载bootstrap的项目资源到本地的项目目录中，不需要自己手动来下载、移动资源文件，并且通过配置文件可以方便分享给同事、简化项目初始化等；
resque
Resque是Github Enterprise中使用的一个基于Redis的后台作业控制系统，提供可视化的界面，可以方便的监控后台作业的运行状态和监控情况。
另外，Github还发布了“支撑Github Windows客户端的开源项目”和“支撑Github Mac客户端的开源项目”两个Showcase。

随着互联网的不断发展，web前端开发技术的发展有了更多的变化趋势。下面我们就一起来了解一下，目前比较常见的一些web开发技术吧。

1Vuejs

就在两年前，很难想象Vuejs能够忍受迅猛发展的React系统的竞争。经过深思熟虑且久经时间考验的Angular是一回事，但是Vue我们没想到这个开发环境成为前端技术工具列表中的佼佼者。对于那些不熟悉Vue的读者，让我们简要介绍一下它的制胜之道。

，很容易学习并且拥有灵活的创建前端代码的环境，这使得代码编写的出错率较低。Vue的开发者EvanYou曾在Angular工作过。他确定后者对于UI的构建而言不必要且繁琐，他大胆地创建了一个入口门槛很低的前端创建解决方案，因此Vue出现。它旨在帮助那些编程经验很少的设计人员将所有工作都用于创建功能界面。此外，Vuejs支持声明式呈现，异步DOM更新，双向数据绑定，以及严格遵守Web组件规范和HTML模板的简单集成。

2Angular

尽管我们在2018年看到的Javascript库的竞争趋势直接在Angular和Vuejs之间展开，但前者在来年的实用性不会减少。如果你之前还没有使用Angular工作(至少是使用Angular2)，那么你一定要熟悉它的优点。让我们开始吧。

，这个框架需要Javascript与HTML和CSS。二，它是团队协作的理想选择，因为它创建的应用程序可以明确划分为组件-业务逻辑和前端。这是可能的，因为开发环境是基于MVVM(模型-视图-视图-模型)模式下的。三，Angular是创建可扩展应用程序的理想选择，支持与三方库的简单集成。这个框架经常用于构建动态的移动应用，因为它使用了双向数据绑定，这种方法增加了带有丰富动画元素的应用程序的响应能力。

现在，让我们来讨论一下Angular的缺点。一件事情，也是开发人员经常提到的，就是在移动设备上的高耗电量(不过与其他框架相比，通过正确的代码优化，可以减少这个问题)和高入门门槛(如果你是从头开始使用Angular开始工作，那么你要准备好去花费15到2个月的时间去学习它的大量文档)。那些喜欢“简洁”Javascript编码的开发者在刚接触Angular时

3GraphQL

GraphQL是一种有着奇怪语法的API查询语言，由Facebook开发者们开发。它的目的是超越传统的RESTAPIs的功能，同时简化多个源传输的数据集合。

让我们举个具体的列子。想象一下，你需要在正在构建的社交网络框架中显示帖子列表，以及用户的喜好(点赞、收藏等)。在实现方面，这个例子很简单，你只需从下一个数据库端点发出请求。但是，由于这些数据可能来自不同的来源(例如，如果帖子存储在MongoDB或Redis中)，生成的应用将比舒适的工作慢得多。此外，如果您考虑到，随着时间的推移，数据的大小会增加，因此需要更多的存储空间，你会意识到，RESTAPI迟早会耗尽其效率。这就是GraphQL的用武之地，使用GraphQL而不是使用单独的端点来访问每个资源。你可以使用单个端点，该端点能够同时处理涉及多个数据源的复杂查询。与REST模型相比，GraphQL是一个智能的个人助理，使用你指定的源地址，提供所需的内容。

4Gatsby

如果你的预算比较紧张，但是同时又希望在你的项目中只使用高级技术，那么你一定要尝试Gatsby。Gatsby是KyleMatthews为静态网站的创建而构建的新型解决方案。

它如何优于同行与Jekyll，Hugo或Hexo等流行解决方案不同，这个静态生成器不使用模板，而是信赖于Webpack和React组件(注意React官网本身也是在Gatsby的帮助下编写的)。因此，你可以获得自动更新和即时页面转换等优势。从10版本开始，Gatsby使用了上面提到的GraphQL。因此，在构建过程，它可以从多个GraphQLAPI中获得数据，然后使用它们创建一个完全静态的React客户端应用程序。现在，让我们从枯燥的特征列表转移到真正的问题，看看Gatsby是否适合你。

5Storybook

Storybook是开发者在与React打交道过程中一个有用的开源工具。特别是，得亏StoryBook，你可以在独立的环境中设计和策划应用程序外的UI组件，并且在创建新的UI组件时它会发生变化。如果这个功能对你来说并不太重要，那么让我们考虑一下Storybook将帮助解决几个严重问题的情况。

今天，许多有用的工具支持简单快速地创建功能性客户端-服务器系统，包括着名的Meteor、Firebase、GraphQL和Falcor。电脑培训>

搭个博客吧，从学习编程开始自己搭建了个人博客，两年多时间目前已经积累了一百多篇，想想都觉得不可思议，同时也造福了了不少Android开发者，博客基于jekyll，托管在GitHub，写作用MarkDown，题主如果搭建的话推荐jekyll或者hexo，后者现在更流行点。可google搜索搭建教程！1你们现在的条件太好了，有什么印象笔记、有道云笔记、Office365等，这些软件居然还可以多类终端同步。而且还有诸如Visio、UML等大型的工程级工具。2想当年，我们在实验室被导师逼着，直接把代码写到书上的空白处。一个简单的程序，要写好几页。要修改或做分析的话，还需要用稿纸粘上去。到了学期末，整本书都是乱七八糟的代码与纸张。不过，这种艰苦环境下，的确锻炼出很多东西，我们那一代的很多大牛也是类似这样苦出来的。3现在，我基本上，有3个方法：--A看到经典的代码，会先在有道云笔记上贴着。--B太经典的，会开一个Visio来进行平面分析。--C行数比较多的代码或项目，会动用UML工具来进行层次分析或反向分析。4以上的3种方法的记录效率与分析效率会很高，但显然没有以前低效的手写印象深、感触深，因为手写速度慢，每写一行你都能停下来"咬文嚼字"。试过无数的笔记软件，有evernote类，markdown类，最后感觉还是word好用。笔记类的软件做的太随意，排版组织起来不方便，最后都变成碎片化无用信息。

---