零基础搭建前后端分离项目

既然选择了远方，便只顾风雨兼程 __ HANS许

系列：零基础搭建前后端分离项目
前端

  • NodeJs

    Node.js 是一个基于 Chrome V8 引擎的 JavaScript 运行环境。
    Node.js 使用了一个事件驱动、非阻塞式 I/O 的模型，使其轻量又高效。

  • npm&cmpm

    npm 是 JavaScript 世界的包管理工具,并且是 Node.js 平台的默认包管理工具。通过 npm 可以安装、共享、分发代码,管理项目依赖关系。
    cnpm 这是一个完整 npmjs.org 镜像,你可以用此代替官方版本(只读),同步频率目前为 10分钟 一次以保证尽量与官方服务同步。

    NPM是随同NodeJS一起安装的包管理工具(类似nuget)，能解决NodeJS代码部署上的很多问题，常见的使用场景有以下几种：

    • 允许用户从NPM服务器下载别人编写的第三方包到本地使用。
    • 允许用户从NPM服务器下载并安装别人编写的命令行程序到本地使用。
    • 允许用户将自己编写的包或命令行程序上传到NPM服务器供别人使用。

  • yarn

    yarn跟npm类似，但各有优缺点，大家可以看下这篇文章了解下：https://www.jianshu.com/p/254794d5e741
    Yarn 对你的代码来说是一个包管理器， 你可以通过它使用全世界开发者的代码， 或者分享自己的代码。Yarn 做这些快捷、安全、可靠，所以你不用担心什么。

  • Webpack

    Webpack 是一个前端资源加载/打包工具。它将根据模块的依赖关系进行静态分析，然后将这些模块按照指定的规则生成对应的静态资源

    webpack描述
    webpack描述

    1. 忽略不用的静态资源。这对删减不必要的CSS尤其有用。Webpack只会将你的应用真正需要使用的资源放到dist目录中
    2. 便捷的代码分裂。例如，你知道你的文件Homepage.js只需要require几个特定的CSS样式，Webpack会根据你的需要创建一个homepage.css文件来减少文件体积。
    3. 你来控制静态资源被执行的方式。如果一个图片大小低于某个特定的值，你可以用base64来将它转码直接引入到你的JavaScript文件中，从而减少HTTP请求次数。如果一个JSON文件太大，那么你可以通过一个URL来加载它。你可以通过require(‘./style.less’)来将less文件自动转为纯CSS
    4. 稳定的生产环境。你不会将不用的图片或旧的CSS部署到服务器上。
    5. 当你熟练掌握了之后用起来会非常快。你可以热更新页面，管理正确地CSS，自动更新CDN缓存。Webpack可以自动更新文件名及相关内容。

  • Sass

    Sass 是一个 CSS 的扩展，它在 CSS 语法的基础上，允许您使用变量 (variables), 嵌套规则 (nested rules), 混合 (mixins), 导入 (inline imports) 等功能，令 CSS 更加强大与优雅。使用 Sass 以及 Compass 样式库 有助于更好地组织管理样式文件，以及更高效地开发项目。

  • Less

    Less 是一门 CSS 预处理语言，它扩展了 CSS 语言，增加了变量、Mixin、函数等特性，使 CSS 更易维护和扩展。
    Less 可以运行在 Node 或浏览器端。

  • TypeScript

    TypeScript是JavaScript类型的超集,它可以编译成纯JavaScript。 TypeScript可以在任何浏览器、任何计算机和任何操作系统上运行，并且是开源的。

  • Vue

    Vue.js（读音 /vjuː/, 类似于 view）是一个构建数据驱动的 web 界面的渐进式框架。
    Vue.js 的目标是通过尽可能简单的 API 实现响应的数据绑定和组合的视图组件。它不仅易于上手，还便于与第三方库或既有项目整合。
    另一方面，当与单文件组件和 Vue 生态系统支持的库结合使用时，Vue 也完全能够为复杂的单页应用程序提供驱动。

服务端（后端）
  • ASP.NET WebApi

    ASP. NET Web API支持能够轻松地创建功能强大的 Web API，可以从范围广泛的客户端 （包括使用 JavaScript从浏览器中，到任何移动/客户端平台上的本机应用程序）访问。

系列文章规划
posted @ 2018-12-23 16:12  HANS许  阅读(4531)  评论(1)  编辑  收藏  举报