Original Xi ‘an front-end exchange meeting: Canon [email protected] reproduced with notes

Xi ‘an front-end exchange meeting: www.wdshare.org

This is the primary group (Xi ‘an primary front-end group: 4983126) inside a share, sort out, share with you, I hope to help you learn, but also hope you can communicate with me more.

Writing in the front

Hello, I’m Canon. Last week, brother Michael shared the content of mechanical career change front, half a year of zero basis self-learning heart road full of good things, very wonderful. I bring you this week’s share. First of all, I feel very much that Brother Jack gave me this opportunity to share some learning experience here. I am also very grateful to brother F7 for providing such a good communication platform for everyone to discuss technology without distractions and make progress together. What I share today is mainly about the learning route of front-end beginners and some suggestions, as well as my own experience in the process of preparing for school enrollment. Because I now or student, so in some problems of opinions and choices may be more to the student’s thinking, not necessarily is suitable for all the people in the group, the lack of local hope everybody many help, of course, I’ll try to output from the perspective of more applicable people my experience, hope to help everyone front end learning. I will share with you from the aspects of my way into the pit, learning process, learning route, resume, knowledge and mental preparation in the process of preparing for employment.

How did I choose this direction

Strictly speaking, my major does not belong to computer science (intelligence science and technology), but is more inclined to a combination of software and hardware. Fortunately, our school puts hardware courses in a more important position when arranging our specialized courses. So the knowledge that can learn in professional class is not much actually, also be to see the major that so dominear name just fills at the beginning. If I follow the path of my major, I should study artificial intelligence, machine learning, machine vision or natural language processing. However, in my sophomore year, after I carefully studied these possible directions, I seriously found a problem. These seemingly lofty subjects or professions are a very embarrassing existence in our kind of school. To our ordinary school undergraduate educational level and the depth, and nearly impossible to find a suitable job in these directions there is no precedent (at least), and, of course, also have ever wanted to do the first person to eat crab, but not good foundation when take a hard look at their own academic strength and enthusiasm for the direction of the limited, I still choose to give up. In this case, the only option is to further my education and choose another direction. Because I had no plan to further my study in China, I gave up this option very decisively. Therefore, on the way to choose another direction, I happened to meet the recruitment of various laboratories in the school of Computer science (our major was assigned to the School of Automation). After listening to one lecture after another, I found that I was a sophomore (the requirements for freshmen are relatively low), and I didn’t have any outstanding works or familiar programming languages, only full of enthusiasm for the Internet and technology industry. Finally, holding the mentality of trying, initially selected the front end and product two directions. However, considering the future employment prospects, learning routes and future development (information mainly comes from Zhihu), I still choose the front of the technology route. Fortunately, at that time, everyone’s level was not high. After I had been studying all night for about a week, I happened to meet a senior student who appreciated me very much and let me enter the WEB group of their lab. That was the beginning of my career.

My beginner’s path

