"Turn", "Real Good" series of 18 "web programmers from scratch to employment of the full data v1.0--only look at this one article is enough!

This is a two-year period in which the Institute collects and organizes the order of learning materials.
To CSS15 a task, JS15 a task as the basis, respectively, according to the task to complete the different skill points, we sorted out such a study in the time needed to see the information.


This is version 1.0, which is then optimized and updated to 2.0.
Now there is only the web, and then Java is introduced.

The task address is here.


The task system is from simple to difficult, the official website provides more and more detailed information.

Information

CSS Section
Task 1: Nine Gongge--making a Web page with Html+css
Through this task can learn: 1. What makes a Web page, 2. How to generate a Web page, 3. How to access a webpage, how 4.html and CSS work together, 5. Layout of the page Foundation; 6. How to use a line of code to be compatible with different browsing devices; 7. How to debug when the page is not the same as imagined

HTML Basics
"Graphic" 1th chapter of the basic concept of HTML _ Baidu Library
CSS Concepts
CSS Tutorials
Box model, floating
Some in-depth discussion on the position and float properties in CSS-coffeedeveloper-Blog Park
Chrome Developer Tools
Artifact--chrome Developer Tool (i)-Just for Fun-segmentfault
Media Enquiry
Media queries detailed-lines-blog Park


Task 2: Understanding the Development Essentials Tool
Through this task can learn: 1. Learning version management tools; 2. Learn to use the server; 3. Learn how to put your own code on the Internet

Nginx
Configuring the Proxy service on Windows Nginx, configuring multi-domain names, and the simplest implementation of cross-domain configuration
Git
Git tutorials
GitHub
Know-
Svn
SVN server Setup and use (i)-xjbest-Blog Park

Task 3: Magic Mirror Introduction Page--one of the simplest mobile pages
Through this task can learn: 1. How to use layout knowledge for a more complex layout; 2. How to make the layout better fit the mobile side; 3. How to use REM as a unit of length; 4. How to use Photoshop transduction; 5. How to handle pictures at different dpi

Photoshop
http/jingyan.baidu.com/article/19020a0a149b71529d2842bb.html
Absolute
CSS in-depth understanding of the Absolute-MU class network
Self-adapting units
Thoroughly understand the difference between units px and Em,rem in CSS-leejersey-Blog Park
CSS class Selector
CSS class Selector detailed

Task 4: Landing Page--one of the most common mobile pages
Through this task can learn: 1. Handle common mobile pages; 2. Learn to change form element styles

Input
Learn about the 30 element properties of the INPUT element of an HTML form-push cool
Smart checkbox and Radio
Absolute positioning and relative positioning
Absolute positioning and relative positioning in CSS-tbhacker-Blog Park

Task 5: Caregiver Profile--one of the most common mobile pages
Through this task can learn: 1. Handle more complex mobile pages; 2. The layout is also left-right, and can be done in a number of different ways; 3. Better stretching of the background image with CSS3 method

Self-Adapting layout summary
This is probably the most comprehensive CSS adaptive layout summary in history.
HTML,CSS Code Specification
NEC: A better CSS style solution


Task 6: Caregiver List Page--A most common mobile page that requires the use of bootstrap
1. Solve the vertical center; 2. Simulate the drop-down box; 3. Make a complex list page

Sprite Chart
Background-position and Sprite diagram (CSS Sprites) usage
Bootstrap grid system
The subtleties of the Bootstrap grid system
Bootstrap official documents
Bootstrap Chinese web

Task 7: Board Game Wizard-a complete webapp that meets more diverse needs based on Bootstrap
What to Harvest: 1.HTML5 audio defines the stream; 2. handling translucency; 3.CSS3 Animation

Style settings for input range
Using CSS to extend an example of enhanced input range
Html5web Storage
HTML 5 Web Storage
Html<audio> Label
HTML <audio> Tags
CSS3 Animation
CSS3 animation_animation, CSS3 properties Detailed tutorial _w3cplus
CSS processing translucency
CSS Properties Summary--semi-transparent processing-sub-pure-blog Garden

Task 8: The real home-a PC-based enterprise website that meets more diverse needs on a bootstrap basis
What to harvest: complete a relatively complete PC-side project
Common layouts for HTML and CSS implementations
Using HTML and CSS to implement common layouts-eyes big-Segmentfault

Task 9: The House of Truth-a responsive corporate website
What to harvest: increase the proficiency of website layout development; get a responsive website
Introduction to HTTP-EQUIV attribute usage in META tags
The HTTP-EQUIV attribute in the META tag uses the home of the script that introduces _html/xhtml_ Web page authoring

Task 10:51 Packing--a common form page
What to Harvest: CSS production flowchart; CSS simulation form elements; skilled responsive layout
CSS changes the Select drop-down list style
Change the default style of the drop-down list select box with pure CSS-Ourjs

Task 11: CSS-based higher-level language-rewrite Task 4 (login page) with Less/sass and compile
What to harvest: use sass or less
Sass Getting Started
Sass Getting Started-sass Tutorial
Less documentation
Less Chinese web

