Summarize front-end website resources

1--------Step into the front end! ! ! !

Front-end knowledge system
Front-end knowledge structure
Free programming Chinese book index
Ruan YifengJavascript
Proficient in JavaScript development
The most complete collection of this trap in JavaScript-- No one
Front-end development notebook https://li-xinyang.gitbooks.io/frontend-notebook/content
Front-end developer manual https://dwqs.gitbooks.io/frontenddevhandbook/content
Front-end Introductory Tutorial
Necessary PS Skills for Front-end Engineers - Picture Cutting

2--------jQuery

jQuery API Chinese Documentation
Learn jquery

3--------CSS

CSS Grammar Reference
CSS3 Animation Manual
Zhiye css gadget collection http://linxz.github.io/tianyizone
bouncejs Touch Library
animate.csshttp://daneden.github.io/animate.css

4--------Angularjs

Some of Angular.js Learning resources
angularjs Chinese community
Angularjs source code learning
angular’s ​​encapsulation of bootstraphttp://angular-ui.github.io/bootstrap
angularjs + nodejs
Lv DabaoAngularjs
AngularJS Best Practices
Some extended directives for Angular http://www.lovelucy.info/angularjs-best-practices.html
Angular Data Binding Principles
Some extended Angular UI components
Take you there Near AngularJS - Basic Function Introduction

Angularjs Development Guide
Angularjs Learning
angular jq mobile
angular uihttp://mgcrea.github.io/angular-strap
Have jQuery background, How to use AngularJS programming ideas
angular study notes

5--------ES6

exploring-es6
exploring-es6 translation

6--------React

react.js Chinese Forum
react.js Official website https://facebook.github.io/react/index.html
react.js Official documentation https://facebook.github.io/react/docs/getting-started.html
react.js material UI
react.js TouchstoneJS UIhttp://touchstonejs.io
react.js amazeui UI
React introductory example tutorial - Ruan Yifeng
React Native Chinese version
Webpack and React book-Front-end stew
Webpack and React book-gitbookhttps://fakefish.github.io/react -webpack-cookbook
webpack
Webpack, 101 entry experience
webpack entry tutorial
Exploration of building front-end engineering solutions based on webpack

7--------Mobile terminal API

99 Mobile terminal knowledge collection
Mobile terminal front-end development knowledge base
Some pitfalls and solutions for mobile front-end (appearance and performance)
[Original] Mobile web resource arrangement
zepto 1.1.2
zepto Chinese comments
Mobile development hodgepodge
Some problems in WeChat webview
http://lin-chao.github.io/2014/11/14/%E5%BE% AE%E4%BF%A1webview%E4%B8%AD%E7%9A%84%E4%B8%80%E4%BA%9B%E9%97%AE%E9%A2%98

8 --------avalon

avalonjshttp://avalonjs.coding.me/
Avalon new generation UI library: OniUI
avalon.oniui-avalon-based component library

9--------Requriejs

Javascript modular programming (1): How to write modules

Javascript modular programming (2): AMD specifications

Javascript modular programming (3): usage of require.js

Getting started with RequireJS (1)
Getting started with RequireJS (2)
Advanced RequireJS (3)
requrie source code learning
requrie Getting Started Guide
requrieJS Study Notes
requriejs One http://cyj.me/why-seajs/requirejs/
require backbone combination

10------ --vue

Vue
Vue Getting Started Guide
Some resource index of Vue
awesome-vue

11--------Seajs

seajs
seajs Chinese manual http://cyj.me/why-seajs/zh

12--------Less,sass

sass
Sass Chinese documentation
less

13--------Markdown

Markdown syntax description (Simplified Chinese version)
markdown entry reference

gitbook Foreign online markdown can be edited into a book
mdeditorA domestic online markdown editor
stackedithttps://stackedit.io A foreign online markdown editor with powerful functions and synchronized cloud disk
mditorhttp://bh -lay.github.io/mditor A lightweight markdown editor
lepture-editor
markdown-editor

14--------D3

d3 Tutorials
Gallery
lofter
iteye
ruanyifeng

15--------Compatibility

