Web development project, web single page development

The story begins ：

See a post , Speaking of a degree is just an ordinary college graduate programmer , Make the front end 5 Nian Zuo  

《 Analysis of front-end interview questions in large factories +Web Core summary learning notes + Enterprise project actual combat source code + HD explanation of the latest video 》 Free open source Hui Xin search official account 【 Advanced programming 】

  Right time , In the middle 3 companies , They are all medium-sized Internet enterprises and entrepreneurial companies , It's not that big . I'm very upset that I can't enter the big factory , I've been rolling in small and medium-sized companies, cutting pictures every day .

There was a time when he was interviewing almost every day , From ordinary small companies , To listed companies , Go to a large factory （ Ali , tencent , byte ）. But the most feedback is 2 Kind of , Not enough education or running with .

There should be a lot of other students who want to impact the factory will get the other two kinds of feedback , The technical depth is not enough , Or there's a lack of good projects on your resume . As a result, I didn't get an interview or I couldn't pass the interview .

On this premise , It's easy for you to form a dead cycle , Has been hovering in small and medium-sized companies , Most small and medium-sized companies give priority to business , The construction of technology is relatively lacking , So new technologies don't get a chance to practice , Busy with all kinds of business needs every day , The atmosphere around us is not good, etc , It will ultimately affect your ability to improve .

One 、 How to get started , Study suggest

Before you start learning , There are some small suggestions . According to my own learning experience, I found that , These suggestions are very helpful now and in my future career . And that is

Before you start learning , It is suggested that we should spend a few days first , Find some articles on how to get started , Through the suggestions of many articles and predecessors . Sort out a complete set of plans suitable for your study , And then in the learning process , After you know more about the front end , Make some adjustments to the plan

. I Believe , It's much faster and more effective to plan learning than to start learning specific knowledge at the beginning .

• Code specification
  ： It's not that Xiaobai period is not important , It's when you don't know anything , To strictly implement the norms learned . Gradually , When you have learned something , Gradually formed a set of their own code style .

• Handwritten code
  ： First learn the suggested handwritten code , Even a single line of code , Also want a letter a space to type out .

• Hands-On Activities
  ： Even in the case of just one line of code , Also need to manually write and run , Instead of looking up and down , Oh , It's easy , I don't want to do it .

• Lay the foundation
  ： Only the Xiaobai stage has laid a good foundation （ such as ：HTML、CSS、Jquery）, It's better to overcome the following difficulties .

• unremittingly
  ： At the most difficult moment , Adhere to the , The sky will be totally different

• draw up a plan
  ： Make plans accordingly , And strictly implement , Otherwise, the general learning effect will be greatly reduced

• Feet on the ground
  ： The front end has a lot to learn and master , You need to follow the plan step by step , From easy to difficult

The above is a summary of personal learning , If you can follow , Learning effect and subsequent advanced aspects , It helps a lot . Of course

It's the best way to do it

.

Two , How to learn in Xiaobai stage

You at this stage , It should be nothing , Maybe you don't even know what the front end is doing . Maybe I just heard that this position is very popular , Good job hunting , So you want to learn . Or maybe you see a beautiful web page , You're getting curious , It's a beautiful thing to realize it , You want to know how to make it . If you want to know how to get started , Take a look at the following suggestions and comments . This is through or Xiaobai's self-learning stage to be competent for the front-end post , Some of the accumulated experience , I hope it helps .

Suggestions for learning steps

（1）HTML label （ Web structure markup language ） +CSS style （ Web style language ）. They are static Web Using the most basic language , Master them , You can write a simple module （ Such as navigation ） Even a complete static web page .

（2）Jquery library （Javascript A library of programming languages that must be mastered ）. It allows you to do static web pages before “ move ”, such as （ Pull down the secondary menu 、 On the right side of the web page, the navigation tools and other interactive effects ）.

（3） It is recommended that you take time to see 《DOM Programming art 》 This book , Or books like this . It's about Javascript The application of programming language in web development , Follow this book down , You can write a simple interactive website .

The above points are what Xiaobai began to learn , It is suggested to learn these three languages in order . have access to sublime Editor for hands-on writing . When you follow the learning steps （3） When you finish a little website , You'll feel a great sense of accomplishment , The follow-up study also increases confidence , Interest 100 times .

3、 ... and , Preliminary advanced learning suggestions

I believe that after the previous exploration , If you can stick to it and follow the advice , Should have completed the first do it yourself website . Here are some suggestions for preliminary advanced learning .

Improve our basic knowledge

（1）HTML5, More advanced markup language , More colorful features . Add a lot of tags , such as ：canvas、video etc. , You can create more animations by yourself , Cool special effects or playing videos and so on .

（2）CSS3, More advanced style language . You can achieve rich and colorful page animation , You don't have to use it every time js, Use CSS3 Can easily and conveniently achieve some of the desired web interaction .

（3）javascript programing language ( A top priority ). This is what the front end needs to master, which is really a programming language , Learn to use flexibly javascript, It will be very helpful to study and work in the future . The most important thing to master is to learn the basic knowledge well , And then through continuous actual combat to improve our programming skills and logical thinking . This piece of learning is continuous , Until we really master it and use it flexibly . If you start learning once or twice , There is no room for improvement , We can put it on for a while . Continue with the following study ,javascript Throughout our front-end work , In the later learning realization, we will also meet and exercise to . It's not hard to really learn , The key is to use... Flexibly .

