Questionnaire technique HTML – CSS – JS – PHP
Transcription
Questionnaire technique HTML – CSS – JS – PHP
Questionnaire technique HTML – CSS – JS – PHP - SQL 2012 HTML Question 1 : Enumérer toutes les balises de titres (<h…>) que vous connaissez. (facile) H1, h2, h3, h4, h5, h6 Question 2 : Parmi les doctype listés, lesquels sont corrects ? (moyen/piège) - < !DOCTYPE HTML> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> Tous. Le premier HTML5 est correct mais pas encore standard. Question 3 : Quelles balises ou attributs puis-je utiliser pour améliorer mon SEO (Search Engine Optimization) ? (moyen) Dans le <head> du document : balises media, title (liste non exhaustive). Dans le <body> du document : les titres <h…>, les attributs rel sur les liens <a>. Liste non exhaustive. Question 4 : Ce code est-il correct ? (facile/piège) … <p> Mon paragraphe. <br/ > <h1>Mon titre</h1> < /p> … Reponse : Non, une balise de titre de doit pas être contenue dans une balise de paragraphe sous peine de provoquer de nombreux bugs d’interprétation par les navigateurs. Question 5 : Quelles sont généralement les valeurs que peut prendre l’attribut « method » de la balise form ? <form action= « url » method= « … »></form> (facile/bonus <- très difficile) POST et GET. Autres en bonus : PUT, DELETE, HEAD, TRACE, CONNECT, OPTIONS. Guillaume Cisco – Tous droits réservés. Reproduction et distribution interdite. Questionnaire technique HTML – CSS – JS – PHP - SQL 2012 Question 6 : Où peut-on placer une balise <script> dans le document html ? (facile) Partout dans le head ou le body. Certaines personnes préconisent de les placer dans le head ou à la fin du document mais c’est une erreur. Le développeur peut placer sa balise absolument ou il veut, a lui de choisir s’il préfère exécuter du code scripté après un certain bloc html ou améliorer les performances de chargement de son site. Les bonnes pratiques seraient de tout mettre dans le head ou tout à la fin du document, mais cela est spécifique a chaque site web, au final, l’implémentation est laissée libre. Question 7 : Ce code est-il correct ? (facile) … <table> <th> <tr> <td> Cell </td> </tr> <th> </table> … Réponse : Non, car il pourra être interprété différemment par les navigateurs. Une balise th devrait se trouver à l’intérieur d’une balise tr et non l’inverse. De plus les balises tbody et thead sont manquantes, mais elles ne sont pas réellement nécessaires. Question 8 : Quelles sont toutes les balises pouvant gérer le listing en html ? ul, ol, li : unordered list, ordered list, list item (facile) dl, dt, dd : definition list, definition term, definition description (difficile) Question 9 : A quoi sert la balise br ? (facile) Elle sert uniquement à forcer un retour à la ligne entre deux blocs de textes, en aucun cas elle ne doit être utilisée pour réaliser un espacement vertical ‘affichage. Question 10 : Quel organisme définit les standards et règles de bonnes pratiques du langage HTML ? (facile) Le W3C: World Web Consortium. Guillaume Cisco – Tous droits réservés. Reproduction et distribution interdite. Questionnaire technique HTML – CSS – JS – PHP - SQL 2012 CSS Question 1 : Qu’est-ce que la notion de sprite CSS ? (facile) Une image contenant plusieurs images. Permettant de ne faire charger qu’une seule image a l’utilisateur et ainsi réduire le nombre de requêtes vers le serveur. L’affichage de chaque image contenue dans le sprite est réalisé en css à l’aide de la propriété background-position. Question 2 : Combien de background (arrière-plan) peut-on attribuer à une balise ? (moyen/bonus) Un seul. CSS3 qui n’est pas encore standard le permettra. Question 3 : Quelle est la différence entre display:none et visibility:hidden ? (moyen) Les deux cachent l’élément sur lequel elles s’appliquent mais visibility :hidden permet de conserver la taille que prenait l’élément dans la page. Question 4 : Comment s’utilise position:absolute ? (moyen) position:absolute permet de positionner un élément en rapport avec son premier parent non-static (poisition par defaut.) Question 5 : Y a-t’il des priorités sur les sélecteurs css ? Si oui lesquels ? (facile/bonus<moyen) Id, class, élément. Bonus : !important l’emporte sur tous , suivi des styles inline puis des selecteurs css. Question 6 : Je possède ces bouts de code html et css, de quelle couleur sera mon paragraphe ? (moyen) Html: <p id= « id1 » class= « class1 »>paragraphe</p> Css: p { color: red; } #id1 { color: blue; } .class1 { color: green; } p { color: grey; } #id1 { color: yellow; } Réponse : jaune, le sélecteur sur l’identifiant l’emporte et la surcharge aussi. Guillaume Cisco – Tous droits réservés. Reproduction et distribution interdite. Questionnaire technique HTML – CSS – JS – PHP - SQL 2012 Question 7 : l’élément span est-il par défaut inline ou block ? (facile) Inline. Question 8 : Quelles propriétés puis-je utiliser pour positionner à gauche ou à droite mes éléments ? Eliminer ces positionnements ? (moyen) - La propriété float, aux valeurs left ou right. Margin et padding (particulier). Pour les textes et/ou images text-align (left, right, center) En position absolute : left et right. - La propriété clear aux valeurs left, right ou both en ce qui concerne les float. Question 9 : En css3, comment obtenir des coins arrondis ? Comment faire pour les navigateurs ne prenant pas en compte css3 ? (moyen) - En utilisant la propriété border-radius. En utilisant des images. Question 10 : Que fait la propriété display:inline-block sur un élément ? (difficile) L’élément se comporte lui-même comme un bloc mais est positionné de façon inline par rapport aux autres éléments l’entourant. Il est ainsi possible de mieux le positionner. Question 11 : Citez des frameworks css que vous connaissez. (moyen) Suzy, blueprintcss, compass (sass), less, bootstrap de twitter. Guillaume Cisco – Tous droits réservés. Reproduction et distribution interdite. Questionnaire technique HTML – CSS – JS – PHP - SQL 2012 Javascript Question 1 : Comment définit-on une variable en javascript (locale et globale) ? (moyen) Local : var ma_variable ; Globale : ma_variable ; Question 2 : Javascript est-il un langage oriente objet ? De quel type ? (moyen) Oui, Prototype. Question 3 : Peut-on avoir des classes en javascript ? Des namespaces ? (difficile) Oui mais c’est particulier du au langage de type prototype du javascript. Cela se passe par des fonctions et leur attribut prototype. Oui en utilisant les objets et/ou les fonctions. Question 4 : Qu’est-ce que JSON ? Est-il natif dans tous les navigateurs ? (moyen/difficile) Javascript Object notation : la notation objet de javascript. Non, il est présent à partir de certaines versions des navigateurs. Exemple : pas disponible sous firefox 3.0 mais à partir de 3.1. Question 5 : A quoi sert AJAX ? JSONP ? (facile/difficile) Ajax pour asynchronous javascript and xml, permet de faire des requêtes au serveur et ainsi récupérer des données sans avoir à recharger la page. Ces données peuvent être de type html, xml ou même json. JSONP pour json padding est une solution de hack permettant de faire de l’ajax en cross site forgery (domaines différents). Question 6 : De quel type sont les nombres en javascript ? (moyen) Type number, ce sont tous des nombres flottants au final. Question 7 : Comment obtient-on un élément à partir de son id ? (facile) document.getElementById. Guillaume Cisco – Tous droits réservés. Reproduction et distribution interdite. Questionnaire technique HTML – CSS – JS – PHP - SQL 2012 Question 8 : A l’aide de quelles fonctions puis-je débugger mon code ? (facile/moyen) Alert déconseillé. Console <- .log() , .warn(), .info(), .trace(), .count() etc… Question 9 : Pourquoi est-il dangereux d’utiliser for… in en javascript ? (HARDCORE) For … in n’itère pas sur l’ordre des attributs d’un objet, de plus for in itère sur tous les éléments d’un objet ce qui signifie aussi les méthodes. Exemple : >>> var o = [0, 1, 2, 3, 4]; >>> for (i in o){ ... console.log(i); ... } 0 1 2 3 4 Undefined >>> o.test = function (){console.log('test');} function (){console.log('test');} >>> for (i in o){ ... console.log(i); ... } 0 1 2 3 4 test undefined Question 10 : Citez des frameworks javascript. Jquery, Dojo, Mootools, RaphaelJS, ExtJs, Prototype, YUI, Processing etc… Question 11 : Pouvez-vous expliquer les fermetures (closures) en javascript ? (très difficile) Ce sont des fonctions présentes à l’intérieur d’autres fonctions possédant leurs contextes propres. Question 12 : Que donne +[] ? (HARDCORE) L’operateur + essaie de transformer en entier ce qui le suit, ici un tableau vide ce qui est équivalent a une chaine vide : +"", ce qui donne 0 ; Guillaume Cisco – Tous droits réservés. Reproduction et distribution interdite. Questionnaire technique HTML – CSS – JS – PHP - SQL 2012 JQuery Question 1 : Quel caractère est utilisé pour définir le namespace de Jquery i.e. sélectionner un élément du DOM. (facile) $ Question 2 : Quelle fonction doit-on utiliser pour modifier le style d’un élément ? (facile) $.css() Question 3 : Quelle fonction permet de récupérer la hauteur d’un élément en incluant ses margin top et bottom ? (moyen/difficile) $.outerHeight() ; Question 4 : Quelles fonctions permettent de faire de l’animation en JQuery ? (moyen) Show, hide, toggle, animate etc… Question 5 : Comment savoir si un objet JQuery existe ? (moyen) $(selector).length !== 0 Question 6 : A quoi sert la méthode stop ? Quels paramètres prend-elle ? (difficile) Description: Stop la/les animations courantes sur l/les’élément(s) au(x)quel elle s’applique. .stop( [clearQueue] [, jumpToEnd] ) .stop( [queue] [, clearQueue] [, jumpToEnd] ) queueThe name of the queue in which to stop animations. clearQueueA Boolean indicating whether to remove queued animation as well. Defaults to false. jumpToEndA Boolean indicating whether to complete the current animation immediately. Defaults to false. Guillaume Cisco – Tous droits réservés. Reproduction et distribution interdite. Questionnaire technique HTML – CSS – JS – PHP - SQL 2012 PHP Question 1 : Comment définit-on une variable en PHP ? (facile) A l’aide du caractère $. Question 2 : Quel test effectue === et !== ? (moyen) Une comparaison sur la valeur et le type des éléments comparés. Question 3 : PHP est-il un langage oriente objet ? (facile) Oui depuis PHP 5. Question 4 : Comment concatène-t-on des chaines de caractères en php si celles-ci sont entourées de simple quote ? (facile) A l’aide du caractère point . Question 5 : Citez des magic methods en php. (moyen) __construct(), __destruct(), __call(), __callStatic(), __get(), __set(), __isset(), __unset(), __sleep(), __wakeup(), __toString(), __invoke(), __set_state() and __clone() Guillaume Cisco – Tous droits réservés. Reproduction et distribution interdite. Questionnaire technique HTML – CSS – JS – PHP - SQL 2012 Question 6 : Ce code peut-il afficher « Jour » ? (facile) <?php if ($texte != "Menu") { echo "Nuit"; } elseif ($texte == "Menu") { echo "Soir"; } else { echo "Jour"; } ?> Non. Question 7 : Quels sont les types primitifs en PHP ? (difficile) Quatre types scalaires: boolean integer float (floating-point number, aka double) string Deux types composes : array object Et deux types spéciaux: resource NULL Question 8 : Quelle fonction permet d'afficher rapidement tout le contenu d'un array ? (facile) - array_key_exists print_r in_array print_r. Guillaume Cisco – Tous droits réservés. Reproduction et distribution interdite. Questionnaire technique HTML – CSS – JS – PHP - SQL 2012 Question 9 : Citez des variables super globales en PHP. (moyen) $GLOBALS $_SERVER $_GET $_POST $_FILES $_COOKIE $_SESSION $_REQUEST $_ENV Question 10 : Citez des framework php. (facile) Symphony, Zend, CakePHP etc… Guillaume Cisco – Tous droits réservés. Reproduction et distribution interdite. Questionnaire technique HTML – CSS – JS – PHP - SQL 2012 SQL Question 1 : En MySQL, quel est le mot clef pour faire une requête de sélection en s’assurant que l’élément existe ? (moyen/piège) - EXIST EXISTS PRESENT PRESENTS EXISTS Question 2 : Que signifie CRUD ? (moyen/culture) Create, Read, Update, Delete Question 3 : Parmi les mots clefs suivant lesquels désignent des jointures ? (facile) - JOIN INTER JOIN OUTER JOIN WRITE JOIN LEFT JOIN JOIN, OUTER JOIN, LEFT JOIN. Les autres devraient être écrits : INNER JOIN et RIGHT JOIN. Question 4 : Puis-je exécuter des sous-requêtes dans une requête ? (facile) Oui. Question 5 : Puis-je faire une jointure d’une table avec elle-même ? (moyen) Oui. Question 6 : Citez des types de langages de bases de données. (facile) MySQL, PostgreSQL, Oracle, SQL Server etc… Guillaume Cisco – Tous droits réservés. Reproduction et distribution interdite.