028-86261949

当前位置:首页 > 学科资讯 > 2019年Web前端学习地图导航

2019年Web前端学习地图导航

2019/05/05 17:04 分类: 学科资讯 浏览:12

前言

本文列出了很多与前端开发有关的常见网站,博客,工具等,方便快速查阅。


技术社区

GitHub : https://github.com/
高质量的内容创作和分享平台,请记住,作为一为码农,GitHub代表了你的名片。
Stackoverflow: https://stackoverflow.com/
遇到技术问题请先Google,很多答案都能在 Stackoverflow上找到。

 

 

技术博客

掘金:https://juejin.im/
掘金已经被前端同学攻陷,目前来看,国内的很多优秀的前端文章,都能在掘金上找到。
如果你刚开始写前端博客,可以考虑在掘金上发文章。
博客园:https://www.cnblogs.com/
一个很纯粹的技术博客平台。
知乎:https://www.zhihu.com/
很多从事技术开发的同学也开始玩知乎了,阿里的不少前端大牛在知乎上就非常活跃。
CSDN: https://www.csdn.net/
老牌技术博客,无奈广告确实很多。
Segmentfault: https://segmentfault.com/
比较低调的技术博客平台,我个人比较喜欢,内容也挺不错的。

 

 

资讯

虎嗅网:https://www.huxiu.com/
36氪:https://36kr.com/
利器:https://liqi.io/
湾区日报:https://wanqu.co/
Solidot: https://www.solidot.org/
品玩:https://www.pingwest.com/
极客公园:http://www.geekpark.net/

 

 

框架

Vue.js :https://cn.vuejs.org/
React:https://reactjs.org/
Angular: https://angular.cn/
AngularJS: https://angularjs.org/
Koa: https://koa.bootcss.com/ 基于Node.js平台的下一代web开发框架。
Express:http://www.expressjs.com.cn/ 基于Node.js平台,快速,开发,极简的web开发框架。
Egg:https://eggjs.org/zh-cn/ Egg 继承Koa。
Koa 是一个非常优秀的框架,然而对于企业级应用来说,它还比较基础,而Egg 选择kao作为基础框架,在它的模型基础上,进一步对它进行了一些增强。
Electron:https://www.electronjs.cn/
Electron(原名为Atom Shell)是GitHub开发的一个开源js框架。它允许使用Node.js(作为后端)和Chromium(作为前端)完成桌面GUI应用程序的开发。
也就是说,我们可以用 js 语言开发客户端软件了。其实呢,VS Code 这个客户端软件就是用 js 语言写的。
Redux: https://www.redux.org.cn/
Redux 是 JavaScript 状态容器,提供可预测化的状态管理。
ReactNative:https://reactnative.cn/
使用JavaScript编写原生移动应用。
Mpvue : http://mpvue.com/ 基于 Vue.js 的小程序开发框架。

 

 

UI框架

Bootstrap:http://www.bootcss.com/

ElementUI:http://element-cn.eleme.io/

基于 Vue.js 的组件库。

iView:https://www.iviewui.com/
一套基于 Vue.js 的高质量 UI 组件库。

Ant Design:https://ant.design
基于 React 的 UI 组件库,主要用于研发企业级中后台产品。官网推出了 Ant Design pro 作为示例,可以看看。

Ant Design Mobile:https://mobile.ant.design/
一个基于 Preact / React / React Native 的 移动端 UI 组件库。

Ant Design of Vue:https://vue.ant.design/docs/vue/introduce-cn/
Ant Design 的 Vue 实现,开发和服务于企业级后台产品。

 

 

类库

jQuery:http://jquery.com/

Zepto.js:https://zeptojs.com/

可以理解成是移动端的 jQuery。

ECharts:https://echarts.baidu.com/
使用 JavaScript 实现的开源可视化库。

 

 

CSS

Sass:https://sass-lang.com/
Sass 是成熟、稳定、强大的 CSS 扩展语言。入门文档可以看:http://sass.bootcss.com/

Less:http://lesscss.org/
给 CSS 加点料。入门文档可以看:https://less.bootcss.com/

Stylus:http://stylus-lang.com/

 

 

构建

NPM:https://www.npmjs.com/

Yarn:https://yarnpkg.com/zh-Hans/

Webpack:https://webpack.js.org/

Gulp:https://www.gulpjs.com.cn/

Babel:https://babeljs.io/

ESLint:https://cn.eslint.org/

可组装的JavaScript和JSX检查工具。

PostCSS:https://www.postcss.com.cn/
用 JavaScript 工具和插件转换 CSS 代码的工具

 

调试抓包

whistle:https://wproxy.org/whistle/
代理抓包工具,很好很强大。

Fiddler:https://www.telerik.com/fiddler
代理抓包工具。

 

Mock数据

Easy Mock:https://www.easy-mock.com

编辑器&IDE

VS Code:https://code.visualstudio.com/

Sublime Text:https://www.sublimetext.com/

WebStorm:https://www.jetbrains.com/webstorm/

Atom:https://atom.io/

 

编码规范

Bootstrap编码规范:https://codeguide.bootcss.com/

es6编程风格:http://es6.ruanyifeng.com/#docs/style

Airbnb Javascript Style Guide:https://github.com/airbnb/javascript

 

静态站点搭建工具

Hexo:https://hexo.io/zh-cn/

VuePress:https://www.vuepress.cn/

GitBook:https://www.gitbook.com/

 

图标

Font Awesome:http://www.fontawesome.com.cn/

Iconfont:https://www.iconfont.cn/

icomoon:https://icomoon.io/

EasyIcon:https://www.easyicon.net/

icons8:https://icons8.cn/

IconStore:https://iconstore.co/

iconninja:http://www.iconninja.com/

 

原型设计工具

墨刀:https://modao.cc/

 

工具
CanIUse:https://caniuse.com/
浏览器兼容性查询。前端同学必须要知道。

国家企业信用信息公示系统:http://www.gsxt.gov.cn
通过这个网站,我们可以查到任何一家公司的基本信息(成立时间、法定代表人等)。如果你在这个网站上没有找到某公司的信息,放心吧,这个公司一定是个骗子。

ProcessOn:https://www.processon.com/
在线制作流程图。推荐。

幕布:https://mubu.com
极简大纲笔记、一键生成思维导图。非常好用。

JSON格式化:http://www.bejson.com/

草料二维码:https://cli.im/

短链生成:http://www.dh6.ink/

GitHub短网址:https://git.io/

图片压缩:https://www.yasuotu.com/

在线PS:https://www.photopea.com/

图片在线裁剪:https://www.asqql.com/gifc/

多数据源IP地址查询:https://haoip.cn/

Gif添加字幕:http://www.yingjingtu.com/

Photoshop的投影参数转换为 CSS代码:https://psd2css.mezw.com/

将Photoshop设计文件图层中的混合选项参数快速转换为CSS3代码,以节省前端开发人员的时间和精力。

Get Emoji:https://emoji.svend.cc/

图片转Ascii:http://picascii.com/

视频转GIF:https://github.com/vvo/gifify

OCR文字识别:https://app.xunjiepdf.com/ocr

#标签:Web前端,学习资源