（4） Start learning to use some front-end frameworks , Here I mean the front end UI frame , They can help us develop a website quickly and efficiently , And the interface style is also good . such as PC Terminal Bootstrap, It's actually a responsive framework , It can also be used in mobile terminals H5 page , perhaps AmazeUi, This is a mobile focused framework . You can also view the documents on the official website of the corresponding framework , When you learn to use a framework , Other n+1 Various front ends UI frame , You'll come at your fingertips .

（5） There's also a front-end framework , Such as layui This kind of , It's a tool class framework . It contains paging effects 、 Pop up effect 、 Date selection control and so on . When you learn at this time or later , You can learn how to use , Can help you to complete the project development more efficiently .

（6） Through Baidu , You can find many plug-ins for Web interaction effects , Such as the secondary menu drop-down effect 、 Accordion menu 、 Picture carousel 、 Pop up effect and so on . Download their source code and examples , Learn to use or imitate their effects , It can help us to quickly implement some complex interactive effects . There are a lot of free open source plug-ins now , Let's not have to make wheels again , It's easy to use directly . Of course , My advice is when you learn to use a special effects plugin , You can learn its source code , See how it works . This is also consolidation learning javascript A good way to speak , You deserve it .

（7） Here we are , You have basically mastered some knowledge and skills of front-end development . You can find some typical official websites to copy their interfaces and interactive effects , Such as the official website of Jingdong 、 Taobao official website and so on . Write a few home pages of this official website , Can further consolidate and improve the knowledge learned before .

Four , Continue to learn

When you can finish a basic interactive page , Participate in the work to further improve themselves is the need to master some popular front-end development JS Framework and efficient popular development mode . I believe that at this point , You've made it to the front door , The next step is to practice how to become the main front-end Engineer in the work .

1、 Some common front ends JS Framework proposal

（1）vue.js, A mobile oriented JS frame , Lightweight . Data driven interaction , It's very easy to learn , It can be independent of Jquery The framework is used independently to help you develop a friendly mobile interface . A necessary skill for front-end development , A popular JS frame . How to use and master it , You can baidu , You can also go to its official website to learn official documents , Or rookie website also has introduction .

（2）react.js, Comparison vue, It's a little more complicated , A little more heavyweight , But it's also fast and easy to implement large projects . Mastering it has become an entry requirement for many companies , I believe I have learned vue This kind of data-driven framework , It's much easier to learn this . Compared with the usual jQuery Development projects ,vue and react The key to development is that ideas will change , Master object oriented and data driven interaction , It will make you feel easier and more friendly to develop . How to master it , Baidu 、 Rookie website 、 Official website documents are good choices .

2、 More popular development model suggestions

（1）vue + webpack Integrated development

（2）react + webpack Integrated development

（3）node.js Learning and Application , One can be used javascript Language development background tools

（4）weex + webpack Integrated development , At present, few companies use

（5）angular.js, and vue.js These are almost , But it's rare to see the use of

The above development framework and development mode （1）（2）（3）, It's a lot of Internet companies , Will use . It's worth learning , And when you master it , You'll find that developing front-end projects can be so simple .

Keep learning and keep improving

The above articles are some introductory suggestions . Of course, throughout your study and future work , You may also learn to master some other necessary skills . Such as ：

• Baidu is very important .

• UI Design documents PSD Cutaway （ Necessary skills , Learn to see UI Design the drawings that are delivered to you ）.

• Using Google or Firefox F12 Developer model , Debug quickly to find problems in the development process .

• Cooperate with the background to debug the data interface , And solve some cross domain problems （ Such as ：nginx Configuration usage ）.

• Different projects use different best development tools （sublime、editplus、hbuilder、vsCode wait ）.

• Use version control tools （ Such as ：svn）, A great tool for you to work closely with your team .

In the end, so much of the learning content , Are you going to give up , But don't worry . The introduction is very simple , After getting started , It's going to be easier to follow up . It's all about technology , Some tools , Just master it . The real difficulty is teamwork at work , Code specifications , And continuous progress .

5、 ... and , After taking part in the work , Some suggestions

（1） Recognize the responsibilities of your position .

（2） Working with product manager ： Understanding prototypes and requirements , Make your own reasonable suggestions .

（3） And UI Design coordination ： according to UI Planning how to achieve is the best way , Instead of working hard with a blueprint , Make better suggestions .

（4） With other front ends ： Code specification is particularly important at this time , So when learning the front end from the beginning , I emphasized that it is very good to form good coding habits at the beginning of learning , It's necessary .

（5） A preliminary test of self ： After completing a project development , A preliminary test of sexual function , No problem will be delivered to the tester for testing .

（6） Cooperate with the tester , modify bug.

（7） Actively cooperate with subsequent iterations of project products .

（8） When you get better , You have to learn to manage a front-end team to allocate work and control overall quality and delivery time . This is a step-by-step improvement , Although you may not be able to touch , But you can understand .

Expertise

Generally speaking , The interviewer will ask questions based on your resume , But the technical foundation also needs to prepare its own classification , To form their own knowledge system . A brief list of my own problems

• HTML+CSS

• JavaScript

• The front frame

• Front end performance optimization

• Front end monitoring

• modularization + The project build

• Code management

• Information security

• Network protocol

• browser

• Algorithm and data structure

• Team management

• [ Open source sharing ：【 Analysis of front-end interview questions in large factories + Core summary learning notes + Real project practice + The latest explanation video 】](()

Recently, I had time to sort out the interview questions I met before , Including my own interview , There are other people who come to the interview , And what's on the Internet , I've sorted them out in a unified way , I hope you found that useful .

It includes HTML、CSS、JavaScript、 Server and network 、Vue、 Browsers and so on

Because of the limited space of the article , Show only part of the content