前端开发环境搭建以及WEB插件

1. 软件安装

1.1 git

1.2.node

1.3 VSCode

2. 代码管理

2.1 github -> 个人/团队

https://github.com/

2.2 gitlab –> 团队

http://siidsv-git1/shinyo/smart-city-platform

2.3 OpenProject –> 团队

http://projects.siid.com.cn/projects/xylg/work_packages?query_props=%7B%22f%22:%5B%7B%22n%22:%22type%22,%22o%22:%22%3D%22,%22v%22:%221%22%7D%5D,%22t%22:%22updated_at:desc%22%7D

2.4 设计稿

https://run.mockplus.cn/Bstuilq0zRiXVMQ6/index.html?to=0381CE3D-B962-4E1C-A875-99CF6DAB4DFC

2.5 接口文档

http://172.18.1.133:10002/swagger-ui.html#/position-controller/getDetailsInBoundsUsingPOST

 

3. web开发

3.1 WEB框架

3.1.1 Angular

1）.Angular  && material：

https://www.angular.cn/docs

https://material.angular.io/

https://loiane.com/2017/07/getting-started-with-angular-material-2/

2）.typescript

https://www.tslang.cn/docs/release-notes/typescript-2.7.html

3.2 JavaScript

1）.ES6/ES7/

http://es6.ruanyifeng.com/

2）.MDN

https://developer.mozilla.org/zh-CN/

https://developer.mozilla.org/zh-CN/docs/Web/JavaScript

https://developer.mozilla.org/zh-CN/docs/Web/JavaScript

3.3 UI框架

3.3.1 bootstrap

https://v3.bootcss.com/

https://v4.bootcss.com/docs/4.0/getting-started/introduction/

3.3.2 ng-bootstrap

https://github.com/ng-bootstrap/ng-bootstrap/tree/master/demo/src/app/components

https://ng-bootstrap.github.io/#/components/datepicker/examples

3.4 CSS预编译

3.4.1 LESS

http://lesscss.cn/

3.4.2 SACC

https://www.sasscss.com/docs/

http://sass.bootcss.com/docs/guide/

3.5 数据可视化

3.5.1 Echarts 

http://echarts.baidu.com/
百度团队开发，是目前我用过的最好用的图表控件，目前有2.x、3.x的版本。

3.5.2 d3.js 

https://d3js.org/
做数据可视化的应该没有不知道d3的吧。

3.5.3 jsPlumb 

https://jsplumbtoolkit.com//
一个连线插件，基于它可以完成流程图/UML的绘制，之前用过是免费的，现在好像也收费了。

3.5.4 JointJS 

https://www.jointjs.com/opensource
jointjs本身开源免费，但是基于它的一套完整框架Rappid收费。jointjs可以绘制丰富的图表、流程图、UML图等。

3.5.5 three.js 

https://threejs.org/editor/
一个3d图形库，基于它可以开发出各种3d交互、图形、游戏等。

3.6 js富文本编辑器/代码编辑器

3.6.1 Ueditor 

https://ueditor.baidu.com/website/onlinedemo.html
百度前端团队开发的富文本编辑器，开源免费，功能丰富

3.6.2 markitup

3.6.3 TinyMCE

3.6.4 CodeMirror 
是一个提供代码在线编辑、代码高亮、语法检查的js插件，目前许多在线代码编辑器都是基于此开发的

3.7 图库

http://www.fontawesome.com.cn/faicons/

http://www.iconfont.cn/

3.8 其他

3.8.1 .ztree

http://www.treejs.cn/v3/faq.php#_206

3.8.2 fancytree

http://wwwendt.de/tech/fancytree/demo/

3.8.3 列表

fancygrid、 jsgrid、 datatables、jqgrid
3.8.4 弹窗

layer

3.8.5 即时通讯

http://layim.layui.com/

layim来自于layui的独立组件

3.8.6 文件上传

http://fex.baidu.com/webuploader/

webuploader 来自于百度FEX团队

3.8.7 导出表格

https://www.npmjs.com/package/js-xlsx

3.8.8 WEB打印

web打印目前要么使用window.print() 要么使用flash插件, 
前者不好控制打印设置 

4 . 地图开发

4.1 百度地图

4.1.1．文档

http://lbsyun.baidu.com/cms/jsapi/reference/jsapi_reference_3_0.html#a2b0

4.1.2.实例

http://lbsyun.baidu.com/jsdemo.htm#d0_4

4.1.3.坐标拾取

http://api.map.baidu.com/lbsapi/getpoint/index.html

5. Hybrid App开发

5.1．Ionic

1.官方网站：

 http://ionicframework.com/getting-started/

2.官网css组件：

 http://ionicframework.com/docs/components/#header

3.App 打包

Android：

https://blog.csdn.net/xif3681/article/details/80857300

ios；

https://blog.csdn.net/xif3681/article/details/80857809

6. 微信小程序

https://mp.weixin.qq.com/?url=%2Fwxopen%2Fbasicprofile%3Faction%3Dindex%26token%3D1817147190%26lang%3Dzh_CN

https://developers.weixin.qq.com/miniprogram/dev/api/qrcode.html

https://developers.weixin.qq.com/miniprogram/dev/framework/view/wxml/event.html

7. 在线开发工具

读书：

https://www.jiumodiary.com/

SVG转换：

https://www.aconvert.com/cn/image/png-to-svg/