For students, I highly recommend joining the school lab, which will greatly help you on your learning path, as I will mention later. Fortunately, the lab I work in is project-driven. There are talents from all directions in the lab, such as embedded, Android development, big data, WEB front-end, WEB background, etc. When you have a good idea, you can quickly gather members from all directions to realize it. So my first project began. Is to write a simple lab website. Of course at that time, I didn’t know I really just understand a little fur is not knowledge, how to start a project, the early stage of the demand analysis of how to write, how web site overall design, with what technology stack, how to regulate the code, how to write robust maintainable code, and there are even websites put something, where information to these problems, all at once. I had no idea where to begin. This is where the importance of having guidance comes into focus. Under the guidance of my senior, I spent a week writing the requirement analysis of the website by referring to the previous project plan, drawing the general layout, and selecting the technical framework with Bootstrap. At that time, I just read the Bootstrap tutorial on MOOCs and official websites, and found that it was not difficult just to use it, and I could basically master it in two weeks. But it doesn’t help that you can code by example, or you can’t do anything. At this time, I did a very shameful thing, I took down the codes of the official websites of several laboratories established earlier in the school, and looked at their directory structure, layout and codes. Luckily no one used too much technology on this static site, it was mostly CSS and HTML that I could read, with very little JS. Therefore, referring to their examples and the overall layout and structure I designed before, I wrote the overall framework of the website. Although it was ugly and there were many layout bugs even with Bootstrap, I was very excited to see the first website designed and written by myself. The following work is in the actual writing process, constantly changed the code, changed the layout, and even changed the requirements for several times, lasted about two months and a winter vacation, finally completed my first official online work. During this period, I also purchased and configured my own cloud server, my own blog system, my own Github, and learned the basic operation of Linux. You know, a few months ago, I didn’t think THAT I would be able to write a website and make it available to so many people. I didn’t believe that I would have the opportunity and I didn’t believe that I had the ability. But so what, the fact is THAT I actually made this thing, and I will make more and better things in the future. Don Be Shy, you never know what you can do if you don’t give yourself a chance. Before that, I had no idea how to start and finish a project, no blog, no Github, no cloud server, I had to learn these things because they would be used in this project. But at the beginning of learning, I found that the convenience these things brought to us was far beyond my imagination, so I couldn’t stop. So for just a beginner, I strongly suggest you to use your imagination and try to do a complete works by myself, when you want to achieve something, want to go to finish one thing, you will have more enough enthusiasm and motivation to learn, every learning are closer to your goals, Each time you finish a piece of your work, you’ll be more motivated to continue. It’s a positive cycle of motivation. In this case, you will learn faster and in depth.

It is easy to see how important the resources, platform and atmosphere provided by the school lab have been to my entire growth. Here, I can very easy to find and their own direction of the elder sister, here, I want to once again want to help my elder sister say “thank you”, without you at the beginning of your guidance, I am still rolling in the mire, no direction of the disorderly bump. It’s easy to have opportunities to make products that people will use, and it’s also a good learning environment. A simple example, in the absence of prior to joining the lab, I learned most 9 (close) at nine o ‘clock because school library, but also by various kinds of interference, after join the lab, as long as go to, I have few before ten o ‘clock back to the dormitory, because in this environment, everyone in the study, are talking about, you can’t have other ideas. And the students who live closer to the college will never leave until the security guard comes to urge them on. When you can complete a small project, I’m sure you will have a good understanding of the common techniques, but if you can only use one technique, your growth will be very limited.

Learning Route Recommendation

At this point I recommend spending a lot of time systematically studying the knowledge points. For example, how long to learn HTML4.1 HTML5 MDN-HTML5CSS2.1,CSS3 fog rain drift zero CSS manual,ES5,ES6/ES7 Ruan Yifeng ES6 manual and so on. At this time of learning is to have both breadth and depth. Needless to say is JavaScript advanced programming bean link this book, which is often referred to as the elevation, basically every qualified front-end programmers have to read many, many times, each reading will have new discoveries. JS the most rational things are explained very clearly, but it also has a lot of not in-depth place, this time rhino book appeared. But rhinoceros book (JavaScript authority guide) douban link is very fine, very deep, anyway, I am basically not how to see, the level is not enough to understand a lot of places. But it’s also a must-read for a deeper understanding of JavaScript. CSS, I recommend CSS authority guide douban link and W3C teacher WC-plus graphic CSS3 douban link, basic read familiar with these two books, in the vast majority of cases CSS depth and breadth is enough.

Recommend some websites, a Baidu IFE front End Technology college, there are Baidu IFE front end team set up for beginners step by step front-end Tasks, as long as in order to do it step by step, your front end technology will be a step up. And there are a lot of good students doing the same thing, you can reference and evaluate other people’s code, you can learn a lot of things. There is also Free Code Camp, which should be the most popular technology learning website in the world. Similar to the last one, it is also in the form of tasks. It will provide a lot of learning resources, and then complete the target learning task.

