Recently, many friends will leave a message asking what knowledge the front-end of zero-based learning needs to know. Is it easy for Xiaobai to learn Web front-end development? In response to your question, the following is the introduction of Shangxuetang Front-end College.

First of all, let's introduce what front-end engineers do.

Their main job is to make the UI design into an html page according to w3c standard, and realize the front-end interaction on the page with javascript scripting language. Interactive effects include pop-up layer, tab switching, picture scrolling and ajax asynchronous interaction.

Senior front-end engineers should also undertake the work of front-end optimization, and have more knowledge about optimization, such as file expiration, caching, asynchronous caching, js and css, image compression and so on.

Front-end development is a very special job. The front-end engineer's job looks very light, but it is definitely not that simple to do. In the development process, it covers a wide range of contents. We should not only think about the realization of the page from the technical point of view, but also think about how to better accept the boring data presented by technology and better present information from the user's point of view. Simply put, its main function is to better combine the data of the website with the acceptance of users and present a friendly data interface for users.

Front-end engineer is a very new profession, which has been paid attention to at home and abroad for less than five years. With the rapid development of the Internet, from WEB 1.0 to WEB2.0, to new HTML5 and CSS3, and to the rise of new technologies such as mobile phones and 3G networks, web pages are mainly based on original graphics and texts. Nowadays, various applications, interactions and rich media based on declining front-end technology, more information, richer content and more friendly experience have become the requirements of website front-end development. The development of websites is becoming more and more important to the front-end, but the demand for front-end engineers is becoming more and more important, but the demand for front-end engineers is greater than the supply, and front-end talents are very scarce. Therefore, high-quality front-end development engineers will be a very popular career in the next five years, and the development prospects are very impressive.

So, what knowledge does the Web front-end of zero basic primary school need to know?

If you are a beginner with zero foundation, you must first master the basic knowledge of front-end development and related programming languages; HTML, CSS, JauaScript, in the layout of the page, HTML defines the elements, CSS locates the displayed elements, and then realizes the corresponding effects and interactions through JavaScript. This knowledge is the foundation, and you must master it skillfully to write fluently.

Of course, learning programming languages is a supplement to tools. While learning a language, what you need to master is the use of development tools. For beginners, use several common tools:

1, Dreamweaver:, a WYSIWYG webpage code editor integrating webpage production and website management.

2. Sublime, the full name of Sublime Text, is a code editor. Its main functions include spell checking, bookmark, complete Python API, Goto function, instant item switching, multi-selection and multi-window.

3. HBuilder: it is a Web development IDE supported by HTML5 launched by DCloud.

After being familiar with these tools, you must have a certain understanding of basic development work. At this time, if you want to improve your ability, you can learn how to use some tools. For example, Bootstrap can provide more fashionable formats, tables, buttons, tables, network systems and so on. For your network development. Secureheaders can automatically implement security-related header rules to prevent attacks such as XSS and HSTS.

The road of front-end development is not static, and the content of learning may change with the development of the times and the update of software, but laying a good foundation, no matter what kind of knowledge you learn, it is handy.

Simple understanding is the highlight!

How does the front-end white learn the web front-end

The misunderstanding of front-end self-learners;

What you have learned may be out of date.

What is regarded as a classic is out of date, or there are better substitutes, and your access to information is limited, and the news is lagging behind, resulting in relatively backward learning content.

2. Blind learning methods

If you don't understand a book, look for a video tutorial. If you don't think the tutorial is to your taste, find another way. Because of the lack of the ability to identify resources, they always study blindly without clearly planning the learning route, which leads to ineffective learning time and little gain.

3, only theory, lack of real project exercise.

The understanding of technology stays at the theoretical level and lacks the experience of real enterprise projects. If you don't have relevant internship or work experience, you don't fully understand the specific division of responsibilities and workflow of front-end positions.

How to teach yourself front-end knowledge:

Self-study method:

As a beginner, you must have a clear and systematic study plan. I suggest that there must be a tutor who can teach himself. The probability of giving up is very high. When you have no idea about the web front end, you need someone to guide you through the door, and then you have to teach yourself. The first step is to determine what the web front-end needs and how long it will take to complete the learning. Suggested time is 6 months.

2. Videos are the mainstay, supplemented by books. Many beginners like to buy books when learning the front end, but what is the final result? It seems that nothing can be written, so I would like to remind you that books can be read, but they are based on specific operations on a certain knowledge point, so they are more conducive to your understanding of knowledge.

3. For learning technology, it is very important to master a learning method. In fact, for the web front-end, many learning methods are really the same. Once the learning method is wrong, it may cause "the method is wrong and the efforts are in vain". In fact, there are many things in it. Let me give you a simple example. Some people follow the code while listening to the class, which is not right. When listening to the class, they concentrate on doing the problems. This is the experience of people who have experienced it. Be sure to listen. According to everyone's differences, learning methods may have a way out. Finding a suitable learning method is the premise of learning.