Task 12: Standardize-read HTML and CSS specifications without using BS to rewrite tasks 5 and 6 (carers)
What to harvest: use sass or less to refactor pages
CSS Reset style sheet
CSS Reset style sheet-front small white-blog channel-csdn.net

Task 13: Organize style sheets--Follow the standard of task 12, do not use BS to rewrite the task 7 style, and read the style sheet organization specification, split the style sheet
What to harvest: CSS Architecture
How to make a CSS schema (Zhang Xin Asahi)
http://www.zhangxinxu.com/wordpress/2010/07/How I structure the CSS of the website

Task 14: Own Library of components--take the home of the house to its own library of components
What to harvest: extracting the PC-side component library
Why should the front end be modular
Why does the front end have to be modular
CSS painting triangle
CSS3 the principle of drawing triangles-what is this? Eddie-Blog Park

Task 15: A comprehensive summary-follow the specifications learned by the task 12,13, rewrite task 9, use Less/sass and compile with no other framework
What to harvest: comprehensive capabilities
The synthesis of previous studies

JS section
Basic grammar accumulation
Beginner's Tutorial
JavaScript Tutorials | Beginner's Tutorial
W3c
Browser Scripting Tutorials
Nanyi
JavaScript standard Reference Tutorial (Alpha)
Liu Xuefeng
JavaScript tutorials
JS Secret Garden
JavaScript Secret Garden
Choose a brush again
JQ Tutorial
JQuery Tutorials | Beginner's Tutorial
Angular plug-in collection
Angular useful plug-in collection (continuous update)-Angular-segmentfault

Task 1: Nine Gongge
What to harvest: What is JavaScript? Master JavaScript's basic syntax, learn about JavaScript's global functions, learn to use JavaScript's custom functions, how JavaScript operates the DOM, and how JavaScript modifies CSS;

JS String to Number
Three ways to convert JS strings to numbers-crazy fat Fish-blog channel-csdn.net
JS Random number
JS produces a few uses of random numbers! -Banbu-Blog Park

Task 2: Board Game Wizard Status issue
What to harvest: How to use JS for page jumps and parameters; Use JS to make more complex operations on page elements such as input; further understanding of JS arrays; Understanding JS Regular Expressions

DOM Operations
JavaScript DOM Operations (node operations)-sissy-dad de notes-blog channel-csdn.net
Regular (RegExp object)
JavaScript standard Reference Tutorial (Alpha)
Console debugging
Chrome Console Console Usage

Task 3: Board Game Wizard View identities
What to Harvest: Learn more about data transfer between pages, how to display and hide views as needed, and JS to perform more complex operations on DOM styles and content
Json
Json_ Baidu Encyclopedia
Localstorage and Sessionstorage detailed
HTML5 storage Sessionstorage and localstorage detailed _HTML5 Tutorial tips _ Scripting House

Task 4: Game Wizard judges logs and results
What to harvest: using jquery to accomplish more complex business logic; use finite state machines to hold different states of an object

JS Finite state machine
JavaScript and finite state machines-Nanyi's Blog

Task 5:ajax Login/exit
Ajax
JavaScript standard Reference Tutorial (Alpha)
Rest
Rest_ Knowledge Base _ Blog Park
JSON and JSONP
"Original" to say JSON and JSONP, perhaps you will be enlightened, including jquery use case-go with it-blog Park

Task 6: Backstage system--angular first taste
What to Harvest: single page application development; Learning to use framework development projects
Angularjs Chinese web
Angularjs Chinese web
Angular common functions
The eight most common features of AngularJS
Angular Ui-router
AngularJS ui-router (nested routines)


Task 7: Background system--angular Login and List
What to harvest: data interaction with angular; two-way binding; form validation

Understanding the scope scope of ANGULARJS
Angularjs Chinese Community
HTTP Service
Introduction to the usage of $http services in AngularJS _angularjs_ scripting House
$http Service Details settings
AngularJs $http Request Service

Task 8: Backend System--angular parameters and instructions
What to harvest: How to pass a URL in a single page application; What is the instruction of angular; how to customize an instruction

Several parameters in angular
Several parameters transfer methods in Angular
Angular Custom Directives
Full parsing of commands in AngularJS (Must see) _angularjs_ script House
Angular Service
AngularJS Factory vs Service vs Provider


Task 9: Backstage system--angular picture upload
What to harvest: Image Preview and upload based on HTML5

Angular implementation of image upload (reference implementation)
Angularjs image upload Function-OPEN development experience Library
Use of Ng-file-upload
Angularjs upload image/File features: NG-FILE-UPLOAD-CSDNMMCL blog-Blog Channel-csdn.net

Task 10: Background system--angular Form validation interaction
What to harvest: be more familiar with forms validation; Learn to use three-party plugins: Rich Text editor

Angular form Validation
Form Validation <AngularJs>-halower-Blog Park
Angular-umeditor
Dylike/meta.umeditor

PS, this article by the pre-hospital students are now formal staff beautiful and moving small Jin Chao finishing.

To the real school is interested in, please click on this link to register, you must use this link, take me as a referrer is good ~

http://www.jnshu.com/login/1/83020780

"Turn", "Real Good" series of 18 "web programmers from scratch to employment of the full data v1.0--only look at this one article is enough!