Front-end basic training and basic training

Front-end basic training and basic training

Frontend basic newcomer training (draft)

 

 

Preface:

In order to adapt to the company's development, I am writing basic training courses for the front-end departments here to help new employees adapt to the company more quickly and better. Now I will publish this document

Directory:

Front-end IDE sublime Text

As an emerging industry, front-end engineers are gradually accepted by people. First, let's start with the most basic development environment.

In fact, front-end development is not like java or. net requires you to install such software, we only need a browser, the browser is our development environment, the future work is based on the browser, front-end IDE from the beginning of notepad, to a variety of text editors, and finally to a variety of professional IDE, of course, some IDE is just integrated, such as Microsoft's vistual studio, so here I will introduce you to a small and lightweight Text editor sublime Text which is now available in the third edition, but here we will use the second edition for demonstration.

The Sublimetext icon is like this.

You can see that the entire editor is very fresh and natural, and you can experience the operation.

But if sublime Text is just a Text editor, what is the difference with other editors? Sublime Text has many plug-in extensions to make sublime Text more powerful.

Press ctrl + shift + p to bring up the console, enter install, select install package, and press ENTER

Enter the plug-in you want to install, such as jquery.

The following describes several commonly used plug-ins.

Html + css + js prettify code beautification

Jquery prompt

CSS3 includes CSS2 CSS3 prompts

JsLint javascript writing specification check

In the future, you can define your own sublime Text plug-in based on your own situation!

Html css Basics

You need to understand and understand the following concepts.

DOCTYPE Declaration

Familiar with html tags, including html5 new tags and their attributes

Familiar with basic CSS selectors and basic CSS attributes, understanding the CSS box model, and learning the basic layout

0 base can be seen from the http://www.w3school.com.cn/h.asp

With a little basic can be combined with the http://www.w3cfuns.com/topic-64.html tutorial to see

After reading and learning the above tutorial, I believe you can write a good static webpage.

Javascript Basics

Learn the basics of javascript, understand basic syntax, data types, be familiar with flow control statements, have a basic understanding of javascript Functions, and have a basic understanding of the basic types of javascript and reference types, learn Basic javascript operations on DOM and understand how DOM works

0 basic information can be viewed from http://www.w3school.com.cn/ B .asp

With a basic knowledge, you can start to read the javascriptDOM programming art.

Jquery Basics

Learn the jquery selector and all jquery APIs, and focus on jquery's DOM operations APIs and jquery's ajax APIs as well as jquery's event processing.

First, you need to understand some javascript class libraries and why you should select jquery

Learn about jquery and learn how to configure jquery

The recommended learning path for jquery is to start with the jquery selector. After having the foundation of javascriptDOM, we can understand DOM operations in jquery, learn event processing in jquery, and learn about AJAX in jquery.

You can learn http://learn.jquery.com/

Or read the quick jquery book.

Css framework

Learn about bootstrap and learn about bootstrap encoding specifications.

Learn bootstrap 2.3.2 get started with http://v2.bootcss.com/getting-started.html learning bootstrap, scaffolding, basic CSS styles, basic components, javascript INS

Learn bootstrap3.2, get familiar with the new API, and try to figure out why bootstrap should be built like this.

Learning Object-oriented javascript

Basic Learning Types and reference types

Understanding and learning, execution environment and scope

Understanding objects and attributes

Understand the factory mode, focus on the constructor mode and prototype mode, and combine the constructor mode and prototype mode.

Learn the inheritance of javascript. The simplest way is to inherit from the prototype chain, and use constructors to realize inheritance. combine the two inheritance methods to learn how to combine inheritance, understand parasitic inheritance, and combine parasitic inheritance.

Learn the function expression, know the function declaration upgrade, and know the lambda function.

Review the scope chain, and start to learn the closure, understand the scope in the closure, and understand the this object in the closure.

Knowledge of block-level scope and learning module Mode

Refer to the object-oriented section of JAVASCRIPT Advanced Programming

Javascript MVC

What is MVC

Based on the simplest backbone. js MVC framework, you can understand models and data, controllers, views and templates, namespaces, and object relationship ing.

Learn and understand the module dependency loading, including require. jsseajs. For more information about backbone. js, see

You can go to this place to study http://addyosmani.github.io/backbone-fundamentals/#getting-set-up

Higher-level training guidance:

Next time

 

 

Where to learn the best web Front-end training?

Self-taught... The training site is good, but the key is to view your familiarity and self-training level.
 
What about front-end web development and programmers? Is there a professional training institution?

3G front-end is better, that is, HTML5 and CSS3.0 are added on the basis of the web Front-end. Cross-platform development allows you to develop things for iOS and Android systems. This is currently emerging technology, and not many companies are used, but the development prospects are very good, steve Jobs spent a lot of time talking about this technology in a speech. If you want to train this kind of knowledge, we suggest you go to Beijing Bo to see wensi. The qualifications are relatively old, there are many trainees, and they are relatively reliable.