react简介: 一.使用react 创建一个PC端的项目 (a):使用 yemon 创建一个 webpack 的 react 的项目 控制台安装并且产看 yemon 的版本 yo -v (b): 全局安装 webpack react 的模板 genrator,如果安装过了,就跳过 npm install -g generator-react-webpack (c):进图项目目录文件:执行 yo react-webpack +项目名字 这样我们的项目就创建好了,在项目根目录下执行 npm run…

原文链接 Docker单独部署前端项目和Node项目是非常便捷的,在这里分享一下Docker的使用,主要聊聊它的部署实践.(我是window10专业版安装Docker) Docker Docker是一种应用容器引擎技术,类似于虚拟机,不过它的实用性.通用性.便捷性更强,Docker容器可以说就是VM,不过占用资源更少,更轻量,通过操作系统级虚拟化方法,利用更加节省的硬件资源提供给用户更多的计算资源. Docker容器是Linux 容器的一种封装,由于容器存在独立的运行环境,Docker可以将应用…

这几天尝试用node开发一个网站,后端的接口已经初步开发完成,现在开始构建前端的项目,记录下过程,在学习下吧. 用vue-cli 构建项目,myproject.(构架过程略过) 每次在本地构建项目后和远程仓库关联的时候会发现每次都出现种种问题,这一次我要记录下,关联的过程,对自己来说也是一次总结吧 这一次我选择的是github,(国内现在可以使用码云,应该比github快,有机会去尝试一下): 第一步:打开github 这是用vue构建的项目,安装依赖后运行正常 在这个项目根目录下,打开git…

我们把一个多人协作的vue前端项目发布服务器,一般要经过以下步骤: git更新最新的代码 构建项目 把构建后的代码上传到服务器 如果用jenkins来构建的话,只需要点击一次构建按钮,就可以自动完成以上的步骤了,而且根据需求,可以实现更多的功能. 1.下载安装jenkin 1.1 java环境 jenkins需要运行在Java的环境中,所以前提是需要先安装jdk,测试jdk是否安装好,在命令行输入:java -version 1.2 下载jenkins 下载地址 jenkins下载 下载后点击安…

前言 公司据说要搞前后端分离,趁这两天项目完成的差不多,抓紧时间学习一下前端知识 现在流行前端项目工程化,那么第一个问题就是如何创建工程(项目),第一次玩webpack 通过 NPM 创建项目 # 创建项目 npm init -y -y 在这里是表示快速新建.使用 npm init 来初始化,终端会一步一步提示输入 name.version.description 等项目 meta 信息,通过使用 flag -y 跳过所有的 prompt,一路到底完成默认值的初始化. 完成后 NPM 会自动在目…

现在各种前端框架, 库文件基本都托管到npm上, 我们平常下载到别人的项目文件, 也基本是用npm 构建的, 不了解点node和npm那是寸步难行. 下面介绍的代码示例不敢说是最佳实践, 但都是我亲自在自己机器上测试有效的. 测试环境: win10, node v8.4, npm v5.3. package.json package.json文件非常重要, 我们拿到别人的项目第1眼便是看package.json里有什么, 我们自己 创建个新项目, 首先就要创建好package.json文件. 假…

早期的前端是由后端开发的,最开始的时候仅仅做展示,点一下链接跳转到另外一个页面去,渲染表单,再用Ajax的方式请求网络和后端交互,数据返回来还需要把数据渲染到DOM上.写这样的代码的确是很简单.在Web交互开始变得复杂时,一个页面往往有非常多的元素构成,像社交网络的Feed需要经常刷新,展示内容也五花八门,为了追求用户体验需要做很多的优化. 当时说到架构时,可能会想前端需要架构吗,如果需要,应该使用什么架构呢?也有可能一下就想起了MVC/MVP/MVVM架构.在无架构的状态下,我们可以写一个HT…

https://segmentfault.com/a/1190000003060016 离开qunar有一个多月了,在离开的时候就决定不再用fekit.做出这个决定并不是因为fekit不好,恰恰相反,fekit帮我们做了很多事情,还屏蔽了许多细节,让开发人员能够专注于开发过程.不过随着fekit的升级,也出现了一些问题,同时fekit和公司业务及发布流程有一定耦合,所以觉得采用开源的构建方案. 在使用gulp的过程中,基本也是依据使用fekit的思路来逐步完善构建过程的,所以还是要感谢fekit…

什么是 gulp? gulp.js 是一个自动化构建工具,开发者可以使用它在项目开发过程中自动执行常见任务.gulp.js 是基于 node.js 构建的,利用 node.js 流的威力,你可以快速构建项目并减少频繁的 IO 操作.gulp.js 源文件和你用来定义任务的 gulp 文件都是通过 javascript(或者 coffeescript )源码来实现的.更多关于 gulp,可以通过官网了解. 什么是 browsersync? browsersync 能让浏览器实时.快速响应您的文件(…

1. grunt构建工具是基于nodejs上的,所以在使用之前一定要先安装好nodejs 2. 安装好nodejs后,node -v查看node版本 npm-v 查看npm版本信息 3. 在需要用到的项目文件下安装grunt,安装命令 :npm install grunt ,安装之后无法执行grunt命令,需安装一个全局的grunt-cli ( grunt命令操作 ) 安装命令:npm install -g grunt-cli,再使用 grunt --version 查看grunt-cli版本…