Creating a template to translate (#844)
This commit is contained in:
Rob Larsen
GitHub
parent
f741e0e316
commit
5c622b560b
|
|
@ -0,0 +1,211 @@
|
|||
---
|
||||
title: Front End Developer Interview Questions
|
||||
layout: layouts/page.njk
|
||||
permalink: /translations/************/index.html
|
||||
---
|
||||
|
||||
|
||||
## <a name='toc'>Table of Contents</a>
|
||||
|
||||
1. [General Questions](#general)
|
||||
1. [HTML Questions](#html)
|
||||
1. [CSS Questions](#css)
|
||||
1. [JS Questions](#js)
|
||||
1. [Testing Questions](#testing)
|
||||
1. [Performance Questions](#performance)
|
||||
1. [Network Questions](#network)
|
||||
1. [Fun Questions](#fun)
|
||||
|
||||
|
||||
#### [[⬆]](#toc) <a name='general'>General Questions:</a>
|
||||
|
||||
* 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?
|
||||
* When building a new web site or maintaining one, can you explain some techniques you have used to increase performance?
|
||||
* 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 in?
|
||||
* Explain the difference between cookies, session storage, and local storage?
|
||||
* Can you explain what happens when you enter a URL into the browser?
|
||||
|
||||
#### [[⬆]](#toc) <a name='html'>HTML Questions:</a>
|
||||
|
||||
* 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 `<script>`, `<script async>` and `<script defer>`.
|
||||
* Why is it generally a good idea to position CSS `<link>`s between `<head></head>` and JS `<script>`s just before `</body>`? Do you know any exceptions?
|
||||
* What is progressive rendering?
|
||||
* Why you would use a `srcset` attribute in an image tag? Explain the process the browser uses when evaluating the content of this attribute.
|
||||
* Have you used different HTML templating languages before?
|
||||
* What is the difference between `canvas` and `svg`?
|
||||
* What are empty elements in HTML ?
|
||||
|
||||
|
||||
#### [[⬆]](#toc) <a name='css'>CSS Questions:</a>
|
||||
|
||||
* 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.
|
||||
* Explain your understanding of the box model and how you would tell the browser in CSS to render your layout in different box models.
|
||||
* 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?
|
||||
* What is the difference between a block level element and an inline element. Can you provide examples of each type of element?
|
||||
* What is the difference between CSS Grid and Flexbox? When would you use one over the other?
|
||||
|
||||
#### [[⬆]](#toc) <a name='js'>JS Questions:</a>
|
||||
|
||||
* 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?
|
||||
* Can you describe the main difference between the `Array.forEach()` loop and `Array.map()` methods and why you would pick one versus the other?
|
||||
* 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".
|
||||
* What is type coercion? What are common pitfalls of relying on type coercion in JavaScript code?
|
||||
* 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?
|
||||
* Discuss how you might use Object Oriented Programming principles when coding with JavaScript.
|
||||
|
||||
## Coding questions
|
||||
* Make this work:
|
||||
```javascript
|
||||
duplicate([1,2,3,4,5]); // [1,2,3,4,5,1,2,3,4,5]
|
||||
```
|
||||
* Create a for loop that iterates up to `100` while outputting **"fizz"** at multiples of `3`, **"buzz"** at multiples of `5` and **"fizzbuzz"** at multiples of `3` and `5`
|
||||
* What will be returned by each of these?
|
||||
```javascript
|
||||
console.log("hello" || "world")
|
||||
console.log("foo" && "bar")
|
||||
```
|
||||
* Write an immediately invoked function expression (IIFE)
|
||||
|
||||
|
||||
#### [[⬆]](#toc) <a name='testing'>Testing Questions:</a>
|
||||
|
||||
* 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?
|
||||
|
||||
|
||||
#### [[⬆]](#toc) <a name='performance'>Performance Questions:</a>
|
||||
|
||||
* 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.
|
||||
|
||||
#### [[⬆]](#toc) <a name='network'>Network Questions:</a>
|
||||
|
||||
* Traditionally, why has it been better to serve site assets from multiple domains?
|
||||
* Do your best to describe the process from the time you type in a website's URL to it finishing loading on your screen.
|
||||
* What are the differences between Long-Polling, Websockets and Server-Sent Events?
|
||||
* Explain the following request and response headers:
|
||||
* Diff. between Expires, Date, Age and If-Modified-...
|
||||
* Do Not Track
|
||||
* Cache-Control
|
||||
* Transfer-Encoding
|
||||
* ETag
|
||||
* X-Frame-Options
|
||||
* What are HTTP methods? List all HTTP methods that you know, and explain them.
|
||||
* What is domain pre-fetching and how does it help with performance?
|
||||
* What is a CDN and what is the benefit of using one?
|
||||
|
||||
#### [[⬆]](#toc) <a name='fun'>Fun Questions:</a>
|
||||
|
||||
* 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?
|
||||
Loading…
Reference in New Issue