However, these knowledge is not enough. Today’s front-end engineers are not only HTML, CSS and JavaScript, but also need to understand network protocols, network requests, browser operation mechanism, front-end performance optimization, server and other knowledge. You cannot learn systematically and comprehensively, and learn too deeply. You’ll probably find that I’ve been working on just one topic for months, but how do you judge how much you’ve learned? I think this needs to be weighed according to your own situation. Compared with me, I am a student in school, and I have plenty of time, and I will face the school recruitment, which is an interview that pays much attention to basic knowledge, and I also hope to have a deep understanding of some basic knowledge. Then I can, of course, more in-depth to understand these relatively belongs to auxiliary knowledge content, the network protocol can I see the HTTP authority guidelines Douban links, server knowledge can I go on a server, do a complete own work before and after the end of project, but also has a lot of people network protocol over the post again is enough, The server only knows node.js and PHP, but it can also complete the front-end tasks very well. For these things, I suggest that if you have enough time and knowledge, you can learn more in-depth, I believe that these knowledge will be of great help to your own control of the hands of the work or the future development. After learning these routes, you should have your own common component libraries, such as the wheel map, modal boxes, etc., as well as JS libraries such as manipulating cookies, manipulating LocalStorage, Ajax, etc. Next, you can try to use these techniques to reconstruct small projects you did before, or you can try to do more complex projects, such as imitating zhihu, writing your own blogging system, etc. Anyway, the basic skills should be known by now, just not yet. It just takes a lot of practice to make them work.

How to prepare for school admission

Because recently, I have been preparing for the school, and I have made many detours and stumbles. I hope I can share this part of my experience with you.

Resume ready

Since you are going to an interview, the resume is of course the most basic preparation. For people with technical skills, what should you pay attention to in your resume? Just to give you my opinion. First of all, the resume must be simple and clear, otherwise how to call a resume. Concise, mainly including typesetting, color matching and font. General advice is color had better use light color attune, the resume is best not more than two kinds of color, layout according to the natural landscape layout of document flow, has obvious boundary between each big block, the font is recommended to use Microsoft elegant black, black, song typeface, such as the common font, it is looks comfortable, no pressure, the second is common fonts to make HR kindness, It’s not that you shouldn’t use other fonts, but unfamiliar fonts can be risky and not recommended unless you’re absolutely sure. The second is the content of the resume writing, the most important point is to try to write and your job objective related content, and to prioritize. For example, when writing the campus experience, and experience for the entire school community biggest so-and-so is A secretary, organized so-and-so activity, successfully attracted many people to participate in, achieve what effect, experience is A so-and-so B unknown association members, and completed the corporate website construction, the technique salon of the organization, to attract many people to participate in. For many students, it is easy to give up B experience and choose A. The reason is also very good. A club is A first-class club which is well-known in the university. Organizing activities in such A club and winning good response is A proof of my strength. However, B club, with a small number of people, is unknown in the school. Few people know it, and it is not convincing. That’s very true, but what I want to ask is that your ability as demonstrated by the A club is the ability that the interviewer cares about today? Since it is A technical interview, what you care most about is of course technical ability, and for the interviewer, he will not care about the A or B club with many people, which is famous and the same in their eyes. He will care more about what you have done in the club and what responsibilities you have undertaken. Obviously, the construction of community website, technical salon this kind of experience, for technical interview is more points. When writing your experience, be sure to put the technology-related items in the most prominent position, and at the same time put the projects you are most proud of and familiar with in the front. Always remember that the interview is for a technical position, always put technical ability in the first place, and show additional ability when there are other opportunities.

Knowledge to prepare

Actually in the school recruit interview, the most attention or basic knowledge. In my long experience of assisting lab seniors in interviews, the most frequently asked questions are just a few categories. One is the basic knowledge in elevation, such as prototype, prototype chain, closure, object, inheritance, etc., and the other is network protocol, operation mechanism, such asTCP three-way handshake,Event Loop,The message queueAnd so on, and then algorithms, likeArray to heavy,Quick sort,Bubble sortAnd so on. And, of course, CSS and HTMLFlex.Position.CSS draws various graphics.How to achieve vertical horizontal center.Common browser Hack codeAnd so on, these are relatively miscellaneous and many, but there are not many parts that need to be understood and you can basically see it in a few times, so it’s very quick to review.

