Front End Questions
\
[❖] FRONT END INTERVIEW QUESTIONS
\
❖ GENERAL:
\
[❖] What did you learn yesterday/this week?
\
[❖] What excites or interests you about coding?
\
[❖] What is a recent technical challenge you experienced and how did you solve it?
\
\
[❖] Can you describe some SEO best practices or techniques you have used lately?
\
[❖] Can you explain any common techniques or recent issues solved in regards to front-end security?
\
[❖] What actions have you personally taken on recent projects to increase maintainability of your code?
\
[❖] Talk about your preferred development environment.
\
[❖] Which version control systems are you familiar with?
\
[❖] Can you describe your workflow when you create a web page?
\
[❖] If you have 5 different stylesheets, how would you best integrate them into the site?
\
[❖] Can you describe the difference between progressive enhancement and graceful degradation?
\
[❖] How would you optimize a website’s assets/resources?
\
[❖] How many resources will a browser download from a given domain at a time?
\
[❖] What are the exceptions?
\
[❖] Name 3 ways to decrease page load (perceived or actual load time).
\
[❖] If you jumped on a project and they used tabs and you used spaces, what would you do?
\
[❖] Describe how you would create a simple slideshow page.
\
[❖] If you could master one technology this year, what would it be?
\
[❖] Explain the importance of standards and standards bodies.
\
[❖] What is Flash of Unstyled Content? How do you avoid FOUC?
\
[❖] Explain what ARIA and screenreaders are, and how to make a website accessible.
\
[❖] Explain some of the pros and cons for CSS animations versus JavaScript animations.
\
[❖] What does CORS stand for and what issue does it address?
\
[❖] How did you handle a disagreement with your boss or your collaborator?
\
[❖] What resources do you use to learn about the latest in front end development and design?
\
[❖] What skills are needed to be a good front-end developer?
\
[❖] What role do you see yourself?
\
[❖] Explain the difference between cookies, session storage, and local storage?
\
❖ HTML:
\
[❖] What does a doctype do?
\
[❖] How do you serve a page with content in multiple languages?
\
[❖] What kind of things must you be wary of when designing or developing for multilingual sites?
\
[❖] What are data- attributes good for?
\
[❖] Consider HTML5 as an open web platform. What are the building blocks of HTML5?
\
[❖] Describe the difference between a cookie, sessionStorage and localStorage.
\
[❖] Describe the difference between, and .
\
\
[❖] What is progressive rendering?
\
\
[❖] Have you used different HTML templating languages before?
\
[❖] What is the difference between canvas and svg?
\
❖ CSS:
\
[❖] What is CSS selector specificity and how does it work?
\
[❖] What’s the difference between “resetting” and “normalizing” CSS? Which would you choose, and why?
\
[❖] Describe Floats and how they work.
\
[❖] Describe z-index and how stacking context is formed.
\
[❖] Describe BFC (Block Formatting Context) and how it works.
\
[❖] What are the various clearing techniques and which is appropriate for what context?
\
[❖] How would you approach fixing browser-specific styling issues?
\
[❖] How do you serve your pages for feature-constrained browsers?
\
[❖] What techniques/processes do you use?
\
[❖] What are the different ways to visually hide content (and make it available only for screen readers)?
\
[❖] Have you ever used a grid system, and if so, what do you prefer?
\
[❖] Have you used or implemented media queries or mobile specific layouts/CSS?
\
[❖] Are you familiar with styling SVG?
\
[❖] Can you give an example of an @media property other than screen?
\
[❖] What are some of the “gotchas” for writing efficient CSS?
\
[❖] What are the advantages/disadvantages of using CSS preprocessors?
\
[❖] Describe what you like and dislike about the CSS preprocessors you have used.
\
[❖] How would you implement a web design comp that uses non-standard fonts?
\
[❖] Explain how a browser determines what elements match a CSS selector.
\
[❖] Describe pseudo-elements and discuss what they are used for.
\
\
[❖] What does * { box-sizing: border-box; } do? What are its advantages?
\
[❖] What is the CSS display property and can you give a few examples of its use?
\
[❖] What’s the difference between inline and inline-block?
\
[❖] What’s the difference between the “nth-of-type()” and “nth-child()” selectors?
\
[❖] What’s the difference between a relative, fixed, absolute and statically positioned element?
\
[❖] What existing CSS frameworks have you used locally, or in production? How would you change/improve them?
\
[❖] Have you used CSS Grid?
\
[❖] Can you explain the difference between coding a web site to be responsive versus using a mobile-first strategy?
\
[❖] Have you ever worked with retina graphics? If so, when and what techniques did you use?
\
[❖] Is there any reason you’d want to use translate() instead of absolute positioning, or vice-versa? And why?
\
[❖] How is clearfix css property useful?
\
[❖] Can you explain the difference between px, em and rem as they relate to font sizing?
\
[❖] Can you give an example of a pseudo class? Can you provide an example use case for a pseudo class?
\
\
❖ JAVASCRIPT:
\
[❖] Explain event delegation.
\
[❖] Explain how this works in JavaScript.
\
[❖] Can you give an example of one of the ways that working with this has changed in ES6?
\
[❖] Explain how prototypal inheritance works.
\
[❖] What’s the difference between a variable that is: null, undefined or undeclared?
\
[❖] How would you go about checking for any of these states?
\
[❖] What is a closure, and how/why would you use one?
\
[❖] What language constructions do you use for iterating over object properties and array items?
\
\
[❖] What’s a typical use case for anonymous functions?
\
[❖] What’s the difference between host objects and native objects?
\
[❖] Explain the difference between: function Person(){}, var person = Person(), and var person = new Person()?
\
[❖] Explain the differences on the usage of foo between function foo() {} and var foo = function() {}
\
[❖] Can you explain what Function.call and Function.apply do? What’s the notable difference between the two?
\
[❖] Explain Function.prototype.bind.
\
[❖] What’s the difference between feature detection, feature inference, and using the UA string?
\
[❖] Explain “hoisting”.
\
[❖] Describe event bubbling.
\
[❖] Describe event capturing.
\
[❖] What’s the difference between an “attribute” and a “property”?
\
[❖] What are the pros and cons of extending built-in JavaScript objects?
\
[❖] What is the difference between == and ===?
\
[❖] Explain the same-origin policy with regards to JavaScript.
\
[❖] Why is it called a Ternary operator, what does the word “Ternary” indicate?
\
[❖] What is strict mode? What are some of the advantages/disadvantages of using it?
\
[❖] What are some of the advantages/disadvantages of writing JavaScript code in a language that compiles to JavaScript?
\
[❖] What tools and techniques do you use debugging JavaScript code?
\
[❖] Explain the difference between mutable and immutable objects.
\
[❖] What is an example of an immutable object in JavaScript?
\
[❖] What are the pros and cons of immutability?
\
[❖] How can you achieve immutability in your own code?
\
[❖] Explain the difference between synchronous and asynchronous functions.
\
[❖] What is event loop?
\
[❖] What is the difference between call stack and task queue?
\
[❖] What are the differences between variables created using let, var or const?
\
[❖] What are the differences between ES6 class and ES5 function constructors?
\
[❖] Can you offer a use case for the new arrow => function syntax? How does this new syntax differ from other functions?
\
[❖] What advantage is there for using the arrow syntax for a method in a constructor?
\
[❖] What is the definition of a higher-order function?
\
[❖] Can you give an example for destructuring an object or an array?
\
[❖] Can you give an example of generating a string with ES6 Template Literals?
\
[❖] Can you give an example of a curry function and why this syntax offers an advantage?
\
[❖] What are the benefits of using spread syntax and how is it different from rest syntax?
\
[❖] How can you share code between files?
\
[❖] Why you might want to create static class members?
\
[❖] What is the difference between while and do-while loops in JavaScript?
\
[❖] What is a promise? Where and how would you use promise?
\
❖ TESTING:
\
[❖] What are some advantages/disadvantages to testing your code?
\
[❖] What tools would you use to test your code’s functionality?
\
[❖] What is the difference between a unit test and a functional/integration test?
\
[❖] What is the purpose of a code style linting tool?
\
[❖] What are some of the testing best practices?
\
❖ PERFORMANCE:
\
[❖] What tools would you use to find a performance bug in your code?
\
[❖] What are some ways you may improve your website’s scrolling performance?
\
[❖] Explain the difference between layout, painting and compositing.
\
❖ MISC:
\
[❖] What’s a cool project that you’ve recently worked on?
\
[❖] What are some things you like about the developer tools you use?
\
[❖] Who inspires you in the front-end community?
\
[❖] Do you have any pet projects? What kind?
\
[❖] What’s your favorite feature of Internet Explorer?
Last updated