Victor Coulon
commit
79c6b003bf
|
|
@ -1,8 +1,8 @@
|
|||
#JOB INTERVIEW QUESTIONNAIRE
|
||||
# QUESTIONNAIRE DE RECRUTEMENT
|
||||
|
||||
@version 1.0
|
||||
|
||||
##Contributors
|
||||
## Contributors
|
||||
|
||||
@bentruyman (http://bentruyman.com/), @roger_raymond (http://twitter.com/iansym), @ajpiano (http://ajpiano.com/), @paul_irish (http://paulirish.com/), @SlexAxton (http://alexsexton.com/), @boazsender (http://boazsender.com/), @miketaylr (http://miketaylr.com/), @vladikoff (http://vladfilippov.com/), @gf3 (http://gf3.ca/), @jon_neal (http://twitter.com/jon_neal), @wookiehangover (http://wookiehangover.com/) and @darcy_clarke (http://darcyclarke.me)
|
||||
|
||||
|
|
@ -12,13 +12,13 @@
|
|||
* Si oui, qui suivez-vous ?
|
||||
* Êtes-vous sur GitHub ?
|
||||
* Si oui, donnez quelques exemples de dépôt que vous suivez.
|
||||
* A quel blog êtes vous abonnez?
|
||||
* A quels blogs êtes vous abonné ?
|
||||
* Quel logiciel de gestion de versions avez-vous déjà utilisé ? (Git, SVN etc.)
|
||||
* Quel est votre environnement de développement préféré ? (OS, Editor, Browsers, Tools etc.)
|
||||
* Pouvez-vous décrire votre workflow lorsque vous créez une page web ?
|
||||
* Pouvez-vous décrire la différence entre amélioration progressive et dégradation progressive ?
|
||||
* Un point bonus si vous décrivez des méthodes de détections
|
||||
* Expliquez ce que le terme "sémantique HTML" signifie.
|
||||
* Un point bonus si vous décrivez des méthodes de détection
|
||||
* Expliquez ce que le terme "HTML sémantique" signifie.
|
||||
* Quel naviguateur et outils de débogage web utilisez-vous ?
|
||||
* Comment optimisez vous les performances de vos page web (assets/resources) ?
|
||||
* Énumérez quelques solutions comme :
|
||||
|
|
@ -26,186 +26,189 @@
|
|||
* La minification des fichiers
|
||||
* L'utilisation d'un Content Delivery Network (CDN)
|
||||
* La mise en cache
|
||||
* etc.
|
||||
* etc…
|
||||
* Pourquoi est-il préférable de disposer ses assets sur des domaines différents ?
|
||||
* Combien de ressources différentes un navigateur peut télécharger à partir d'un même domaine à un instant T ?
|
||||
* Donnez 3 façons qui permettent de réduire le temps de chargement d'une page. (perçu ou réel)
|
||||
* Si vous démarrez sur un projet existant, que votre prédécesseur a utilisé des tabulations pour indenter son code et que vous utilisez des espaces, que faites-vous ?
|
||||
* Proposez d'utiliser quelque chose comme EditorConfig (http://editorconfig.org)
|
||||
* Rester fidèle aux conventions
|
||||
* Vous Proposez d'utiliser quelque chose comme EditorConfig (http://editorconfig.org)
|
||||
* Vous Restez fidèle aux conventions
|
||||
* `issue :retab! command`
|
||||
* Développez un simple slideshow
|
||||
* Un point bonus si vous le faites sans JS
|
||||
* Quel outils utilisez vous pour tester la performance de votre code ?
|
||||
* JSPerf (http://jsperf.com/)
|
||||
* Dromaeo (http://dromaeo.com/)
|
||||
* etc.
|
||||
* etc…
|
||||
* Si vous pouviez maitriser parfaitement une technologie cette année, laquelle serait-ce ?
|
||||
* Expliquez l'importance des standards et des organisations gérant les standards.
|
||||
* Expliquez l'importance des standards et des organisations les édictant.
|
||||
|
||||
## HTML-Specific Questions:
|
||||
## Questions spécifiques à HTML :
|
||||
|
||||
* What's a `doctype` do, and how many can you name?
|
||||
* What's the difference between standards mode and quirks mode?
|
||||
* What are the limitations when serving XHTML pages?
|
||||
* Are there any problems with serving pages as `application/xhtml+xml`?
|
||||
* How do you serve a page with content in multiple languages?
|
||||
* What kind of things must you be wary of when design or developing for multilingual sites?
|
||||
* Can you use XHTML syntax in HTML5?
|
||||
* How do you use XML in HTML5?
|
||||
* What are `data-` attributes good for?
|
||||
* What are the content models in HTML4 and are they different in HTML5?
|
||||
* Consider HTML5 as an open web platform. What are the building blocks of HTML5?
|
||||
* Describe the difference between cookies, sessionStorage and localStorage.
|
||||
* Qu'est-ce qu'un `doctype` fait, et combien pouvez-vous en nommer ?
|
||||
* Quelle est la différence entre les modes `standard` et `quirks`
|
||||
* Quelles sont les limitations des pages XHTML ?
|
||||
* Y a t'il des problèmes à envoyer des pages avec le content-type `application/xhtml+xml` ?
|
||||
* Comment servez vous une page avec du contenu multilingue ?
|
||||
* À quoi devez-vous faire attention quand vous designez ou développez des pages pour des sites multilingues ?
|
||||
* Pouvez vous utliser une syntaxe XHTML en HTML5 ?
|
||||
* Comment utilisez vous du XML en HTML5 ?
|
||||
* À quoi servent les `data-` attributes ?
|
||||
* Que sont les modèles de contenus en HTML4, et diffèrent-ils de HTML5 ?
|
||||
* Si l'on considère que HTML5 est une plateforme web ouverte, quels sont les briques de base de HTML5 ?
|
||||
* Décrivez la différence entre cookies, sessionStorage, et localStorage.
|
||||
|
||||
## JS-Specific Questions
|
||||
|
||||
* Which JavaScript libraries have you used?
|
||||
* How is JavaScript different from Java?
|
||||
* What's a hashtable?
|
||||
* What are `undefined` and `undeclared` variables?
|
||||
* What is a closure, and how/why would you use one?
|
||||
* Your favorite pattern used to create them? argyle (Only applicable to IIFEs)
|
||||
* What's a typical use case for anonymous functions?
|
||||
* Explain the "JavaScript module pattern" and when you'd use it.
|
||||
* Bonus points for mentioning clean namespacing.
|
||||
* What if your modules are namespace-less?
|
||||
* How do you organize your code? (module pattern, classical inheritance?)
|
||||
* What's the difference between host objects and native objects?
|
||||
* Difference between:
|
||||
## Questions spécifiques à Javascript :
|
||||
* Quelles sont les librairies Javascript que vous avez utilisé ?
|
||||
* En quoi Javascript est-il différent de Java ?
|
||||
* Qu'est-ce qu'une hashTable ?
|
||||
* Que sont les variables `undefined` et `undeclared` ?
|
||||
* Qu'est-ce qu'une closure, et pourquoi / comment en utiliseriez vous une ?
|
||||
* Votre patten favori pour les créer ? (seulement pour les IIFEs, fonctions-expressions évoquées immédiatement)
|
||||
* Quel est un cas d'utilisation typique pour une fonction anonyme ?
|
||||
* Expliquer les pattern Javascript de "Module", et quand vous l'utiliseriez.
|
||||
* Un point bonus si vous parlez de namespacing
|
||||
* Que se passe t'il si vos modules ne sont pas namespacés ?
|
||||
* Comment organisez vous votre code (pattern modulaire, héritage classique ?)
|
||||
* Quelle est la différence entre objets hôtes et objets natifs ?
|
||||
* Différence entre :
|
||||
```javascript
|
||||
function Person(){} var person = Person() var person = new Person()
|
||||
function Person(){}
|
||||
var person = Person() // et
|
||||
var person = new Person()
|
||||
```
|
||||
* What's the difference between `.call` and `.apply`?
|
||||
* explain `Function.prototype.bind`?
|
||||
* When do you optimize your code?
|
||||
* Can you explain how inheritance works in JavaScript?
|
||||
* When would you use `document.write()`?
|
||||
* Most generated ads still utilize `document.write()` although its use is frowned upon
|
||||
* What's the difference between feature detection, feature inference, and using the UA string
|
||||
* Explain AJAX in as much detail as possible
|
||||
* Explain how JSONP works (and how it's not really AJAX)
|
||||
* Have you ever used JavaScript templating?
|
||||
* If so, what libraries have you used? (Mustache.js, Handlebars etc.)
|
||||
* Explain "hoisting".
|
||||
* What is FOUC? How do you avoid FOUC?
|
||||
* Describe event bubbling.
|
||||
* What's the difference between an "attribute" and a "property"?
|
||||
* Why is extending built in JavaScript objects not a good idea?
|
||||
* Why is extending built ins a good idea?
|
||||
* Difference between document load event and document ready event?
|
||||
* What is the difference between `==` and `===`?
|
||||
* Explain how you would get a query string parameter from the browser window's URL.
|
||||
* Explain the same-origin policy with regards to JavaScript.
|
||||
* Explain event delegation.
|
||||
* Describe inheritance patterns in JavaScript.
|
||||
* Make this work:
|
||||
* Quelle est la différence entre `.call` et `.apply` ?
|
||||
* Expliquez `Function.prototype.bind` ?
|
||||
* Quand optimisez-vous votre code ?
|
||||
* Pouvez vous expliquer comment fonctionne l'héritage en Javascript ?
|
||||
* Quand utiliseriez-vous `document.write()` ?
|
||||
* La plupart des pubs utilisent encore `document.write()` même si son utilisation est découragée.
|
||||
* Quelle est la différence entre détection de feature, inférence de feature, et l'utilisation de l'User Agent ?
|
||||
* Expliquez un call AJAX dans le plus grand détail possible
|
||||
* Expliquez comment JSONP fonctionne (et en quoi ca n'est pas réellement de l'AJAX)
|
||||
* Avez vous déja utilisé fait du templating en Javascript ?
|
||||
* Si oui, quelles librairies avez vous utilisé (Mustache.js, Handlebars etc…)
|
||||
* Expliquez "hoisiting".
|
||||
* Quest-ce que le FOUC, comment l'évitez vous ?
|
||||
* Décrivez le bubbling d'évênement.
|
||||
* Quelle est la différence entre un "attribut" et une "propriété"
|
||||
* Pourquoi étendre les objets natifs Javascript n'est pas une bonne idée ?
|
||||
* Pourquoi étendre les objets natifs est une bonne idée ?
|
||||
* Quelle est la différence entre les évenements `load` et `ready` du document?
|
||||
* Quelle est la différence entre `==` et `===` ?
|
||||
* Expliquez comment vous récupéreriez un paramètre de querystring de l'URL du browser.
|
||||
* Expliquez la politique d'origine commune et ses implication en Javascript.
|
||||
* Expliquez la délégation d'évênement.
|
||||
* Expliquez les patterns d'héritage en Javascript.
|
||||
* Faites fonctionner ceci :
|
||||
```javascript
|
||||
[1,2,3,4,5].duplicator(); // [1,2,3,4,5,1,2,3,4,5]
|
||||
```
|
||||
* Describe a strategy for memoization (avoiding calculation repetition) in JavaScript.
|
||||
* Why is it called a Ternary statement, what does the word "Ternary" indicate?
|
||||
* What is the arity of a function?
|
||||
* Décrivez une stratégie de mémoization (pour éviter la répétition des calculs) en Javascript.
|
||||
* Qu'est-que qu'une instruction 'Ternaire', et qu'indique le mot 'Ternaire'
|
||||
* Qu'est-ce que l'arité d'une fonction ?
|
||||
|
||||
## JS-Code Examples:
|
||||
## Exemples de code JS
|
||||
|
||||
```javascript
|
||||
~~3.14
|
||||
```
|
||||
Question: What value is returned from the above statement?
|
||||
**Answer: 3**
|
||||
Question: Que retourne ce code ?
|
||||
**Réponse: 3**
|
||||
|
||||
```javascript
|
||||
"i'm a lasagna hog".split("").reverse().join("");
|
||||
"je suis un bouffeur de lasagne".split("").reverse().join("");
|
||||
```
|
||||
Question: What value is returned from the above statement?
|
||||
**Answer: "goh angasal a m'i"**
|
||||
Question: Que retourne ce code ?
|
||||
**Réponse: "engasal ed rueffuob nu sius ej"**
|
||||
|
||||
```javascript
|
||||
( window.foo || ( window.foo = "bar" ) );
|
||||
```
|
||||
Question: What is the value of window.foo?
|
||||
**Answer: "bar"**
|
||||
only if window.foo was falsey otherwise it will retain its value.
|
||||
Question: Que retourne window.foo?
|
||||
**Réponse: "bar"**
|
||||
seulement si window.foo n'était pas défini ou faux, autrement il garde sa valeur
|
||||
|
||||
```javascript
|
||||
var foo = "Hello"; (function() { var bar = " World"; alert(foo + bar); })(); alert(foo + bar);
|
||||
```
|
||||
Question: What is the outcome of the two alerts above?
|
||||
**Answer: "Hello World" & ReferenceError: bar is not defined**
|
||||
Question: Que se passe t'il à l'éxécution de ce code ?
|
||||
**Réponse: "Hello World" & ReferenceError: bar is not defined**
|
||||
|
||||
```javascript
|
||||
var foo = [];
|
||||
foo.push(1);
|
||||
foo.push(2);
|
||||
```
|
||||
Question: What is the value of foo.length?
|
||||
**Answer: `2`
|
||||
Question: Quelle est la valeur de foo.length ?
|
||||
**Réponse: `2`
|
||||
|
||||
```javascript
|
||||
var foo = {};
|
||||
foo.bar = 'hello';
|
||||
```
|
||||
Question: What is the value of foo.length?
|
||||
**Answer: `undefined`
|
||||
Question: Quelle est la valeur de foo.length ?
|
||||
**Réponse: `undefined`
|
||||
|
||||
|
||||
## jQuery-Specific Questions:
|
||||
## Questions spécifiques à jQuery :
|
||||
|
||||
* Explain "chaining".
|
||||
* Explain "deferreds".
|
||||
* What are some jQuery specific optimizations you can implement?
|
||||
* What does `.end()` do?
|
||||
* How, and why, would you namespace a bound event handler?
|
||||
* Name 4 different values you can pass to the jQuery method.
|
||||
* Selector (string), HTML (string), Callback (function), HTMLElement, object, array, element array, jQuery Object etc.
|
||||
* What is the effects (or fx) queue?
|
||||
* What is the difference between `.get()`, `[]`, and `.eq()`?
|
||||
* What is the difference between `.bind()`, `.live()`, and `.delegate()`?
|
||||
* What is the difference between `$` and `$.fn`? Or just what is `$.fn`.
|
||||
* Optimize this selector:
|
||||
* Expliquez le chainage
|
||||
* Expliquez 'deferred'
|
||||
* Décrivez des optimisations spécifiques à jQuery que vous pouvez implémenter.
|
||||
* Que fait `.end()` ?
|
||||
* Pourquoi et comment restreindriez-vous un evenement bindé à un un namespace ?
|
||||
* Nommez 4 valeurs différentes que vous pouvez passer à la méthode jQuery.
|
||||
* Sélecteur (string), HTML (string), Callback (function), HTMLElement, objet, tableau, tableau d'éléments, objet jQuery, etc…
|
||||
* Qu'est-ce que la queue d'effets (fx queue) ?
|
||||
* Quelle est la différence entre `.get()`, `[]`, et `.eq()` ?
|
||||
* Quelle est la différence entre `.bind()`, `.live()`, et `.delegate()`?
|
||||
* Quelle est la différence entre `$` et `$.fn`? Ou bien seulement : qu'est-ce que `$.fn`.
|
||||
* Optimisez ce sélecteur :
|
||||
```javascript
|
||||
$(".foo div#bar:eq(0)")
|
||||
```
|
||||
|
||||
## CSS-Specific Questions:
|
||||
## Questions spécifiques CSS :
|
||||
|
||||
* Describe what a "reset" CSS file does and how it's useful.
|
||||
* Describe Floats and how they work.
|
||||
* What are the various clearing techniques and which is appropriate for what context?
|
||||
* Explain CSS sprites, and how you would implement them on a page or site.
|
||||
* What are your favourite image replacement techniques and which do you use when?
|
||||
* CSS property hacks, conditionally included .css files, or... something else?
|
||||
* 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?
|
||||
* Any familiarity with styling SVG?
|
||||
* How do you optimize your webpages for print?
|
||||
* What are some of the "gotchas" for writing efficient CSS?
|
||||
* Do you use CSS preprocessors? (SASS, Compass, Stylus, LESS)
|
||||
* If so, 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?
|
||||
* Webfonts (font services like: Google Webfonts, Typekit etc.)
|
||||
* Explain how a browser determines what elements match a CSS selector?
|
||||
* Décrivez ce que fait un fichier CSS Reset, et pourquoi il est utile.
|
||||
* Décrivez les Floats, et comment ils fonctionnent.
|
||||
* Quelles sont les différentes méthodes de clearing des floats, et laquelle est appropriée pour chaque contexte ?
|
||||
* Expliquez les sprites CSS, et comment vous les implémenteriez sur une page ou un site.
|
||||
* Quelles sont vos techniques favorites de remplacement d'images, et comment les utilisez vous ?
|
||||
* hacks de propriétés CSS, fichiers .css inclus avec des commentaires conditionnels, ou autre ?
|
||||
* Comment servez vous vos pages pour les browsers aux fonctionnalités réduites ?
|
||||
* Quelles techniques / process utilisez vous ?
|
||||
* Quelles sont les différentes manières de masquer du contenu (en le laissant disponible pour les lecteurs d'écran) ?
|
||||
* Avez vous déja utilisé un grid system, et si oui, lequel préférez-vous ?
|
||||
* Avez vous déja implémenté des media queries, ou des layouts/CSS spécifiques aux mobiles ?
|
||||
* Déja touché au styling de SVG ?
|
||||
* Comment optimisez vous vos pages pour le print ?
|
||||
* Quelques trucs pour écrire du CSS efficace ?
|
||||
* Utilisez vous des préprocesseurs CSS ? (SASS, Compass, Stylus, LESS)
|
||||
* Si oui, décrivez ce que vous aimez et n'aimez pas des préprocesseurs que vous avez utilisé.
|
||||
* Comment implémenteriez-vous une créa web qui utilise des typos non standard ?
|
||||
* Webfonts (services comme: Google Webfonts, Typekit etc.)
|
||||
* Expliquez comment un browser détermine ce qui matche un sélecteur CSS.
|
||||
|
||||
## Optional fun Questions:
|
||||
|
||||
* What's the coolest thing you've ever coded, what are you most proud of?
|
||||
* Do you know the HTML5 gang sign?
|
||||
* Are you now, or have you ever been, on a boat.
|
||||
* What are your favorite parts about the developer tools you use?
|
||||
* Do you have any pet projects? What kind?
|
||||
* Explain the significance of "cornify".
|
||||
* On a piece of paper, write down the letters A B C D E vertically. Now put these in descending order without writing one line of code.
|
||||
* Wait and see if they turn the paper upside down
|
||||
* Pirate or Ninja?
|
||||
* Bonus if it's a combo and a good reason was given (+2 for zombie monkey pirate ninjas)
|
||||
* If not Web Development, what would you be doing?
|
||||
* Where in the world is Carmen Sandiego?
|
||||
* Hint: their answer is always wrong
|
||||
* What's your favorite feature of Internet Explorer?
|
||||
* Complete this sentence: Brendan Eich and Doug Crockford are the __________ of javascript.
|
||||
* jQuery: a great library or the greatest library? Discuss.
|
||||
|
||||
## Questions optionnelles, pour le geste.
|
||||
|
||||
* Quel est le tuc le plus cool que vous ayez jamais codé, de quoi êtes vous le plus fier ?
|
||||
* Connaissez vous le signe de gang du HTML5 ?
|
||||
* Êtes vous ou avez vous déja été sur un bateau.
|
||||
* Quelles sont vos parties favorites des outils de développement que vous utilisez.
|
||||
* Avez vous des projets chouchous ? Quel genre ?
|
||||
* Expliquez 'cornify'
|
||||
* Sur un bout de papier, écrivez les lettres A B C D E verticalement.
|
||||
Maintenant mettez les en ordre descendant sans écrire une ligne de code.
|
||||
* Regardez si ils retournent le bout de papier.
|
||||
* Pirate ou Ninja.
|
||||
* Bonus si c'est une doublette, et si il y a une bonne raison. (+2 pour des Zombies Singes Ninja Pirates)
|
||||
* Si c'était pas du Dev, vous feriez quoi ?
|
||||
* Ou est Carmen San Diego ?
|
||||
* Indice : La réponse est toujours fausse.
|
||||
* Quelle est votre feature favorite de IE
|
||||
* Complétez cette phrase Brendan Eich et Doug Crockford sont les __________ de javascript.
|
||||
* jQuery : superbe librairie, ou la meilleure ? Discutez.
|
||||
|
|
|
|||
Loading…
Reference in New Issue