My advice is that when reviewing these things, it’s best to know not only the basics, but also the concepts and extension.

So for example,posiationWhat kinds of attributes are there and what are their characteristics?

Most people can answer thatstatic | inherit | relative | absulote | fixed, includingfixedOut of the document flow, relative to the window positioning,absuloteOut of the document stream, relatively recent onePositionProperties forstaticLocate the parent element of,relativeDo not leave the document flow, relative to the original location of the element. Of course, this is true. But if you can still saycenter | page | stickyAnd wouldn’t it be better to know why these types of localization occur, that is, why they occurstickyPositioning, it solved the previous useCSSWhat problem can’t be solved or is easier to implement before usingCSSIt takes a lot of code to do it. It would be nice if you could also say what the current compatibility is and where it’s being used. And by thePositionExperienced interviewers can easily ask questions about how to get out of the document stream, what are the characteristics of different ways to get out of the document stream and so on.

To put it simply, in the process of preparing for an interview, you need to have a comprehensive and in-depth understanding of hot points, not only to understand their basic attributes and usage, but also to understand the common ways and skills of asking questions in the interview. When preparing, you should ask yourself questions in the interviewer’s mind.

When reviewing the knowledge, I highly recommend that you summarize it and write a blog. Because to be posted on the Internet to be reviewed by everyone, the subconscious will write more rigorous, serious, will arrange relatively perfect and accurate.

In my habit, when I encounter a big knowledge point, I will organize it into a blog post. In the process of organizing, I will refer to many articles and check different books. In many cases, you will find that the same knowledge point is completely different under the pen of different bloggers. Some are even wrong. Ruan Yifeng and Zhang Xinxu’s blog posts that I recommend are mostly complete and full of cases.

Here are some of the things I’ve done, some of which have been synchronized to the blog and some of which I’m still working on.



Mentality to prepare

Job hunting and employee recruitment is a mutual selection process, there is no best, only the most suitable. For people with good skills and clear goals, do their homework, fully understand the target company, sharpen their sense of smell, and capture every bit of information. For example, I am very interested in Company A and know that there will be A school recruitment every year. So you have to do is focus on the recruitment website, A company WeChat, join A company hiring community, at the same time actively using existing alumni resources to capture the first-hand information, on technology at the same time focus on technical team microblogging, blog, A company in A timely manner to understand the technical trend of A company, carefully study the use of technology stack, analyzes its technical route and taste. But for the general technology, no clear goal of the students. The thing to do is to send out a wide range of resumes, gain interview experience, and improve the probability of being selected. It’s simple math, given the same numerator (skill level), the higher the denominator (company), the better the result (more offers). And the interview was a strange upgrade process, accumulate experience through interviews, complement, and finally get a case of offers of known, summarization, the interview didn’t answer question, come out quickly by mobile phone down, down must be a good summary, think about what the interviewer wants to examine, I don’t know why this knowledge, Because the knowledge is too partial, or because it is not knowledge content, or is not skilled, for different questions to make up for different ways, and consider what he might ask next if the answer comes up. Again, ask yourself questions from the interviewer’s point of view.

conclusion

Finally, to borrow a very famous word on Zhihu. With the low level of effort of most people, it is impossible to fight talent. So, try your best, my friends, and I hope you can go further and further in the front end. Also hope xi ‘an front group more and more professional, more and more open and dynamic. Finally, I would like to mention my university, Xi ‘an University of Posts and Telecommunications, and my lab, ThoughtCoding Lab, which is a great school and a very open and inclusive lab. I’m so thankful to have met them on my way up. At the same time, I would like to thank Brother Jack and brother F7 for providing such a good communication opportunity and platform, as well as the guidance of the friends of Xi ‘an Front Group. We have learned a lot from you, and we can make progress together.

Here are my Blog, Github and email, welcome interested partners to discuss issues with me and make progress together.

Blog: ovenzeze. Coding. Me

Github:github.com/ovenzeze

Email address: [email protected]