preface

First of all, I would like to brief you on the background of my interview. I am from Hubei province. I resigned from my job for personal reasons a year ago. Later, DUE to the epidemic, I was forced to stay at home and be unemployed for more than two months.

Around March 18th, after the closure of Hubei province was lifted, they came to Hangzhou. Hangzhou green code can be used throughout the city. But I stayed home for a week or so. This week, I applied to more than 20 companies and received about 10 interview invitations.

There are already a lot of interview questions online, so I’m not going to put them all together here. This article focuses on some personal tips and experience on how to get from the preparation stage to the Offer and how to choose the Offer.

General operation, first click “like” after watching oh! Your praise is one of the motivations for my creation!

An overview of


Interview Basics

Generally speaking, it takes about two weeks to interview and confirm the offer. The end result is not bad for me.

Hangzhou Company

  • There are more small and medium-sized companies, excluding Ali, Byte, netease, outsourcing and other companies, 100-500 people is good.
  • 996 companies are more, 9106 companies are less, and 965 companies are very few.
  • Mainly distributed in Binjiang, Huanglong International, Future Science and Technology City, dream town related areas.
  • Salary job treatment as a whole reluctantly also line, compared to Shanghai slightly weaker, Guangzhou slightly stronger.

About Ideal Company

  • Close to home (girlfriend at home, can’t come back late)
  • There is no 996 atmosphere.
  • Acceptable salary (not too high)
  • Have a good technical atmosphere (There is no clear definition of what a technical atmosphere is, but it can be seen in an interview. The interviewer must be a technical genius, and the job is technically challenging.

Interviews received

Due to the impact of the epidemic, there were few on-site interviews, mainly telephone and video interviews, while the second interviews were mostly on-site interviews

  • Three phone calls
  • 2 video faces
  • Two of them do it online
  • 2 on-site interviews

The interview results

  • There’s one on the line
  • All sides of the video pass
  • I passed all the questions
  • The front through about the scene, the scene of about 8
  • I received 4 offers within 3 days after the interview. I chose a non-996 company and have already joined the company
  • One of the companies offered an increase, but still refused after much consideration
  • After entering the company, I received 3 offers, which were also rejected

Resume management

Use templates or make templates

3 styles I recommend

  1. Use a good template, mainly to enhance the visual experience. Emphasize simplicity and don’t let flashy styles overwhelm the text. I used a 500 dons resume template and felt good about adapting it myself.

  2. Of course you can do without a template, just use markdown format, but obviously it’s not that good to print out.

  3. Online template, write your own CSS. Of course you’d better have a designer. Or write a copy of a designer’s work. It doesn’t require much technology, because writing a static page itself isn’t too technical for the front end. Mainly is the layout design elements and creativity.

Constant revision

Highlight the bright spot

There are three important aspects of a resume

  1. Work experience, project experience
  2. Technical highlights (deep research into something)
  3. Job matching degree

These areas need constant revision.

Accurate summary

Work experience, project experience. The work itself is gradually accumulated, to accurately summarize your achievements and effects in the work. For example: develop a XX system alone, optimize XX, and finally improve HOW much XX.

Broadening the boundaries

How do you highlight your strengths? How to stand out from the masses of competitors is very important. Skills add points to your resume.

Of course, this depends on accumulation at ordinary times, and I did these things seriously at ordinary times. Does have a certain love of technology.

For example: open source XXX library, how many star. Participated in XXX project and contributed code. Or what plug-ins they made and how many downloads they got. And so on are a plus for broadening boundaries.

Job matching degree

For example: JD write H5, how many years of Vue development experience. Then you should be careful.

If you don’t have that experience, your first choice is to look at other positions that match your skills. If there is no other post or want to enter, write on the resume first, and then fierce learning on the line, but also have the opportunity.

My previous articles have summed up a lot of Vue, H5 experience. If you all figure it out, there’s basically nothing wrong with working with Vue.

Manage your resume with Git version management

Good programmers are good programmers who are good at faking things.

Now that Github is so convenient, it’s a waste not to use it to do more. Private projects are also free, and using Github to manage your resume is just plain cool.

Git also allows you to tag, use YARN build, split your resume into modules, do a wave of build packaging, and automatically generate web pages and PDF versions.

Company selection and delivery

My goals were small and I didn’t want to practice with a company, so I didn’t give too many approvals. If you want to get into a good company, you need to deliver in batches.

Batch concentrated delivery, progress in stability

The benefits of batch delivery mainly lie in that the mentality will not be too collapsed, with the guarantee and practice, the challenge of the ideal company is not empty.

This is my front, not my current face, this is even treatment. But the better way is to divide it:

The first batch: guarantee and practice

Mainly the smaller, less well-paid companies that seem easy to get into.

Second batch: most likely, most likely to go to the company

This is the target company, basically meets the demand. But maybe the company is not so big, but still satisfied, very likely to enter.

Batch 3: Challenging companies

The interview cycle is long, the competition is high, and the preparation time is long. Companies you can consider dropping your previous offer. But 996 is also worth considering.

Why centralize delivery?

The offer will be made within a week after the interview. Only when the offer comes out at the same time, can we have the space to choose. Companies don’t give you much time to accept an Offer.

Another point is the mentality. The longer the interview cycle drags on, the worse the mood and state of the interview.

Interview preparation

Knowledge comb

Carry out knowledge sorting, check the gaps and fill the gaps. Don’t be too complete here, focus on the key points and build a front-end knowledge network in the brain

1. Construct knowledge network graph

I use XMind


It’s a little bit too much, but of course this is the way I’ve been doing it before, building up a network of knowledge. Front-end knowledge is too much, it is difficult to rely on memory alone, so usually, access to knowledge will increase in the above, look up again, it is easy to find.

First I break down my front-end knowledge into these big areas

  • HTML (Meta, HTML5)
  • CSS (including CSS3, Less, and Sass)
  • JavaScript (ES5, ES6, TS, with emphasis on object orientation)
  • Node (including Koa and SSR)
  • Webpack (Principles, source code, common methods)
  • Vue (bidirectional binding/DIff principle, source code, common methods)
  • React (Diff /hooks principles, source code, common methods)
  • H5 & Hybrid (1px, layout mode, and client call mode)
  • WebApi (Storage, caching)
  • Browser mechanisms (rendering mechanisms, HTTP/HTTPS, security)
  • Performance optimization (browser rendering, resource loading, request, CDN, package build)

Then break it down one by one into small knowledge points, such as CSS


Finally, check and fill gaps

Fold up all the memorized areas inside and ask yourself hypothetical questions to see if you can answer them, for example

Question1: Can you talk about box models?

You should answer the following key points

  • What are the types of box models?
  • How to calculate the height and width of each content in the box model?
  • How do I set the box model?

Question2: how to achieve vertical center in layout?

Then you should answer the following key points

  • What are the ways of vertical center? What are the advantages and limitations?
  • Simply write a common vertical center
  • If you answer using Flexbox, you might want to ask yourself something about Flexbox and how it compares to other layouts

So, we’ve built a network of knowledge that works when the interviewer moves from question to question. This problem is still within the scope of our knowledge network.

Most interviewers, or attach great importance to the foundation, so the comb of basic knowledge is certainly the first step to pass the interview, but also other people fail the most step of the interview.

2. Focus

It’s not enough just to answer some simple memory questions. Deep understanding and mastery of knowledge is the key to interview.

The knowledge network is so large that we can’t cover everything, so we need to understand the 2/8 principle, and only ask for 20% of the research part during the interview, so we don’t need to go into all of it.

Based on my interview situation in so many days, the most frequently asked questions in the interview are basically these

  • HTTP/HTTPS (100%, the key of the key, this can take half a day to research)
  • Webpack principle, long-acting cache, Tree Sharking principle
  • Promise principles and methods, about synchronous asynchrony (100% asked)
  • Flexbox-related (CSS is a basic question to ask, because you work with it)
  • Small and medium-sized companies love questions
  • Vue bidirectional binding principle (CV Vue, basic must ask)
  • React setState update mechanism
  • Redux principle (high probability will ask)
  • Prototype (high probability)
  • Synchronous asynchronous function output (with high probability, extends to event loop)
console.log(1)

setTimeout((a)= > {

    console.log(2)

}, 1000)

setTimeout((a)= > {

    console.log(3)

})

console.log(4)

// The answer is 1, 4, 3, 2

// The synchronous function is executed first, and the asynchronous function is executed according to the time queue

Copy the code

These 10 questions are highly likely to be asked, unless an interviewer reads this article and takes a different approach

3. Be sure to brush

Why should I brush it?

One reason is that companies with better technology are looking for candidates who can solve programming problems and have some algorithmic skills.

The second reason is that many companies interview questions are directly taken from the question bank, so brush is earned, but also can help you consolidate knowledge

Brush questions are divided into two types, one is programming questions, the other is knowledge questions

For programming problems, you can directly pick some low difficulty problems in Leetcode, and then brush the high difficulty problems after proficiency.


There is a plugin for leetcode on vscode that is very useful and I often use it to brush problems.

Knowledge questions, you can brush the question bank, quickly an hour can brush hundreds of questions. Can brush the question bank inside niu class net next question. I often brush it without any trouble, and there are other directions in it besides the front.

Project preparation

Sorting out key projects

  • Project background What needs are addressed, how many people are involved, and what is the project prospect
  • The project period is XXX and the time is XXX. What is the completion degree and the online APP or website address
  • Project difficulties XXX encountered XXX difficulties, what are the difficulties? How did you solve the difficulty? What do you get out of it
  • Technology stack XXX + XXX, how to achieve XXX
  • Key areas implementation details there is a place how it is implemented, why it is implemented, any other methods

Q&A

  • What are the difficulties encountered in the project? How did it work out? What did you get?
  • What is the process of the project
  • What was your role in the project and what did you do?

Interview skills

I’ve come up with five tips

Accurate summary

The more nonsense, the higher the cost of communication. Be brief and succinct in your response. Don’t rush to expand until the interviewer asks further. Such as

Question1: what are the Vue communications?
Parent component to child component Props, child component to parent component event callback, $emit, @handleEvent 2. Non-parent and child use bus 3. V-modle 4. Vuex


Qustion2: What is Vuex? A centralized state management tool.


Question3: How does it work? Create a Store object to centrally manage state. Commit: mutations to change the status. Dispatch: Action to combine business logic for asynchronous invocation.

Copy the code
Question4: Can mutations implement asynchronous code? Why is that? No, because mutations update state is a synchronous update process, and if the code is asynchronous, the update of state will be blocked.

Honest and serious

If you don’t know, just say you don’t know, or you haven’t come across this situation.

Most interviewers will say, it doesn’t matter. Then ask the next question.

Don’t argue

Many topics have different understandings and will have different opinions. If you think the interviewer’s understanding of a question is wrong, do not immediately deny it. You should first write down the interviewer’s question and explanation, and then refer to the information to determine whether it is right or wrong after the interview results.

There is no way to decide who is right and who is wrong. The result of the argument is very likely to lead to the failure of the interview.

assertive

Interviewers often ask questions like, is this process synchronous or asynchronous? Are you sure? determine

Sometimes the interviewer will test you to repeat the question

If you change your answer, you’ll look like you’re guessing and leave a bad impression. At this time even if answer is wrong, also want clank have word answer “certain”.

After understanding a

Be sure to listen carefully to the interviewer’s questions, understand what the interviewer wants you to say, and think carefully before answering. Otherwise answer along while, the door is wrong, that embarrassed.

Actual interview stage

A phone interview

Got three calls, two around 5:00 p.m., one at 8:00 p.m., pretty much right before work. The questions were pretty simple, mostly about Vue and Webpack, and ES6

Q1: Introduce yourself briefly

A short answer will do

Q2: Is there contact with ES6?

Proxy, Promise, arrow functions, Async&await, Map&weakMap, Set, iterator these are randomly asked

Q3: What are the differences between maps and objects? Has Proxy ever been useful? It introduced the

Q4: What are the benefits of promises over callbacks? What are the benefits of async&await over Promise? How did the Promise come true?

Q5: Has Webpack had any contact? How to optimize a packaged build? How do I do long cache? What is the tree Sharking principle?

Q6: Does Http have a touch? Tell me what you think of it, in as much detail as possible?

Q7: How to deal with security problems, do you know common network tools?

Q8: What is the principle of Vue bidirectional binding?

Q9: How does Vue customize filters and instructions?

Q10: How are mixins implemented in Vue?

Q11: Have you ever written a Webpack plug-in? When did the WebPack plug-in run?

After the interview, GENERALLY the next morning, HR calls to arrange an on-site interview

The Internet problem.

Do a problem in cow class net commonly, video interview is received after finishing the problem, what is the topic specific forgotten, remember approximate content

Online do questions, programming questions, and look at the code topic more, will not directly test the form of questions

Q1: Box model calculation

Q2: Look at the prototype and see the output of a piece of code

Q3: Look at synchronous functions and asynchronous functions and see the code output

Q4: Three-column layout, fixed left and right sides, free middle, handwritten code

Q5: sessionStorage, localStorage,cookie difference

Q6: Http handshake mechanism

Q7: Programming problem – Find the intersection of two arrays

Q8: Programming problem – Replace strings

Video interview

After doing the problem commonly, the knowledge point of the problem is related. Or is the scene to do, see you answer the process.

Q1: Try writing simple bidirectional binding code

Q2: Write code for a three-column layout

Q3: Transform this Promise code into a Try Catch to get an exception

Q4: Write a simple Promise

Q5: Write a simple anti – shake function

Q6: Flattening the array

Fundamentals down, the interviewer will guide you bit by bit, to see if your thinking is clear. Do not have to be able to run, write a general idea can be.

On-site interview

Pay attention to be sure to advance a little, one is to find the location, some companies in the corner is too partial, really hard to find, to avoid the delay. Two is to go in a little earlier to fill in the form, a little earlier to leave a good impression

It’s usually around 10:30 in the morning or 2 in the afternoon. Fill out the form and start the interview

technical

One side is basically the department front-end leader or senior front-end, and the content is similar to the previous one.

The difference may be to ask more about projects and work experience, and the probability of passing the site is also higher.

Q1: Introduce yourself

.

Qn: What are the difficulties in the project? How did it work out

Qn+1: XXX is written on your resume. Tell me more about it

Qn+2: What do you think about that? Why do you do that? Have you considered any improvement points?

Q2n: What do you want to ask me?

Just a moment, I’ll call our boss

FAIL, please go back today, and HR may contact you later

BOSS face

Any question may be asked, more comprehensive (from the following aspects)

  • Thinking habit
  • communication
  • Personal development
  • Career planning
  • Technical thinking
  • Technical understanding
  • High generalization ability

Q1: Introduce yourself

Q2: Do a thinking problem (actually, a brain teaser)

Q3: Talk about HTTP

Q4: Enter the address to XXX, say it all again, the more detailed the better

Q5: Algorithm questions (depth traversal, breadth traversal, sorting, search)

Q6: React and Redux ideas and principles

Q7: What are you reading these days? What technology?

Q8: What are your career plans?

Just a moment, I’ll call HR. Or HR will notify you within a week

HR side

B: Mainly about personal information, salary expectations, when to start work and so on

Current status

  • Whether the departure of
  • Living location (in terms of distance)
  • If you have a family
  • Do you have long-term plans
  • When can YOU start to work

Expected salary and remuneration

  • Acceptable wage
  • Whether to accept overtime work

Willingness to join the company

  • Know the company
  • How do you learn about the company
  • How do you feel about the company

To flourish

  • How many companies are you interviewing with
  • How many offers did you get
  • How about the company that got the offer? Do you want to go there

Afterword.

By the time I finish this article, the author has been on the job for more than a week. It’s been so busy this week that I hardly have time in the daytime. I could only spare an hour to write every night. I had been writing intermittently for about a week, and now I had finally finished it.

If it helps you, that’s its greatest value. I can’t get over it if I don’t like it! 😄

Due to the limited technical level, if there is any mistake in the article, please point out in the comment area, thank you!

Because the company uses React + TypeScript + Vue + Webpack + Node stack, I would like to pay more attention to the output of these aspects in the future.

Finally, I wish everyone can find their own satisfactory work!