esma Compatibility List http://kangax .github.io/compat-table/es6
W3C CSS Validation Service
caniuse
csscreator
microsoft[(v=vs.85.aspx]((v=vs.85.aspx)
Online test compatibility-mobile terminal
emulators

16--------HTTP

HTTP API Design Guide

17----- ---Other API

Verification api
underscore Chinese manual
underscore source code analysis
underscore source code analysis-Yalishizhude's blog http://yalishizhude.github.io/tags/ underscore
underscrejs en api
lodash - replacement for underscore
ext4apihttp://extjs-doc-cn.github.io/ext4api
qwrap manualdocs/_youa/#/qw/ base/loadJs.htm
Easing function
svg Chinese reference
svg mdn reference
svg export canvas
svg export png
localStorage library

18 --------Chart class

Highcharts English API
ECharts Baidu chart software
Amap
Open source vector script framework
svg map

19--------Regular

JS Regular Expression Metacharacters
Regular Expression 30-minute Introductory Tutorial
MDN-Regular Expression
ruanyifeng - RegExp Object
Little Beard Brother-Advanced Regular Expression http:// div.io/topic/764?page=1
is.js
regular online test

20--------ionic

ionic

21--------Front-end

Engineer code writing habits summarized by analyzing the github code base http://alloyteam.github.io/CodeGuide
HTML&CSS coding standards by @mdo
Css naming convention for teamwork - Tencent AlloyTeam front-end team
JS for front-end coding specification - by yuwenhuihttp://yuwenhui.github.io
JS for front-end coding specification - by Li Jing
Front-end development specification Manual
Airbnb JavaScript coding specifications (Simplified Chinese version)
The difference between AMD and CMD specifications
The difference between AMD and CMD specifications
KISSY source code specifications
bt coding specifications
Enhanced version of specifications
Front-end code specifications and best practices
Baidu front-end specifications http://coderlmn.github.io/code-standards
Baidu front-end specifications http://isobar-idev.github.io/code-standards
Baidu front-end specification
ECMAScript6 coding specification--GF Securities front-end team
JavaScript style guide/coding specification (Airbnb company version)
NetEase front-end development specification
css module
Front-end specification resource list

22--------PHP

The most popular PHP code specification
The most popular PHP code specification

23------ --Android

[Agile development]Android team development specifications
Android development specifications and applications

24--------Algorithm

Data structure and Algorithm JavaScript description. Chapter exercises
Common sorting algorithms (JS version)
Classic sorting
Common sorting algorithms-js version
JavaScript algorithm and data structure essence collection
Exquisite lectures on algorithm questions in frequent interview tests

25--------JSON

Simulation to generate JSON data

26--------Html5

HTML5 Yes What demos surprised you?

27--------CSS

browserhacks

28--------Focus Image

myfocus
myfocus-Official Demonstration Site
SuperSlidev2.1 -- Chairman Dahua
soChange

29--------Ext, EasyUI, J-UI and other various UI solutions

extjs
ext4 English api
ext4 Chinese apihttp://extjs-doc-cn.github.io/ext4api

30--------J-UI

J-UI

31--------Other

MUI-The high-performance front-end framework closest to the native APP experience http://dcloudio.github.io /mui

32--------Amaze UI

China’s first open source HTML5 cross-screen front-end framework
Taobao HTML5 front-end framework
KISSY - Alibaba front-end JavaScript library
NetEase Nej - Nice Easy Javascript
Kendo UI MVVM Demo
Bootstrap

33--------Page social sharing function

Baidu sharing terminal
JiaThis terminal
Social sharing component mobile terminal
ShareSDK easily realizes social functions mobile terminal
Umeng Share Mobile terminal

34--------Rich text editing Device

Full-featured tinymce
Baidu ueditor
Classic ckeditor
Classic kindeditor
wysiwyg
A sentimental editor. Bach's Editorhttp://integ.github.io/BachEditor
Tower editor
summernote Editor
html5 editorhttp://neilj.github.io/Squire
wangEditor

35--------PC

Classic my97
Powerful independent date picker
fullcalendarhttp://fullcalendar.io
fullcalendar calendar control knowledge point collection
Lunar Calendar
Date Formatting
A Management Work of Our Group
Input Bitwise Replacement-Official Website
Input Bitwise Replacement-github
bootstrap-daterangepicker
A collection of 30 foreign plug-ins
JavaScript datepicker
Datepair.jshttp://jonthornton.github.io/Datepair.js
A calendar with various styles
Pop-up layered full calendar http://amsul.ca/pickadate. js/date
jquery dual calendar

36--------Date library

Datejs
sugarjs

37------ --Comprehensive effect search platform

Effect Network
17 Material
Commonly used JavaScript code snippets

38--------Overview

Front end Tool Encyclopedia
What is front-end engineering

39--------Gulp

Gulp official website
Gulp Chinese website
gulp data collection
Gulp ：Task automatic management tool - ruanyifeng
Gulp plug-in
Gulp incomplete introductory tutorial
Why use gulp?
Gulp installation and matching components to build front-end development integration
Gulp Getting Started Guide
Gulp Getting Started Guide - nimojs
Gulp Getting Started Tutorial
http://markpop.github.io/2014/09/17/Gulp%E5%85%A5%E9%97%A8%E6%95%99%E7 %A8%8B
Gulp in Action
Gulp Development Tutorial (Translation)
Introduction and techniques for using the front-end construction tool gulpjs

40--------Grunt

gruntjs
Grunt Chinese website

41--------Fis

fis official website http://fex-team.github.io/fis-site/ index.html
fis

42--------pc picture wheel

Left and right buttons for multiple picture switching
fullpage full screen carousel

43 --------Mobile terminal

Sliding screen effect http://www.idangero.us/swiper
Full screen fullpage
Single image switching
Single full screen switching
Single full screen switching
Sliding screen effect
Rotation Drag settings
Similar to swipe switching
Support multiple forms of touch sliding
Sliding screen effect
Chairman pc mobile picture rotation
Sliding screen effect
Fullpage based on zepto
[WebApp]Under fixed-width web design, develop WebApp with fixed-width layout and realize WebApp layout adaptation under multiple terminals

Judge the pitfalls of WeChat client
You can directly call the native sharing tool through javascript
JiaThis Share to WeChat code
Talk about various technologies for mobile cross-platform development
Front-end automated testing
Various rotation pictures http://ajccom.github.io/niceslider
Scroll bar component http://ajccom.github.io/nicescroller
Sliding sidebarhttps://mango.github.io/slideout
fastclick
no-click-delay

44-- ------File upload

Baidu upload component
Upload https://blueimp.github.io/jQuery-File-Upload
flash avatar upload
Picture upload preview
Image crop http://elemefe.github.io/image-cropper
Picture cropping-shearphoto
jQuery image processing

45--------Simulation select

sugar cakeselecthttp://aui.github.io/popupjs/doc/selectbox.html
flexselect
Double select
select2http://select2.github.io

46- -------Color picking plug-in

Interface color picking plug-in similar to Photoshop
jquery color
Color picking plug-in collection
farbtastic circle+square

47 --------City linkage

jquery.cityselect.jsProvince and city or customized linkage effect based on jQuery+JSON

48--------Clipboard

Clipboard
Not Flash Clipboard

49--------Simplified and Traditional Conversion

Simplified and Traditional Conversion

50 --------TableGrid

facebook table http://facebook.github.io/fixed-data-table
Similar to Excel editing table-handsontable
bootstrap-table plug-in
datatables

51--------Online demonstration

js online editing-runjs
js online editing-jsbin
js online editing-codepenhttp:/ /codepen.io
js Online editing - jsfiddle
java Online editing - runjs
js Online editing - hcharts
js Online editing - jsdm
sql Online editing - sqlfiddle
mozilla Online editing Device

52--------Player

Html5 VideoPlayer

53--------Particle Animation

Proton Fireworks http://a-jie.github.io/Proton/#example

54--------Nodejs

Node.js includes teaching but not skills
nodejs scheduled tasks
A nodejs blog
[NodeJS study notes 04]News release system
Have fun for seven days during the Chinese New Year, and have fun learning nodejs
Learn NodeJS in seven days
Nodejs study notes (2)-- - Event module
Getting started with nodejs
angularjs nodejs
Starting from scratch nodejs series of articles http://blog.fens.me/series-nodejs
Understanding nodejs:4bd98440-45e4-4a9a-8ef7-0f7ecbdd56cb
nodejs event polling
getting started with node
nodejs cms
Getting started with Node, a comprehensive NodeJS tutorial

NodeJS code debugging and performance tuning

55--------General optimization

Javascript high-performance animation and page rendering
Mobile H5 front-end performance optimization guide
Front-end performance optimization for web designers and front-end developers
CSS performance analysis and optimization suggestions for complex applications
Zhang Xinxu - Front-end performance
Advanced road to web front-end performance optimization
Front-end technology: CSS image-free technology for website performance optimization
The page is loading Image performance optimization
Hey——Front-end performance
YSLOW Chinese introduction
Repost an article from Yahoo on website performance optimization, and also talk about the optimization to be done on this site
Yahoo! Team practice sharing: website Performance
Website Performance Optimization Guide: What Makes Our Website Slow?
Website performance optimization practice, reduce loading time, improve user experience
Brief discussion on website performance optimization front-end
How to optimize website performance through front-end reconstruction practice?
Front-end performance optimization: Use media queries to load background images of specified sizes
Website performance series blog posts
Loading, not just a little less

Share some tips for optimizing web page loading speed?

Image performance optimization during page loading
[High-performance front-end 1]High-performance HTML
[High-performance front-end 2]High-performance CSS
Talk about website front-end performance and back-end by 12306 Performance Optimization
AlloyTeam——Front-end Optimization
Milliseconds matter, front-end web page performance best practices
How to use the website performance tool Yslow
Front-end engineering and performance optimization (Part 1): Static resource version update and Caching

Front-end engineering and performance optimization (Part 2): Static resource management and template framework

What happens in the first few milliseconds of HTTPS connection
Yslow
YUISlide, for mobile devices Animation performance optimization http://jayli.github.io/blog/data/2011/12/23/yuislide.html
Best front-end practices to speed up the website
Why Website Speed ​​is Important
Need for Speed ​​– How to Improve your Website Performance
Alibaba Wireless Front-End Performance Optimization Guide (Pt.1 Loading Period Optimization

56--------Optimization Tool

JavaScript Performance Analysis New tool OneProfile
JavaScript heap memory analysis new tool OneHeap

57--------Online tool

Alibaba-free testing service
Alibaba-F2etest multi-browser Compatibility testing solution
js performance testing

58--------Front-end architecture

Technical Architecture
Front-end Architecture http://saito.im/note/The-Architecture-of-F2E
How to become a front-end architect
About front-end architecture-Zhang Kejun
Baidu Tencent offer comparison (Tencent Games VS Baidu Infrastructure)

59--------Recommended works

fgmhttp://www.fgm.cc/learn
Cen An’s Works Collection
Dangnaite demo collection http://kmdjs.github.io
米empty js works
SeaJS component library http://panxuepeng.github.io/seajslib
Yan Haijing’s works
Jiaoer Online works
javascript personal works
Miaowei Lei Dongsheng's game works
javascript works collection
Yunwubi, grayscale generation tool
Project homepage http://koen301.github.io
Personalized Works Home Page
Intelligent Society
Example Display Rack
jyg Game Case
Many jquery plug-ins
Boogie-soJs Work Series
frozenuihttp://frozenui.github.io/ case.html
Reversi http://js-game.github.io/othello
fromonehttp://yansm.github.io/fromone/index.html

60---- ----High-quality foreign talents

pazguillehttp://pazguille.me

61--------Resume template

Good personal resumehttp: //learnshare.github.io/about/index.html
Resumehttp://hcy2367.github.io/resume
Resume
Weng Tianxin
Animated Resume
Component-enriched Resume
haorooms Blog
Justin Young

62--------Interview questions

Looking for a job in those few months (Baidu, NetEase Games)
2014 latest Interview questions
2016 school recruitment internal recommendation--Alibaba front-end--three-sided interview experience
Things to do when changing jobs after the year: LeTV + Kingsoft + 360 interview trip
Lagou.com js interview questions
Front-end interview
Front-end development interview questions
2014 latest front-end interview questions
Baidu interview
Front-end development interview questions
5 classic front-end interview questions
How to interview a front-end development engineer?
Front-end intern interview summary
The most comprehensive collection of front-end development interview questions and answers in history
2014 front-end written test interview questions from BAT and major Internet companies: JavaScript
Collection of front-end development interview questions
Collection of front-end interview questions and answers
How to interview a front-end engineer
Front-end development interview questions
Niuke.com-Written Interview Experience

63--------iconfont

Chinese font
Taobao font
Font
Production tutorial
zhangxinxu-icommon
icommonhttps://icomoon.io/app
Use fonts to draw ICON icons on web pages (recommended Tutorial
Font compression tool

64--------Front-end development tool

IntelliJ IDEA Simplified Chinese special tutorial
SublimeText
Atomhttps://atom. io
visual studio code

65--------Fiddler

How much do you know about Fiddler debugging (1) In-depth study
微信fiddle
微信fiddle

66--------Chrome

Chrome - Basic
Chrome - Advanced
Chrome - Performance
Chrome - Performance Advanced
Chrome - Mobile
Chrome - Usage Tips
Chrome - Console Incomplete Guide
Chrome - Workspace Turns the Browser into an IDE
Network Panel
Chrome Development Tool Shortcut Key
Chrome Debugging Tool Organizing common functions
Chrome development tool Workspace Using

Chrome artifact Vimium shortcut key learning record

sass debugging-w3cplus
How to use Chrome developer tools more professionally-w3cplus

chrome debugging canvas
chrome profiles3
chrome debugging
View event binding
Artifact - Chrome Developer Tools
Fantasy Encyclopedia Performance Optimization (Timeline Profils in Chrome DevTools Introduction to the use of other tools
https://xinranliu.me/2015-05-22-qiqu-performance
15 Tips for Chrome Developer Tools
Incomplete Guide to Chrome Developer Toolshttp:// 1ke.co/course/361
Chrome developer tools usage tips

67--------Firebug

firebug video tutorial
firefox emulator
Firebug Getting Started Guide
Firebug Console Detailed Explanation

68--------Mobile, WeChat Debugging

Browser-side debugging Android https://openstf.github.io
Mobile front-end development and debugging
mac mobile terminal debugging
mac mobile terminal debugging
Wireless debugging strategy http://thx.github.io/mobile/debugging-in-mobile
Wireless debugging strategy
It’s awesome, perfect debugging WeChat webview (x5
Things about WeChat debugging
Remote console
WeChat debugging tool http://blog.qqbrowser.cc
Various real machine remote debugging Summary of methods

69--------iOS Simulator

Simulator
The iOS Simulator in Xcode (introduction and usage experience of iOS Simulator

70--------img

loading img
Zhitu-image optimization platform http://zhitu.isux.us
Online png optimization

71--------Generate QR code

Generate QR code http://cli.im

72--------Browser synchronization

puer
liveReload
f5
File Watchers

73--------Online PPT production

nodePPThttp://js8.in/ 2013/11/16/%E6%8E%A8%E8%8D%90nodeppt%EF%BC%9A%E4%BD%BF%E7%94%A8markdown%E8%AF%AD%E6%B3%95%E6 %9D%A5%E5%86%99%E7%BD%91%E9%A1%B5ppt
PPT
reveal
slippy

74--------Front-end Navigation website

Front-end navigation
Front-end URL navigation
Front-end directory
Front-end navigation http://123.jser.us
Front-end development resources
Front-end development warehouse-many effects Collection place
Front-end resource navigation
F2E front-end navigation http://f2e.im/static/pages/nav/index.html

75--------Commonly used CDN

Sina CDN
Baidu static resource public library
360 website guard commonly used front-end public library CDN service
Bootstrap Chinese network open source project free CDN service
Open static file CDN - Qiniu
CDN Acceleration - jq22
jQuery CDN
Microsoft CDN

76--------Git

git-scm
Liao Xuefeng-Git Tutorial

git-for-windowshttps://git-for-windows.github.io
GitHub Add SSH keyshttp://daemon369.github.io/git/2015/03/10/add-ssh-keys-for- github
gogithub
Git regular command practice http://pcottle.github.io/learnGitBranching
Git information organization
The git commands I recorded (very practical)
Enterprise development git work Streaming mode exploration part rest

GitHub Hitchhiker's Guide
GitHub Cheats
Using git and github for collaborative development process

77--------Excellent JavaScript Project

Angular and Webpack seed files
Fis3 front-end oriented engineering build system
Fis3 DEMO
Front-end JQuery series: source code analysis
avalon framework
Microsoft ChakraCore Microsoft's Chakra engine
Quintus HTML game engine
An interesting blog built with node.js
Web front-end assistant--FeHelper (Chrome extension)
Baidu Front-end Technology Academy
Cheerio (jQuery in node.js)
nodejs A chat software similar to WeChat
NetEase Cloud Music built using html5 and node.js
babel ES6 converted to ES5
A JS rich text editor
A JS brain map visualization tool
A Flappy Bird Game written in JS
A GBA simulator written in JS
Markdown parser written by SegmentFault
Ghost blog based on node.js
Demos for learning react

The above is the detailed content of Summarize front-end website resources. For more information, please follow other related articles on the PHP Chinese website!