4. Self-learning programming is not recommended. As far as I know, not many people have succeeded in this job from scratch. I think most of the reasons are because I don't know what the web front end is and what I am learning, so I blindly buy books, look for videos everywhere, and finally give up after reading it. So I suggest that beginners consult and talk with experienced people before they have specific concepts.

Must-read front-end books and materials:

1, JavaScript DOM programming art

Super front-end bestseller. As a front-end programmer, you must read more than two books. This book is especially suitable for beginners. The core technology of the front-end is JavaScript, which is also the difficulty of the front-end. Moreover, this book is very suitable for beginners, and easy to understand and vivid cases can make beginners understand better. Many of the programming ideas mentioned are suitable for middle and low-level front-end developers to learn.

2.JavaScript authoritative guide

It is also a must-read book for front-end programmers, which is not only suitable for beginners, but also suitable for programmers who are already doing front-end work to read at any time. It covers all the contents of JavaScript API implemented by JavaScript and web browser. It is helpful to know the basic knowledge of js, such as objects, arrays, syntax, scopes, closures and so on.

3.JavaScript advanced programming

If you want to learn JavaScript completely and systematically, I strongly recommend this book. You can keep this book all the time. You can draw the main points in the use of this book for future reference. It is a very powerful helper in your work. It can also be used very well in the interview, which is commonly known as "Little Red Book".

4. JavaScript you don't know

This book is not suitable for front-end beginners, and it is a book that every front-end programmer must learn if he wants to deeply understand JavaScript principles. Let unskilled JavaScript developers meet the challenge, go deep into the language and find out the purpose of each component of JavaScript. If you can read through this book, you will be able to understand and master everything quickly in the future.

5, "Vue.js authoritative guide"

As the mainstream framework of the front end, Vue is widely used in China, so to understand the principle of Vue, we must chew a book about Vue. I recommend this book because it has a qualitative improvement in guiding developers who have just come into contact with Vue. From basic knowledge to mainstream packaging and source code analysis, there are many practical cases, which are all good practical books. The main contents include data binding, instructions, form control binding, filters, components, form verification, service communication, routing and viewing, vue-cli, test development and debugging, source code analysis and mainstream packaging and construction tools. The book is comprehensive in content, detailed in explanation and rich in examples, which is suitable for developers at all levels.

6. The beauty of programming

No matter what position a programmer is, he must read a book. Almost all programmers who haven't read this book are fake programmers. This book has 60 algorithms and programming topics, most of which have appeared in written tests and interviews in recent years, or have been hotly debated by Microsoft employees. The author tries to guide readers to find, analyze, solve and find better solutions from various interesting problems in the book. You can greatly improve your programming thinking and in-depth thinking about this industry, and eventually become a technical bull.

Learning route:

Phase 1: home page reconstruction (4 weeks)

Contents include: (PC-side website layout project, HTML5+CSS3 basic project, WebApp page layout project).

The second stage: JavaScript advanced programming (5 weeks)

The contents include: (native JavaScript interactive function development project, object-oriented advanced and ES5/ES6 application project, JavaScript tool library independent research and development project).

The third stage: PC-side full-stack project development (3 weeks)

The contents include: (jQuery classic interactive special effects development, HTTP protocol, Ajax advanced and PHP/JAVA development projects, front-end engineering and modular application projects, PC-side website development projects, PC-side management information system front-end development projects).

Phase 4: Mobile Project Development (6 weeks)

The contents include: (touch project, WeChat scene project, WebApp project developed with Angular+Ionic, WebApp project developed with Vue.js, WebApp project developed with React.js).

Stage 5: hybridization and reactive development (1 week)

The content includes: (WeChat applet development, ReactNative, various mixed application development)

Full-stack development of NodeJS in stage (1 week)

The contents include: (WebApp backend system development, I. NodeJS foundation and NodeJS core module II. Express III. noSQL database).

Video tutorial:

The above is the learning process of Xiaobai, the front-end college of Business School. Let me briefly introduce it.

Generally speaking, zero-based learning of Web front-end requires not only understanding the dynamics and development of the whole front-end industry, but also learning HTML, CSS, JavaScript and other knowledge, which is a huge and complex technical system.

If you are interested in learning front-end technology and want to learn a new technology, I will provide you with a very good front-end learning exchange group:1141884931. If you have any questions, please ask me inside, so that you can avoid many detours and do it more efficiently. Remember to communicate more with experienced people, not behind closed doors. If there is no better tutorial, you can ask me for it.

This article was originally written by Shangxuetang Front College. Welcome to pay attention and take you to learn Web front-end knowledge!