contents: use TOCInline component

contents/css-questions.md

@@ -5,60 +5,9 @@ sidebar_label: CSS questions
 
 Answers to [Front-end Job Interview Questions - CSS Questions](https://github.com/h5bp/Front-end-Developer-Interview-Questions/blob/master/src/questions/css-questions.md). Pull requests for suggestions and corrections are welcome!
 
-## Table of contents
+import TOCInline from '@theme/TOCInline';
 
-- [Table of contents](#table-of-contents)
-  - [What is CSS selector specificity and how does it work?](#what-is-css-selector-specificity-and-how-does-it-work)
-        - [References](#references)
-  - [What's the difference between "resetting" and "normalizing" CSS? Which would you choose, and why?](#whats-the-difference-between-resetting-and-normalizing-css-which-would-you-choose-and-why)
-        - [References](#references-1)
-  - [Describe `float`s and how they work.](#describe-floats-and-how-they-work)
-        - [References](#references-2)
-  - [Describe `z-index` and how stacking context is formed.](#describe-z-index-and-how-stacking-context-is-formed)
-        - [References](#references-3)
-  - [Describe Block Formatting Context (BFC) and how it works.](#describe-block-formatting-context-bfc-and-how-it-works)
-        - [References](#references-4)
-  - [What are the various clearing techniques and which is appropriate for what context?](#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.](#explain-css-sprites-and-how-you-would-implement-them-on-a-page-or-site)
-        - [References](#references-5)
-  - [How would you approach fixing browser-specific styling issues?](#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?](#how-do-you-serve-your-pages-for-feature-constrained-browsers-what-techniquesprocesses-do-you-use)
-  - [What are the different ways to visually hide content (and make it available only for screen readers)?](#what-are-the-different-ways-to-visually-hide-content-and-make-it-available-only-for-screen-readers)
-        - [References](#references-6)
-  - [Have you ever used a grid system, and if so, what do you prefer?](#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?](#have-you-used-or-implemented-media-queries-or-mobile-specific-layoutscss)
-  - [Are you familiar with styling SVG?](#are-you-familiar-with-styling-svg)
-        - [References](#references-7)
-  - [Can you give an example of an @media property other than screen?](#can-you-give-an-example-of-an-media-property-other-than-screen)
-        - [References](#references-8)
-  - [What are some of the "gotchas" for writing efficient CSS?](#what-are-some-of-the-gotchas-for-writing-efficient-css)
-        - [References](#references-9)
-  - [What are the advantages/disadvantages of using CSS preprocessors?](#what-are-the-advantagesdisadvantages-of-using-css-preprocessors)
-  - [Describe what you like and dislike about the CSS preprocessors you have used.](#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?](#how-would-you-implement-a-web-design-comp-that-uses-non-standard-fonts)
-  - [Explain how a browser determines what elements match a CSS selector.](#explain-how-a-browser-determines-what-elements-match-a-css-selector)
-        - [References](#references-10)
-  - [Describe pseudo-elements and discuss what they are used for.](#describe-pseudo-elements-and-discuss-what-they-are-used-for)
-        - [References](#references-11)
-  - [Explain your understanding of the box model and how you would tell the browser in CSS to render your layout in different box models.](#explain-your-understanding-of-the-box-model-and-how-you-would-tell-the-browser-in-css-to-render-your-layout-in-different-box-models)
-        - [References](#references-12)
-  - [What does `* { box-sizing: border-box; }` do? What are its advantages?](#what-does---box-sizing-border-box--do-what-are-its-advantages)
-        - [References](#references-13)
-  - [What is the CSS `display` property and can you give a few examples of its use?](#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`?](#whats-the-difference-between-inline-and-inline-block)
-  - [What's the difference between a `relative`, `fixed`, `absolute` and `static`ally positioned element?](#whats-the-difference-between-a-relative-fixed-absolute-and-statically-positioned-element)
-        - [References](#references-14)
-  - [What existing CSS frameworks have you used locally, or in production? How would you change/improve them?](#what-existing-css-frameworks-have-you-used-locally-or-in-production-how-would-you-changeimprove-them)
-  - [Have you played around with the new CSS Flexbox or Grid specs?](#have-you-played-around-with-the-new-css-flexbox-or-grid-specs)
-        - [References](#references-15)
-  - [Can you explain the difference between coding a website to be responsive versus using a mobile-first strategy?](#can-you-explain-the-difference-between-coding-a-website-to-be-responsive-versus-using-a-mobile-first-strategy)
-  - [How is responsive design different from adaptive design?](#how-is-responsive-design-different-from-adaptive-design)
-        - [References](#references-16)
-  - [Have you ever worked with retina graphics? If so, when and what techniques did you use?](#have-you-ever-worked-with-retina-graphics-if-so-when-and-what-techniques-did-you-use)
-        - [References](#references-17)
-  - [Is there any reason you'd want to use `translate()` instead of `absolute` positioning, or vice-versa? And why?](#is-there-any-reason-youd-want-to-use-translate-instead-of-absolute-positioning-or-vice-versa-and-why)
-        - [References](#references-18)
-  - [Other Answers](#other-answers)
+<TOCInline toc={toc} />
 
 ### What is CSS selector specificity and how does it work?
 

contents/html-questions.md

@@ -5,31 +5,9 @@ sidebar_label: HTML questions
 
 Answers to [Front-end Job Interview Questions - HTML Questions](https://github.com/h5bp/Front-end-Developer-Interview-Questions/blob/master/src/questions/html-questions.md). Pull requests for suggestions and corrections are welcome!
 
-## Table of contents
+import TOCInline from '@theme/TOCInline';
 
-- [Table of contents](#table-of-contents)
-  - [What does a DOCTYPE do?](#what-does-a-doctype-do)
-        - [References](#references)
-  - [How do you serve a page with content in multiple languages?](#how-do-you-serve-a-page-with-content-in-multiple-languages)
-        - [References](#references-1)
-  - [What kind of things must you be wary of when designing or developing for multilingual sites?](#what-kind-of-things-must-you-be-wary-of-when-designing-or-developing-for-multilingual-sites)
-        - [References](#references-2)
-  - [What are `data-` attributes good for?](#what-are-data--attributes-good-for)
-        - [References](#references-3)
-  - [Consider HTML5 as an open web platform. What are the building blocks of HTML5?](#consider-html5-as-an-open-web-platform-what-are-the-building-blocks-of-html5)
-        - [References](#references-4)
-  - [Describe the difference between a `cookie`, `sessionStorage` and `localStorage`.](#describe-the-difference-between-a-cookie-sessionstorage-and-localstorage)
-        - [References](#references-5)
-  - [Describe the difference between `<script>`, `<script async>` and `<script defer>`.](#describe-the-difference-between-script-script-async-and-script-defer)
-        - [References](#references-6)
-  - [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?](#why-is-it-generally-a-good-idea-to-position-css-links-between-headhead-and-js-scripts-just-before-body-do-you-know-any-exceptions)
-        - [References](#references-7)
-  - [What is progressive rendering?](#what-is-progressive-rendering)
-        - [References](#references-8)
-  - [Why you would use a `srcset` attribute in an image tag? Explain the process the browser uses when evaluating the content of this attribute.](#why-you-would-use-a-srcset-attribute-in-an-image-tag-explain-the-process-the-browser-uses-when-evaluating-the-content-of-this-attribute)
-        - [References](#references-9)
-  - [Have you used different HTML templating languages before?](#have-you-used-different-html-templating-languages-before)
-  - [Other Answers](#other-answers)
+<TOCInline toc={toc} />
 
 ### What does a DOCTYPE do?
 

contents/javascript-questions.md

@@ -5,115 +5,9 @@ sidebar_label: JavaScript questions
 
 Answers to [Front-end Job Interview Questions - JS Questions](https://github.com/h5bp/Front-end-Developer-Interview-Questions/blob/master/src/questions/javascript-questions.md). Pull requests for suggestions and corrections are welcome!
 
-## Table of contents
+import TOCInline from '@theme/TOCInline';
 
-- [Table of contents](#table-of-contents)
-  - [Explain event delegation](#explain-event-delegation)
-        - [References](#references)
-  - [Explain how `this` works in JavaScript](#explain-how-this-works-in-javascript)
-    - [Can you give an example of one of the ways that working with this has changed in ES6?](#can-you-give-an-example-of-one-of-the-ways-that-working-with-this-has-changed-in-es6)
-        - [References](#references-1)
-  - [Explain how prototypal inheritance works](#explain-how-prototypal-inheritance-works)
-    - [Example of Prototypal Inheritance](#example-of-prototypal-inheritance)
-        - [References](#references-2)
-  - [What do you think of AMD vs CommonJS?](#what-do-you-think-of-amd-vs-commonjs)
-        - [References](#references-3)
-  - [Explain why the following doesn't work as an IIFE: `function foo(){ }();`. What needs to be changed to properly make it an IIFE?](#explain-why-the-following-doesnt-work-as-an-iife-function-foo--what-needs-to-be-changed-to-properly-make-it-an-iife)
-        - [References](#references-4)
-  - [What's the difference between a variable that is: `null`, `undefined` or undeclared? How would you go about checking for any of these states?](#whats-the-difference-between-a-variable-that-is-null-undefined-or-undeclared-how-would-you-go-about-checking-for-any-of-these-states)
-        - [References](#references-5)
-  - [What is a closure, and how/why would you use one?](#what-is-a-closure-and-howwhy-would-you-use-one)
-        - [References](#references-6)
-  - [Can you describe the main difference between a `.forEach` loop and a `.map()` loop and why you would pick one versus the other?](#can-you-describe-the-main-difference-between-a-foreach-loop-and-a-map-loop-and-why-you-would-pick-one-versus-the-other)
-        - [References](#references-7)
-  - [What's a typical use case for anonymous functions?](#whats-a-typical-use-case-for-anonymous-functions)
-        - [References](#references-8)
-  - [How do you organize your code? (module pattern, classical inheritance?)](#how-do-you-organize-your-code-module-pattern-classical-inheritance)
-  - [What's the difference between host objects and native objects?](#whats-the-difference-between-host-objects-and-native-objects)
-        - [References](#references-9)
-  - [Difference between: `function Person(){}`, `var person = Person()`, and `var person = new Person()`?](#difference-between-function-person-var-person--person-and-var-person--new-person)
-        - [References](#references-10)
-  - [What's the difference between `.call` and `.apply`?](#whats-the-difference-between-call-and-apply)
-  - [Explain `Function.prototype.bind`.](#explain-functionprototypebind)
-        - [References](#references-11)
-  - [When would you use `document.write()`?](#when-would-you-use-documentwrite)
-        - [References](#references-12)
-  - [What's the difference between feature detection, feature inference, and using the UA string?](#whats-the-difference-between-feature-detection-feature-inference-and-using-the-ua-string)
-        - [References](#references-13)
-  - [Explain Ajax in as much detail as possible.](#explain-ajax-in-as-much-detail-as-possible)
-        - [References](#references-14)
-  - [What are the advantages and disadvantages of using Ajax?](#what-are-the-advantages-and-disadvantages-of-using-ajax)
-  - [Explain how JSONP works (and how it's not really Ajax).](#explain-how-jsonp-works-and-how-its-not-really-ajax)
-        - [References](#references-15)
-  - [Have you ever used JavaScript templating? If so, what libraries have you used?](#have-you-ever-used-javascript-templating-if-so-what-libraries-have-you-used)
-  - [Explain "hoisting".](#explain-hoisting)
-        - [References](#references-16)
-  - [Describe event bubbling.](#describe-event-bubbling)
-  - [What's the difference between an "attribute" and a "property"?](#whats-the-difference-between-an-attribute-and-a-property)
-        - [References](#references-17)
-  - [Why is extending built-in JavaScript objects not a good idea?](#why-is-extending-built-in-javascript-objects-not-a-good-idea)
-        - [References](#references-18)
-  - [Difference between document `load` event and document `DOMContentLoaded` event?](#difference-between-document-load-event-and-document-domcontentloaded-event)
-        - [References](#references-19)
-  - [What is the difference between `==` and `===`?](#what-is-the-difference-between--and-)
-        - [References](#references-20)
-  - [Explain the same-origin policy with regards to JavaScript.](#explain-the-same-origin-policy-with-regards-to-javascript)
-        - [References](#references-21)
-  - [Make this work:](#make-this-work)
-  - [Why is it called a Ternary expression, what does the word "Ternary" indicate?](#why-is-it-called-a-ternary-expression-what-does-the-word-ternary-indicate)
-        - [References](#references-22)
-  - [What is `"use strict";`? What are the advantages and disadvantages to using it?](#what-is-use-strict-what-are-the-advantages-and-disadvantages-to-using-it)
-        - [References](#references-23)
-  - [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`.](#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)
-        - [References](#references-24)
-  - [Why is it, in general, a good idea to leave the global scope of a website as-is and never touch it?](#why-is-it-in-general-a-good-idea-to-leave-the-global-scope-of-a-website-as-is-and-never-touch-it)
-  - [Why would you use something like the `load` event? Does this event have disadvantages? Do you know any alternatives, and why would you use those?](#why-would-you-use-something-like-the-load-event-does-this-event-have-disadvantages-do-you-know-any-alternatives-and-why-would-you-use-those)
-        - [References](#references-25)
-  - [Explain what a single page app is and how to make one SEO-friendly.](#explain-what-a-single-page-app-is-and-how-to-make-one-seo-friendly)
-        - [References](#references-26)
-  - [What is the extent of your experience with Promises and/or their polyfills?](#what-is-the-extent-of-your-experience-with-promises-andor-their-polyfills)
-        - [References](#references-27)
-  - [What are the pros and cons of using Promises instead of callbacks?](#what-are-the-pros-and-cons-of-using-promises-instead-of-callbacks)
-        - [References](#references-28)
-  - [What are some of the advantages/disadvantages of writing JavaScript code in a language that compiles to JavaScript?](#what-are-some-of-the-advantagesdisadvantages-of-writing-javascript-code-in-a-language-that-compiles-to-javascript)
-        - [References](#references-29)
-  - [What tools and techniques do you use for debugging JavaScript code?](#what-tools-and-techniques-do-you-use-for-debugging-javascript-code)
-        - [References](#references-30)
-  - [What language constructions do you use for iterating over object properties and array items?](#what-language-constructions-do-you-use-for-iterating-over-object-properties-and-array-items)
-        - [References](#references-31)
-  - [Explain the difference between mutable and immutable objects.](#explain-the-difference-between-mutable-and-immutable-objects)
-    - [What is an example of an immutable object in JavaScript?](#what-is-an-example-of-an-immutable-object-in-javascript)
-    - [What are the pros and cons of immutability?](#what-are-the-pros-and-cons-of-immutability)
-        - [References](#references-32)
-    - [How can you achieve immutability in your own code?](#how-can-you-achieve-immutability-in-your-own-code)
-        - [References](#references-33)
-  - [Explain the difference between synchronous and asynchronous functions.](#explain-the-difference-between-synchronous-and-asynchronous-functions)
-  - [What is event loop? What is the difference between call stack and task queue?](#what-is-event-loop-what-is-the-difference-between-call-stack-and-task-queue)
-        - [References](#references-34)
-  - [Explain the differences on the usage of `foo` between `function foo() {}` and `var foo = function() {}`](#explain-the-differences-on-the-usage-of-foo-between-function-foo--and-var-foo--function-)
-        - [References](#references-35)
-  - [What are the differences between variables created using `let`, `var` or `const`?](#what-are-the-differences-between-variables-created-using-let-var-or-const)
-        - [References](#references-36)
-  - [What are the differences between ES6 class and ES5 function constructors?](#what-are-the-differences-between-es6-class-and-es5-function-constructors)
-        - [References](#references-37)
-  - [Can you offer a use case for the new arrow => function syntax? How does this new syntax differ from other functions?](#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-advantage-is-there-for-using-the-arrow-syntax-for-a-method-in-a-constructor)
-        - [References](#references-38)
-  - [What is the definition of a higher-order function?](#what-is-the-definition-of-a-higher-order-function)
-        - [References](#references-39)
-  - [Can you give an example for destructuring an object or an array?](#can-you-give-an-example-for-destructuring-an-object-or-an-array)
-        - [References](#references-40)
-  - [ES6 Template Literals offer a lot of flexibility in generating strings, can you give an example?](#es6-template-literals-offer-a-lot-of-flexibility-in-generating-strings-can-you-give-an-example)
-        - [References](#references-41)
-  - [Can you give an example of a curry function and why this syntax offers an advantage?](#can-you-give-an-example-of-a-curry-function-and-why-this-syntax-offers-an-advantage)
-        - [References](#references-42)
-  - [What are the benefits of using spread syntax and how is it different from rest syntax?](#what-are-the-benefits-of-using-spread-syntax-and-how-is-it-different-from-rest-syntax)
-        - [References](#references-43)
-  - [How can you share code between files?](#how-can-you-share-code-between-files)
-        - [References](#references-44)
-  - [Why you might want to create static class members?](#why-you-might-want-to-create-static-class-members)
-        - [References](#references-45)
-  - [Other Answers](#other-answers)
+<TOCInline toc={toc} />
 
 ### Explain event delegation
 

website/i18n/de/docusaurus-plugin-content-docs/current/html-questions.md

@@ -4,19 +4,9 @@ title: Fragen zu HTML
 
 Antworten auf [Front-end Job Interview Questions - HTML Questions](https://github.com/h5bp/Front-end-Developer-Interview-Questions/blob/master/src/questions/html-questions.md). Pull requests for suggestions and corrections are welcome!
 
-## Inhaltsverzeichnis
+import TOCInline from '@theme/TOCInline';
 
-- [Was tut ein `doctype` und wie viele von ihnen kannst du benennen?](#was-tut-ein-doctype)
-- [Wie lieferst du eine Seite mit Inhalten in verschiedenen Sprachen aus?](#wie-lieferst-du-eine-seite-mit-inhalten-in-verschiedenen-sprachen-aus)
-- [Vor welchen Dingen solltest du dich hüten, wenn du mehrsprachige Websites designst oder entwickelst?](#vor-welchen-dingen-solltest-du-dich-hüten-wenn-du-mehrsprachige-websites-designst-oder-entwickelst)
-- [Wofür sind `data--Attribute` nützlich?](#wofür-sind-data--attribute-nützlich)
-- [Stelle dir HTML5 als eine offene Internetplattform vor. Was sind die Basiskomponenten von HTML5?](#stelle-dir-html5-als-eine-offene-internetplattform-vor-was-sind-die-basiskomponenten-von-html5)
-- [Beschreibe die Unterschiede zwischen `Cookies`, `sessionStorage` und `localStorage`.](#beschreibe-die-unterschiede-zwischen-cookies-sessionstorage-und-localstorage)
-- [Beschreibe die Unterschiedie zwischen `<script>`, `<script async>` und `<script defer>`.](#beschreibe-die-unterschiede-zwischen-script-script-async-und-script-defer)
-- [Warum ist es eine gute Idee, die `<link>`s zum CSS-Stylesheet inneralb der `<head></head>` Tags zu platzieren und die JS `<script>`s direkt vorm `</body>` einzubinden? Würdest du Ausnahmen machen?](#warum-ist-es-eine-gute-idee-die-links-zum-css-stylesheet-inneralb-der-head-head-tags-zu-platzieren-und-die-js-scripts-direkt-vorm-body-einzubinden-würdest-du-ausnwahmen-machen)
-- [Was ist progressives Rendern?](#was-ist-progressives-rendern)
-- [Warum würdest du ein `srcset` Attribut in ein image tag setzen? Erkläre wie der Browser den Inhalt dieses Attributs auswertet.](#warum-würdest-du-ein-srcset-attribute-in-ein-image-tag-einsetzen-erkläre-wie-der-browser-bei-der-auswertung-des-inhalts-dieses-attributs-vorgeht)
-- [Hast du Erfahrungen mit unterschiedlichen HTML templating languages gemacht?](#hast-du-erfahrungen-mit-unterschiedlichen-html-templating-languages-gemacht)
+<TOCInline toc={toc} />
 
 ### Was tut ein doctype?
 

website/i18n/es/docusaurus-plugin-content-docs/current/html-questions.md

@@ -4,19 +4,9 @@ title: Preguntas de HTML
 
 Respuestas a [Preguntas de trabajo para entrevistas Front-end - Preguntas de HTML](https://github.com/h5bp/Front-end-Developer-Interview-Questions/blob/master/src/questions/html-questions.md). Solicitudes de inserción para sugerencias y correcciones son bienvenidas!
 
-## Tabla de Contenidos
+import TOCInline from '@theme/TOCInline';
 
-- [¿Qué hace un doctype?](#qué-hace-un-doctype)
-- [¿Cómo desplegar una página con contenido en varios idiomas?](#cómo-desplegar-una-página-con-contenido-en-varios-idiomas)
-- [¿Qué debes tener en cuenta al diseñar o desarrollar sitios en múltiples lenguajes?](#qué-debes-tener-en-cuenta-al-diseñar-o-desarrollar-sitios-en-múltiples-lenguajes)
-- [¿Para qué sirve el atributo `data-`?](#para-qué-sirve-el-atributo-data-)
-- [¿Consideras HTML5 como una plataforma web abierta. Cuáles son los componentes básicos de HTML5?](#consideras-html5-como-una-plataforma-web-abierta-cuáles-son-los-componentes-básicos-de-html5)
-- [Describe las diferenias entre `cookie`, `sessionStorage` y `localStorage`.](#describe-las-diferenias-entre-cookie-sessionstorage-y-localstorage)
-- [Describe las diferencias entre `<script>`, `<script async>` y `<script defer>`.](#describe-las-diferencias-entre-script-script-async-y-script-defer)
-- [¿Por qué generalmente es buena idea colocar los `<link>` de CSS entre `<head></head>` y `<script>` de JS justo antes del `</body>`? ¿Conoces alguna excepción?](#por-qué-generalmente-es-buena-idea-colocar-los-link-de-css-entre-headhead-y-script-de-js-justo-antes-del-body-conoces-alguna-excepción)
-- [¿Qué es el renderizado progresivo?](#qué-es-el-renderizado-progresivo)
-- [¿Por qué usaría el atributo `srcset` en una etiqueta de imagen? Explica el proceso que usa el navegador al evaluar el contenido de este atributo.](#por-qué-usaría-el-atributo-srcset-en-una-etiqueta-de-imagen-explica-el-proceso-que-usa-el-navegador-al-evaluar-el-contenido-de-este-atributo)
-- [¿Has utilizado otros lenguajes de plantillas HTML anteriormente?](#has-utilizado-otros-lenguajes-de-plantillas-html-anteriormente)
+<TOCInline toc={toc} />
 
 ### ¿Qué hace un doctype?
 

website/i18n/es/docusaurus-plugin-content-docs/current/javascript-questions.md

@@ -2,14 +2,9 @@
 title: Preguntas de JavaScript
 ---
 
-## Tabla de contenidos
+import TOCInline from '@theme/TOCInline';
 
-- [Explique la delegación de eventos](#explique-la-delegación-de-eventos)
-- [Explique como funciona this](#explique-como-funciona-this)
-- [Explique como funciona la herencia de prototipos](#explique-como-funciona-la-herencia-de-prototipos)
-- [Ejemplo de herencia de prototipos](#ejemplo-de-herencia-de-prototipos)
-- [Explique la diferencia cuando una variable es: `null`, `undefined` o `undeclared`. Como chequearia cada uno de estos estados?](#explique-la-diferencia-cuando-una-variable-es-null-undefined-o-undeclared-como-chequearia-cada-uno-de-estos-estados) - [Referencias](#referencias-1)
-- [Que es una closure, y como/porque se utilizaria?](#que-es-una-closure-y-comoporque-se-utilizaria) - [Referencias](#referencias-2)
+<TOCInline toc={toc} />
 
 ### Explique la delegación de eventos
 

website/i18n/jp/docusaurus-plugin-content-docs/current/css-questions.md

@@ -4,39 +4,9 @@ title: CSS に関する質問
 
 [Front-end Job Interview Questions - CSS Questions](https://github.com/h5bp/Front-end-Developer-Interview-Questions/blob/master/src/questions/css-questions.md) の回答集です。提案や訂正のプルリクエストは大歓迎です！
 
-## 目次
+import TOCInline from '@theme/TOCInline';
 
-- [CSS セレクターの詳細度とは何ですか？どのようにはたらきますか？](#css-セレクターの詳細度とは何ですかそれはどのようにはたらきますか)
-- ["リセット" と "ノーマライズ" CSS の違いは何ですか？あなたはどちらを使いますか？そしてそれはなぜですか？](#リセット-と-ノーマライズ-css-の違いは何ですかあなたはどちらを使いますかそしてそれはなぜですか)
-- [`float` とは何ですか？どのようにはたらきますか？](#float-とは何ですかどのようにはたらきますか)
-- [`z-index` とは何かと、スタックコンテキスト(スタック文脈)がどのように作られるのかを教えてください。](#z-index-とは何かとスタックコンテキストスタック文脈がどのように作られるのかを教えてください)
-- [ブロック整形文脈（Block Formatting Context: BFC）とその仕組みを教えてください。](#ブロック整形文脈block-formatting-context-bfcとその仕組みを教えてください)
-- [clear を行う手法にはどのようなものがあり、それぞれどのような状況に適していますか？](#clear-を行う手法にはどのようなものがありそれぞれどのような状況に適していますか)
-- [CSS スプライトとは何ですか？ページやサイトに実装する方法も合わせて説明してください。](#css-スプライトとは何ですかページやサイトに実装する方法も合わせて説明してください)
-- [ブラウザ固有のスタイリングに関する問題を解決するにはどうすればいいですか？](#ブラウザ固有のスタイリングに関する問題を解決するにはどうすればいいですか)
-- [機能の少ないブラウザに対しては、どのようにページを提供しますか？どのようなテクニック/プロセスを使用しますか？](#機能の少ないブラウザに対してはどのようにページを提供しますかどのようなテクニックプロセスを使用しますか)
-- [コンテンツを視覚的に隠す（スクリーンリーダーのみ利用可能にする）方法にはどのようなものがありますか？いくつか教えてください。](#コンテンツを視覚的に隠すスクリーンリーダーのみ利用可能にする方法にはどのようなものがありますかいくつか教えてください)
-- [グリッドシステムを使用したことがありますか？使ったことがあるなら、あなたはどのグリッドシステムが好きですか？](#グリッドシステムを使用したことがありますか使ったことがあるならあなたはどのグリッドシステムが好きですか)
-- [メディアクエリやモバイル固有のレイアウト/CSS を使用したり実装したことはありますか？](#メディアクエリやモバイル固有のレイアウトcss-を使用したり実装したことはありますか)
-- [SVG のスタイリングについては詳しいですか？](#svg-のスタイリングについては詳しいですか)
-- [`screen` 以外の `@media` プロパティの例を挙げられますか？](#screen-以外の-media-プロパティの例を挙げられますか)
-- [効率的な CSS を書くにために避けるべき "落とし穴" にはどんなものがありますか？](#効率的な-css-を書くにために避けるべき-落とし穴-にはどんなものがありますか)
-- [CSS プリプロセッサを使用するメリットとデメリットを教えてください。](#css-プリプロセッサを使用するメリットとデメリットには何がありますか)
-- [使用したことのある CSS プリプロセッサについて好きなものと嫌いなものを教えてください。](#使用したことのある-css-プリプロセッサについて好きなものと嫌いなものを教えてください)
-- [非標準フォントを使用する Web サイトを実装するにはどのようにしますか？](#非標準フォントを使用する-web-サイトを実装するにはどのようにしますか)
-- [CSS セレクタにマッチする要素がどれなのか、ブラウザがどのように決定しているかを説明してください。](#css-セレクタにマッチする要素がどれなのかブラウザがどのように決定しているかを説明してください)
-- [疑似要素について説明し、それらがなんのために使われているかを詳しく話してください。](#疑似要素について説明しそれらがなんのために使われているかを詳しく話してください)
-- [ボックスモデルがなんであるかのあなたの理解と、ボックスモデルでレイアウトをレンダリングするために CSS でブラウザに指示する複数の方法を説明してください。](#ボックスモデルがなんであるかのあなたの理解と異なるボックスモデルでレイアウトをレンダリングするために-css-でブラウザに指示する方法を説明してください)
-- [`* { box-sizing: border-box; }` によって何が起きますか？その利点は何ですか？](#--box-sizing-border-box--によって何が起きますかその利点は何ですか)
-- [CSS の `display` プロパティとは何ですか？その使い方の例をいくつか挙げることができますか？](#css-の-display-プロパティとは何ですかその使い方の例をいくつか挙げることができますか)
-- [`inline` と `inline-block` の違いは何ですか？](#inline-と-inline-block-の違いは何ですか)
-- [`position` が `relative`、`fixed`、`absolute`、`static` の要素の違いは何ですか？](#position-が-relativefixedabsolutestatic-の要素の違いは何ですか)
-- [ローカルや本番環境で、どの既存の CSS フレームワークを使用していますか？また、どのように変更/改善していますか？](#ローカルや本番環境でどの既存の-css-フレームワークを使用していますかまたどのように変更改善していますか)
-- [CSS の Flexbox や Grid の仕様で遊んだことはありますか？](#css-の-flexbox-や-grid-の仕様で遊んだことはありますか)
-- [ウェブサイトをレスポンシブでコーディングすることとモバイルファーストでコーディングすることの違いを説明できますか？](#ウェブサイトをレスポンシブでコーディングすることとモバイルファーストでコーディングすることの違いを説明できますか)
-- [レスポンシブデザインはアダプティブデザインと何が違いますか？](#レスポンシブデザインはアダプティブデザインと何が違いますか)
-- [Retina 対応を行ったことはありますか？もしあるなら、いつどのようなテクニックを使いましたか？](#retina-対応を行ったことはありますかもしあるならいつどのようなテクニックを使いましたか)
-- [`position: absolute` の代わりに `translate()` を使用するべき場合はありますか？その逆の場合もありますか？理由も合わせて教えてください。](#position-absolute-の代わりに-translate-を使用するべき場合はありますかその逆の場合もありますか理由も合わせて教えてください)
+<TOCInline toc={toc} />
 
 ### CSS セレクターの詳細度とは何ですか？それはどのようにはたらきますか？
 

website/i18n/jp/docusaurus-plugin-content-docs/current/html-questions.md

@@ -4,19 +4,9 @@ title: HTML に関する質問
 
 [Front-end Job Interview Questions - HTML Questions](https://github.com/h5bp/Front-end-Developer-Interview-Questions/blob/master/src/questions/html-questions.md) の回答集です。提案や訂正のプルリクエストは大歓迎です！
 
-## 目次
+import TOCInline from '@theme/TOCInline';
 
-- [`DOCTYPE` は何のためにあるものですか？](#doctype-は何のためにあるものですか)
-- [どのようにすれば複数の言語のコンテンツを含むページを提供できますか？](#どのようにすれば複数の言語のコンテンツを含むページを提供できますか)
-- [多言語サイトを設計・開発する際には、どんなことに注意を払わなければならないですか？](#多言語サイトを設計開発する際にはどんなことに注意を払わなければならないですか)
-- [`data-` 属性は何のために使われるのですか？](#data--属性は何のために使われるのですか)
-- [HTML5 をオープンウェブプラットフォームとして考えたときに、HTML5 とはどんな要素から成るものですか？](#html5-をオープンウェブプラットフォームとして考えたときにhtml5-とはどんな要素から成るものですか)
-- [`cookie`、`sessionStorage`、`localStorage` の違いを教えてください。](#cookiesessionstoragelocalstorage-の違いを教えてください)
-- [`<script>`、`<script async>`、`<script defer>` の違いを教えてください。](#scriptscript-asyncscript-defer-の違いを教えてください)
-- [なぜ一般的に、CSS の `<link>` を `<head></head>` の間に、JS の `<script>` を `</body>` の直前に置くことが良いと言われているのでしょうか？こうすべきでない例外を知っていますか？](#なぜ一般的にcss-の-link-を-headhead-の間にjs-の-script-を-body-の直前に置くことが良いと言われているのでしょうかこうすべきでない例外を知っていますか)
-- [プログレッシブレンダリングとは何ですか？](#プログレッシブレンダリングとは何ですか)
-- [img タグに `srcset` 属性を使用する理由は？この属性をもつ要素を評価するときにブラウザが行うプロセスを説明してください。](#img-タグに-srcset-属性を使用する理由はこの属性をもつ要素を評価するときにブラウザが行うプロセスを説明してください)
-- [HTML テンプレート言語をいくつか使用した経験はありますか？](#html-テンプレート言語をいくつか使用した経験はありますか)
+<TOCInline toc={toc} />
 
 ### `DOCTYPE` は何のためにあるものですか？
 

website/i18n/jp/docusaurus-plugin-content-docs/current/javascript-questions.md

@@ -4,62 +4,9 @@ title: JavaScript に関する質問
 
 [Front-end Job Interview Questions - JS Questions](https://github.com/h5bp/Front-end-Developer-Interview-Questions/blob/master/src/questions/javascript-questions.md) の回答集です。提案や訂正のプルリクエストは大歓迎です！
 
-## 目次
+import TOCInline from '@theme/TOCInline';
 
-- [イベントデリゲーションについて説明してください。](#イベントデリゲーションについて説明してください)
-- [JavaScript の `this` はどう機能するものなのか説明してください。](#javascript-の-this-はどう機能するものなのか説明してください)
-- [プロトタイプ継承はどのように機能するか説明してください。](#プロトタイプ継承はどのように機能するか説明してください)
-- [AMD と CommonJS は何が違いますか？](#amd-と-commonjs-は何が違いますか)
-- [なぜ次のコードは IIFE として機能しないのでしょうか？:`function foo(){ }();` IIFE として機能させるには何を変える必要がありますか？](#なぜ次のコードは-iife-として機能しないのでしょうかfunction-foo--iife-として機能させるには何を変える必要がありますか)
-- [変数が `null`、`undefined`、未定義だったときの違いはなんでしょう？どのようにして、これらの状態を調べますか？](#変数が-nullundefined未定義だったときの違いはなんでしょうどのようにしてこれらの状態を調べますか)
-- [クロージャとはなんですか？また、なぜこれを使うのでしょうか？どのように使うのでしょうか？](#クロージャとはなんですかまたなぜこれを使うのでしょうかどのように使うのでしょうか)
-- [`.forEach` と `.map()` の違いを説明できますか？これらをどのように使い分けますか？](#foreach-と-map-の違いを説明できますかこれらをどのように使い分けますか)
-- [無名関数の典型的な使い方を教えてください。](#無名関数の典型的な使い方を教えてください)
-- [どのようなことを意識してコードを組み立てていますか？（モジュールパターン, classical inheritance？）](#どのようなことを意識してコードを組み立てていますか-モジュールパターン-classical-inheritance)
-- [host objects と native objects は何が違いますか？](#host-objects-と-native-objects-は何が違いますか)
-- [次のコードの違いはなんですか？:`function Person(){}` 後、`var person = Person()` と `var person = new Person()`](#次のコードの違いはなんですか-function-person-後var-person--person-と-var-person--new-person)
-- [`.call` と `.apply` の違いはなんですか？](#call-と-apply-の違いはなんですか)
-- [`Function.prototype.bind` について説明してください。](#functionprototypebind-について説明してください)
-- [`document.write()` はいつ使いますか？](#documentwrite-はいつ使いますか)
-- [feature detection, feature inference, and using the UA string の違いはなんですか？](#feature-detection-feature-inference-and-using-the-ua-string-の違いはなんですか)
-- [Ajax をできるだけ詳しく説明してください。](#ajax-をできるだけ詳しく説明してください)
-- [Ajax を利用する利点と欠点はなんですか？](#ajax-を利用する利点と欠点はなんですか)
-- [JSONP がどのように機能するか（またそれが Ajax とはどこが違うのか）を説明してください。](#jsonp-がどのように機能するかまたそれが-ajax-とはどこが違うのかを説明してください)
-- [JavaScript templating を使ったことがありますか？ もしあれば、どのライブラリを使ったことがありますか？](#javascript-templating-を使ったことがありますか-もしあればどのライブラリを使ったことがありますか)
-- ["巻き上げ"について説明してください。](#巻き上げについて説明してください)
-- [event bubbling について教えてください。](#event-bubbling-について教えてください)
-- ["attribute" と "property" の違いを説明してください。](#attribute-と-property-の違いを説明してください)
-- [ビルトインオブジェクトを拡張することはなぜ良くないのでしょうか？](#ビルトインオブジェクトを拡張することはなぜ良くないのでしょうか)
-- [document `load` event と document `DOMContentLoaded` event の違いは？](#document-load-event-と-document-domcontentloaded-event-の違いは)
-- [`==` と `===` の違いはなんですか？](#-と--の違いはなんですか)
-- [JavaScript の同一オリジンポリシーについて説明してください。](#javascript-の同一オリジンポリシーについて説明してください)
-- [以下のコードを動くようにしてください: `duplicate([1,2,3,4,5]); // [1,2,3,4,5,1,2,3,4,5]`](#以下のコードを動くようにしてください)
-- [それが　 Ternary expression と呼ばれるのはなぜですか？ "Ternary" はどういう意味で使われているのでしょうか？](#それがternary-expression-と呼ばれるのはなぜですか-ternary-はどういう意味で使われているのでしょうか)
-- [`"use strict";` とはなんですか？これを使う利点と欠点を教えてください。](#use-strict-とはなんですかこれを使う利点と欠点を教えてください)
-- [**"fizz"** を`3`の倍数で、**"buzz"** を`5`の倍数で、**"fizzbuzz"** を`3`と`5`の倍数で出力する`100`まで反復する for ループを作成してください。](#fizz-を3の倍数でbuzz-を5の倍数でfizzbuzz-を3と5の倍数で出力する100まで反復する-for-ループを作成してください)
-- [Web サイトのグローバルスコープをそのままの状態を保ち、決して触らないことが、一般的に良いとされているのはなぜですか？](#web-サイトのグローバルスコープをそのままの状態を保ち決して触らないことが一般的に良いとされているのはなぜですか)
-- [なぜあなたは `load` イベントのようなものを使うのですか？このイベントには欠点がありますか？あなたは何か選択肢を知っていますか、なぜそれらを使うのですか？](#なぜあなたは-load-イベントのようなものを使うのですかこのイベントには欠点がありますかあなたは何か選択肢を知っていますかなぜそれらを使うのですか)
-- [シングルページアプリが何であるか、そして SEO に優しいアプリを作る方法を説明してください。](#シングルページアプリが何であるかそして-seo-に優しいアプリを作る方法を説明してください)
-- [プロミスおよび/またはそのポリフィルの経験はどの程度ですか？](#プロミスおよびまたはそのポリフィルの経験はどの程度ですか)
-- [コールバックの代わりにプロミスを使用することの長所と短所は何ですか？](#コールバックの代わりにプロミスを使用することの長所と短所は何ですか)
-- [JavaScript にコンパイルしてくれる言語で JavaScript を書く利点と欠点をいくつか教えてください。](#javascript-にコンパイルしてくれる言語で-javascript-を書く利点と欠点をいくつか教えてください)
-- [JavaScript のコードをデバッグする際にはどんなツールや技術をを利用しますか？](#javascript-のコードをデバッグする際にはどんなツールや技術をを利用しますか)
-- [オブジェクトのプロパティや、配列の要素をイテレートする際にどの構文を使いますか？](#オブジェクトのプロパティや配列の要素をイテレートする際にどの構文を使いますか)
-- [mutable と immutable オブジェクトの違いを説明してください](#mutable-と-immutable-オブジェクトの違いを説明してください)
-- [synchronous と asynchronous functions の違いを説明してください。](#synchronous-と-asynchronous-functions-の違いを説明してください)
-- [event loop とはなんですか？call stack や task queue との違いはなんですか？](#event-loop-とはなんですかcall-stack-や-task-queue-との違いはなんですか)
-- [`function foo() {}` と `var foo = function() {}` をした場合の `foo` の使い方の違いを説明してください。](#function-foo--と-var-foo--function--をした場合の-foo-の使い方の違いを説明してください)
-- [`let` と `var` と `const` で宣言した変数の違いはなんですか？](#let-と-var-と-const-で宣言した変数の違いはなんですか)
-- [ES6 のクラス定義と、ES5 のコンストラクタ関数との違いには何がありますか？](#es6-のクラス定義とes5-のコンストラクタ関数との違いには何がありますか)
-- [アロー構文の使い方を例示してください。この構文と他の方法による定義とは何が違いますか？](#アロー構文の使い方を例示してくださいこの構文と他の方法による定義とは何が違いますか)
-- [コンストラクタにおいて、メソッドをアロー構文で定義する方法の利点はなんですか？](#コンストラクタにおいてメソッドをアロー構文で定義する方法の利点はなんですか)
-- [高階関数とはなんですか？](#高階関数とはなんですか)
-- [オブジェクトと配列について、「分割代入」の例を教えてください。](#オブジェクトと配列について分割代入の例を教えてください)
-- [ES6 のテンプレート文字列は文字列を作り出す上で様々な柔軟性をもたらしますが、例を示すことはできますか？](#es6-のテンプレート文字列は文字列を作り出す上で様々な柔軟性をもたらしますが例を示すことはできますか)
-- [カリー化の例を説明してください。またカリー化がもたらす利点はどこにあるのでしょうか？](#カリー化の例を説明してくださいまたカリー化がもたらす利点はどこにあるのでしょうか)
-- [spread syntax を利用する利点はなんですか？また、rest syntax とは何が違っていますか？](#spread-syntax-を利用する利点はなんですかまたrest-syntax-とは何が違っていますか)
-- [ファイル間でコードを共有するにはどうすれば良いですか？](#ファイル間でコードを共有するにはどうすれば良いですか)
-- [静的クラスメンバーはどんな場面で使いますか？](#静的クラスメンバーはどんな場面で使いますか)
+<TOCInline toc={toc} />
 
 ### イベントデリゲーションについて説明してください。
 
@@ -846,7 +793,7 @@ TODO
 
 同期関数はブロッキングし、非同期関数はブロッキングしません。同期関数では、前のステートメントが終わってから次のステートメントが実行されます。この場合、プログラムはステートメントの記載されている順どおりに正確に評価され、もしあるステートメントで時間がかかるとプログラムの実行は一時停止します。
 
-非同期関数は、通常コールバックをパラメータとして受け取り、非同期関数が呼ばれた後、直ちに次の行を実行します。コールバックは、非同期処理が完了し呼び出しスタックが空の場合にのみ呼び出されます。Webサーバーからのデータのロードやデータベースのクエリなどとても重い処理は非同期で実行すべきで、そうすることで、メインスレッドは長い処理が完了するまでブロッキングすることなく(ブラウザの場合、UIがフリーズします)、他の処理を継続して実行出来ます。
+非同期関数は、通常コールバックをパラメータとして受け取り、非同期関数が呼ばれた後、直ちに次の行を実行します。コールバックは、非同期処理が完了し呼び出しスタックが空の場合にのみ呼び出されます。Web サーバーからのデータのロードやデータベースのクエリなどとても重い処理は非同期で実行すべきで、そうすることで、メインスレッドは長い処理が完了するまでブロッキングすることなく(ブラウザの場合、UI がフリーズします)、他の処理を継続して実行出来ます。
 
 [[↑] 先頭に戻る](#目次)
 

website/i18n/kr/docusaurus-plugin-content-docs/current/css-questions.md

@@ -4,39 +4,9 @@ title: CSS 질문
 
 [프론트엔드 면접 질문 - CSS 질문](https://github.com/h5bp/Front-end-Developer-Interview-Questions/blob/master/src/questions/css-questions.md)에 대한 해설입니다. Pull Request를 통한 제안, 수정 요청 환영합니다.
 
-## 목차
+import TOCInline from '@theme/TOCInline';
 
-- [CSS 선택자의 특정성은 무엇이며 어떻게 작동하나요?](#css-선택자의-특정성은-무엇이며-어떻게-작동하나요)
-- [`Resetting`과 `Normalizing` CSS의 차이점은 무엇인가요? 당신은 무엇을 선택할 것이며, 그 이유는 무엇인가요?](#resetting과-normalizing-css의-차이점은-무엇인가요-당신은-무엇을-선택할-것이며-그-이유는-무엇인가요)
-- [`float`가 어떻게 작동하는지 설명하세요.](#float가-어떻게-작동하는지-설명하세요)
-- [`z-index`와 스택 컨텍스트(stacking context)가 어떻게 형성되는지 설명하세요.](#z-index와-스택-컨텍스트stacking-context가-어떻게-형성되는지-설명하세요)
-- [BFC(Block Formatting Context)와 그 작동 방식을 설명하세요.](#bfcblock-formatting-context와-그-작동-방식을-설명하세요)
-- [clear 하는 방법에는 어떤 것이 있으며, 각각 어떤상황에 적합한가요?](#clear-하는-방법에는-어떤-것이-있으며-각각-어떤상황에-적합한가요)
-- [CSS 스프라이트는 무엇인가요? 그리고 당신이 페이지나 사이트에 구현하는 방법도 설명해주세요.](#css-스프라이트는-무엇인가요-그리고-당신이-페이지나-사이트에-구현하는-방법도-설명해주세요)
-- [브라우저 별로 스타일이 다른 문제를 어떤 접근 방법으로 해결하나요?](#브라우저-별로-스타일이-다른-문제를-어떤-접근-방법으로-해결하나요)
-- [기능이 제한된 브라우저의 페이지는 어떻게 처리하나요? 어떤 기술/프로세스를 사용하나요?](#기능이-제한된-브라우저의-페이지는-어떻게-처리하나요-어떤-기술프로세스를-사용하나요)
-- [콘텐츠를 시각적으로 숨기는(그리고 screen reader에서만 사용할 수 있게 만드는)다양한 방법은 무엇인가요?](#콘텐츠를-시각적으로-숨기는그리고-screen-reader에서만-사용할-수-있게-만드는다양한-방법은-무엇인가요)
-- [그리드 시스템을 사용해본적 있나요? 만약 그렇다면, 당신은 어떤 것을 선호하나요?](#그리드-시스템을-사용해본적-있나요-만약-그렇다면-당신은-어떤-것을-선호하나요)
-- [미디어 쿼리나 모바일만을 위한 layouts/CSS를 사용하거나 구현해본적 있나요?](#미디어-쿼리나-모바일만을-위한-layoutscss를-사용하거나-구현해본적-있나요)
-- [SVG 스타일링에 익숙하신가요?](#svg-스타일링에-익숙하신가요)
-- [screen이 아닌 @media 속성의 예를 들어줄 수 있나요?](#screen이-아닌-media-속성의-예를-들어줄-수-있나요)
-- [효율적인 CSS를 작성하는데 있어서 어려움은 무엇인가요?](#효율적인-css를-작성하는데-있어서-어려움은-무엇인가요)
-- [CSS 전처리기를 사용하면 어떤 장단점이 있나요?](#css-전처리기를-사용하면-어떤-장단점이-있나요)
-- [사용했던 CSS 전처리기에 대해 좋았던 점과 싫었던 점을 설명해주세요.](#사용했던-css-전처리기에-대해-좋았던-점과-싫었던-점을-설명해주세요)
-- [비표준 글꼴을 사용하는 웹 디자인 컴포넌트를 어떻게 구현하나요?](#비표준-글꼴을-사용하는-웹-디자인-컴포넌트를-어떻게-구현하나요)
-- [브라우저가 CSS 선택자에 일치하는 요소를 어떻게 결정하는지 설명하세요.](#브라우저가-css-선택자에-일치하는-요소를-어떻게-결정하는지-설명하세요)
-- [Pseudo-elements에 대해 설명하고 이 요소가 무엇을 위해 사용되는지 설명하세요.](#pseudo-elements에-대해-설명하고-이-요소가-무엇을-위해-사용되는지-설명하세요)
-- [박스 모델에 대한 당신의 이해와 CSS에서 브라우저에 다른 박스 모델로 레이아웃을 렌더링하는 방법을 설명하세요.](#박스-모델에-대한-당신의-이해와-css에서-브라우저에-다른-박스-모델로-레이아웃을-렌더링하는-방법을-설명하세요)
-- [`* { box-sizing: border-box; }`는 무엇을 하나요? 장점은 무엇인가요?](#--box-sizing-border-box-는-무엇을-하나요-장점은-무엇인가요)
-- [CSS의 `display` 속성은 무엇이며 사용법에 대한 몇 가지 예를 들 수 있나요?](#css의-display-속성은-무엇이며-사용법에-대한-몇-가지-예를-들-수-있나요)
-- [`inline` 과 `inline-block` 의 차이점은 무엇인가요?](#inline-과-inline-block-의-차이점은-무엇인가요)
-- [`relative`, `fixed`, `absolute`, `static` 요소의 차이점은 무엇인가요?](#relative-fixed-absolute-static-요소의-차이점은-무엇인가요)
-- [로컬이나 프로덕션 환경에서 사용했던 CSS 프레임워크는 무엇인가요? 어떻게 그들을 바꾸거나 개선할 수 있을까요?](#로컬이나-프로덕션-환경에서-사용했던-css-프레임워크는-무엇인가요-어떻게-그들을-바꾸거나-개선할-수-있을까요)
-- [새로운 CSS Flexbox나 Grid 스펙을 사용해본 적이 있나요?](#새로운-css-flexbox나-grid-스펙을-사용해본-적이-있나요)
-- [반응형 웹사이트를 코딩하는 것과 모바일 우선 전략을 사용하는 것 사이의 차이점을 설명하세요.](#반응형-웹사이트를-코딩하는-것과-모바일-우선-전략을-사용하는-것-사이의-차이점을-설명하세요)
-- [반응형 디자인은 적응형 디자인과 어떻게 다른가요?](#반응형-디자인은-적응형-디자인과-어떻게-다른가요)
-- [레티나 그래픽으로 작업 해본 적이 있나요? 그렇다면, 언제, 어떤 기술을 사용하였나요?](#레티나-그래픽으로-작업-해본-적이-있나요-그렇다면-언제-어떤-기술을-사용하였나요)
-- [`absolute` 포지셔닝 대신 `translate()`를 사용하는 이유가 무엇인가요? 또는 그 반대의 경우에 대해서는 어떻게 생각하시나요?, 그 이유는 무엇인가요?](#absolute-포지셔닝-대신-translate를-사용하는-이유가-무엇인가요-또는-그-반대의-경우에-대해서는-어떻게-생각하시나요-그-이유는-무엇인가요)
+<TOCInline toc={toc} />
 
 ### CSS 선택자의 특정성은 무엇이며 어떻게 작동하나요?
 

website/i18n/kr/docusaurus-plugin-content-docs/current/html-questions.md

@@ -4,19 +4,9 @@ title: HTML 질문
 
 [프론트엔드 면접 질문 - HTML 질문](https://github.com/h5bp/Front-end-Developer-Interview-Questions/blob/master/src/questions/html-questions.md)에 대한 해설입니다. Pull Request를 통한 제안, 수정 요청 환영합니다.
 
-## 목차
+import TOCInline from '@theme/TOCInline';
 
-- [`DOCTYPE`은 무엇을 하나요?](#doctype은-무엇을-하나요)
-- [여러 언어로 되어 있는 콘텐츠의 페이지를 어떻게 제공하나요?](#여러-언어로-되어-있는-콘텐츠의-페이지를-어떻게-제공하나요)
-- [다국어 사이트를 디자인하거나 개발할 때 주의해야할 사항은 무엇인가요?](#다국어-사이트를-디자인하거나-개발할-때-주의해야할-사항은-무엇인가요)
-- [`data-`속성은 무엇에 좋은가요?](#data-속성은-무엇에-좋은가요)
-- [HTML5를 개방형 웹 플랫폼으로 간주할 때, HTML5의 구성 요소는 무엇인가요?](#html5를-개방형-웹-플랫폼으로-간주할-때-html5의-구성-요소는-무엇인가요)
-- [`cookie`, `sessionStorage`, `localStorage` 사이의 차이점을 설명하세요.](#cookie-sessionstorage-localstorage-사이의-차이점을-설명하세요)
-- [`<script>`, `<script async>`, `<script defer>` 사이의 차이점을 설명하세요.](#script-script-async-script-defer-사이의-차이점을-설명하세요)
-- [왜 일반적으로 CSS `<link>` 태그를 `<head></head>` 태그 사이에 위치시키고, JS `<script>` 태그를 `</body>` 직전에 위치시키는 것이 좋은 방법인가요? 다른 예외적인 상황을 알고있나요?](#왜-일반적으로-css-link-태그를-headhead-태그-사이에-위치시키고-js-script-태그를-body-직전에-위치시키는-것이-좋은-방법인가요-다른-예외적인-상황을-알고있나요)
-- [프로그레시브 렌더링이 무엇인가요?](#프로그레시브-렌더링이-무엇인가요)
-- [이미지 태그에 `srcset` 속성을 사용하는 이유는 무엇인가요? 이 속성의 컨텐츠를 실행할 때 브라우저의 프로세스를 설명하세요.](#이미지-태그에-srcset-속성을-사용하는-이유는-무엇인가요-이-속성의-컨텐츠를-실행할-때-브라우저의-프로세스를-설명하세요)
-- [다른 HTML 템플릿 언어를 사용해본 적이 있나요?](#다른-html-템플릿-언어를-사용해본-적이-있나요)
+<TOCInline toc={toc} />
 
 ### `DOCTYPE`은 무엇을 하나요?
 

website/i18n/kr/docusaurus-plugin-content-docs/current/javascript-questions.md

@@ -4,62 +4,9 @@ title: JavaScript 질문
 
 [프론트엔드 면접 질문 - JS 질문](https://github.com/h5bp/Front-end-Developer-Interview-Questions/blob/master/src/questions/css-questions.md)에 대한 해설입니다. Pull Request를 통한 제안, 수정 요청 환영합니다.
 
-## 목차
+import TOCInline from '@theme/TOCInline';
 
-- [이벤트 위임에 대해 설명하세요.](#이벤트-위임에-대해-설명하세요)
-- [`this`가 JavaScript에서 어떻게 작동하는지 설명하세요.](#this가-javascript에서-어떻게-작동하는지-설명하세요)
-- [프로토타입 상속이 어떻게 작동하는지 설명하세요.](#프로토타입-상속이-어떻게-작동하는지-설명하세요)
-- [AMD vs CommonJS에 대해 어떻게 생각하나요?](#amd-vs-commonjs에-대해-어떻게-생각하나요)
-- [다음이 IIFE로 작동하지 않는 이유를 설명하세요: `function foo(){ }();`를 IIFE로 만들기 위해서는 무엇을 바꿔야하나요?](#다음이-iife로-작동하지-않는-이유를-설명하세요-function-foo-를-iife로-만들기-위해서는-무엇을-바꿔야하나요)
-- [`null`, `undefined`, `undeclared`의 차이점은 무엇인가요? 어떻게 이 상태들에 대한 확인을 할 것인가요?](#null-undefined-undeclared의-차이점은-무엇인가요-어떻게-이-상태들에-대한-확인을-할-것인가요)
-- [클로저는 무엇이며, 어떻게/왜 사용하나요?](#클로저는-무엇이며-어떻게왜-사용하나요)
-- [`.forEach` 루프와 `.map()` 루프 사이의 주요 차이점을 설명할 수 있나요? 왜 둘 중 하나를 선택할 것인가요?](#foreach-루프와-map-루프-사이의-주요-차이점을-설명할-수-있나요-왜-둘-중-하나를-선택할-것인가요)
-- [익명 함수의 일반적인 사용 사례는 무엇인가요?](#익명-함수의-일반적인-사용-사례는-무엇인가요)
-- [코드를 어떻게 구성하나요? (모듈 패턴, 고전적인 상속?)](#코드를-어떻게-구성하나요-모듈-패턴-고전적인-상속)
-- [호스트 객체와 내장 객체의 차이점은 무엇인가요?](#호스트-객체와-내장-객체의-차이점은-무엇인가요)
-- [`function Person(){}`, `var person = Person()`, `var person = new Person()`의 차이점은 무엇인가요?](#function-person-var-person--person-var-person--new-person의-차이점은-무엇인가요)
-- [`.call`과 `.apply`의 차이점은 무엇인가요?](#call과-apply의-차이점은-무엇인가요)
-- [`Function.prototype.bind`에 대해 설명하세요.](#functionprototypebind에-대해-설명하세요)
-- [언제 `document.write()`를 사용하나요?](#언제-documentwrite를-사용하나요)
-- [Feature detection, Feature inference, UA String의 차이점은 무엇인가요?](#feature-detection-feature-inference-ua-string의-차이점은-무엇인가요)
-- [Ajax에 대해 가능한 한 자세히 설명하세요.](#ajax에-대해-가능한-한-자세히-설명하세요)
-- [Ajax를 사용하는 것의 장단점은 무엇인가요?](#ajax를-사용하는-것의-장단점은-무엇인가요)
-- [JSONP가 어떻게 동작하는지(그리고 Ajax와 어떻게 다른지)를 설명하세요.](#jsonp가-어떻게-동작하는지그리고-ajax와-어떻게-다른지를-설명하세요)
-- [JavaScript 템플릿을 사용한 적이 있나요? 사용해봤다면, 어떤 라이브러리를 사용했나요?](#JavaScript-템플릿을-사용한-적이-있나요-사용해봤다면-어떤-라이브러리를-사용했나요)
-- [`호이스팅`에 대해 설명하세요.](#호이스팅에-대해-설명하세요)
-- [event bubbling에 대해 설명하세요.](#event-bubbling에-대해-설명하세요)
-- ["attribute"와 "property"의 차이점은 무엇인가요?](#attribute와-property의-차이점은-무엇인가요)
-- [내장 JavaScript 객체를 확장하는 것이 좋은 생각이 아닌 이유는 무엇인가요?](#내장-javascript-객체를-확장하는-것이-좋은-생각이-아닌-이유는-무엇인가요)
-- [document `load` 이벤트와 document `DOMContentLoaded` 이벤트의 차이점은 무엇인가요?](#document-load-이벤트와-document-domcontentloaded-이벤트의-차이점은-무엇인가요)
-- [`==`와 `===`의 차이점은 무엇인가요?](#와-의-차이점은-무엇인가요)
-- [JavaScript와 관련하여 same-origin 정책을 설명하세요.](#javascript와-관련하여-same-origin-정책을-설명하세요)
-- [다음이 작동하게 만들어보세요.](#다음이-작동하게-만들어보세요)
-- [왜 Ternary expression이라고 부르고, "Ternary"라는 단어는 무엇을 나타내나요?](#왜-ternary-expression이라고-부르고-ternary라는-단어는-무엇을-나타내나요)
-- [`"use strict";` 이 무엇인가요? 사용시 장단점이 무엇인가요?](#use-strict-이-무엇인가요-사용시-장단점이-무엇인가요)
-- [100까지 증가하면서 `3`의 배수에는 `fizz`를 출력하고, `5`의 배수에는 `buzz`를 출력하고, `3`과 `5`의 배수에는 `fizzbuzz`를 출력하는 for loop를 만드세요.](#100까지-증가하면서-3의-배수에는-fizz를-출력하고-5의-배수에는-buzz를-출력하고-3과-5의-배수에는-fizzbuzz를-출력하는-for-loop를-만드세요)
-- [일반적으로 웹 사이트의 전역 스코프를 그대로 두고 건드리지 않는 것이 좋은 이유는 무엇인가요?](#일반적으로-웹-사이트의-전역-스코프를-그대로-두고-건드리지-않는-것이-좋은-이유는-무엇인가요)
-- [왜 `load` 이벤트와 같은 것을 사용하나요? 이 이벤트에는 단점이 있나요? 다른 대안을 알고 있나요? 알고 있다면 왜 그것을 사용할 건가요?](#왜-load-이벤트와-같은-것을-사용하나요-이-이벤트에는-단점이-있나요-다른-대안을-알고-있나요-알고-있다면-왜-그것을-사용할-건가요)
-- [single page app이 무엇인지 설명하고 SEO-friendly하게 만드는 방법을 설명하세요.](#single-page-app이-무엇인지-설명하고-seo-friendly하게-만드는-방법을-설명하세요)
-- [Promises와 그 Polyfill에 대한 당신의 경험은 어느 정도인가요?](#promises와-그-polyfill에-대한-당신의-경험은-어느-정도인가요)
-- [Callback 대신에 Promise를 사용할 때의 장점과 단점은 무엇인가요?](#callback-대신에-promise를-사용할-때의-장점과-단점은-무엇인가요)
-- [JavaScript로 컴파일되는 언어로 JavaScript 코드를 작성하는 경우의 장단점은 무엇인가요?](#javascript로-컴파일되는-언어로-javascript-코드를-작성하는-경우의-장단점은-무엇인가요)
-- [JavaScript 코드를 디버깅하기 위해 어떤 도구와 기술을 사용하나요?](#javascript-코드를-디버깅하기-위해-어떤-도구와-기술을-사용하나요)
-- [오브젝트 속성이나 배열 항목을 반복할 때 사용하는 언어 구문은 무엇인가요?](#오브젝트-속성이나-배열-항목을-반복할-때-사용하는-언어-구문은-무엇인가요)
-- [mutable 객체와 immutable 객체 사이의 차이점을 설명하세요.](#mutable-객체와-immutable-객체-사이의-차이점을-설명하세요)
-- [동기, 비동기 함수의 차이점을 설명하세요.](#동기-비동기-함수의-차이점을-설명하세요)
-- [이벤트 루프란 무엇인가요? 콜 스택과 태스크 큐의 차이점은 무엇인가요?](#이벤트-루프란-무엇인가요-콜-스택과-태스크-큐의-차이점은-무엇인가요)
-- [`function foo() {}`와 `var foo = function() {}` 사이에서 `foo` 사용의 차이에 대해 설명하세요.](#function-foo-와-var-foo--function--사이에서-foo-사용법의-차이에-대해-설명하세요)
-- [`let`, `var`, `const`를 사용하여 생성된 변수들의 차이점은 무엇인가요?](#let-var-const를-사용하여-생성된-변수들의-차이점은-무엇인가요)
-- [ES6 클래스와 ES5 함수 생성자의 차이점은 무엇인가요?](#es6-클래스와-es5-함수-생성자의-차이점은-무엇인가요)
-- [새 화살표 => 함수 문법에 대한 사용 예시를 들 수 있나요? 이 새로운 문법은 다른 함수와 어떻게 다른가요?](#새-화살표--함수-문법에-대한-사용-예시를-들-수-있나요-이-새로운-문법은-다른-함수와-어떻게-다른가요)
-- [생성자의 메서드에 화살표 문법을 사용하면 어떤 이점이 있나요?](#생성자의-메서드에-화살표-문법을-사용하면-어떤-이점이-있나요)
-- [고차 함수(higher-order function)의 정의는 무엇인가요?](#고차-함수higher-order-function의-정의는-무엇인가요)
-- [객체나 배열에 대한 디스트럭쳐링 예시를 들 수 있나요?](#객체나-배열에-대한-디스트럭쳐링-예시를-들-수-있나요)
-- [ES6 템플릿 리터럴은 문자열을 생성하는데 많은 유연성을 제공합니다. 이에 대한 예를 들 수 있나요?](#es6-템플릿-리터럴은-문자열을-생성하는데-많은-유연성을-제공합니다-이에-대한-예를-들-수-있나요)
-- [curry 함수의 예를 들어 줄 수 있나요? 그리고 이 문법은 어떤 이점을 가지고 있나요?](#curry-함수의-예를-들어-줄-수-있나요-그리고-이-문법은-어떤-이점을-가지고-있나요)
-- [spread 문법을 사용할 때의 이점은 무엇이며 rest 문법과 다른 점은 무엇인가요?](#spread-문법을-사용할-때의-이점은-무엇이며-rest-문법과-다른-점은-무엇인가요)
-- [파일 간에 코드를 공유하려면 어떻게 해야하나요?](#파일-간에-코드를-공유하려면-어떻게-해야하나요)
-- [정적 클래스 멤버를 만드는 이유는 무엇인가요?](#정적-클래스-멤버를-만드는-이유는-무엇인가요)
+<TOCInline toc={toc} />
 
 ### 이벤트 위임에 대해 설명하세요.
 

website/i18n/pl/docusaurus-plugin-content-docs/current/css-questions.md

@@ -4,39 +4,9 @@ title: Pytania z CSS
 
 Odpowiedzi do [Front-end Job Interview Questions - CSS Questions](https://github.com/h5bp/Front-end-Developer-Interview-Questions/blob/master/src/questions/css-questions.md). Pull requesty mile widziane, jeśli masz sugestie i poprawki!
 
-## Spis treści
+import TOCInline from '@theme/TOCInline';
 
-- [Czym jest specyficzność selektora CSS i jak działa?](#czym-jest-specyficzność-selektora-css-i-jak-działa)
-- [Jaka jest różnica pomiędzy CSS "resetting" oraz "normalizing"? Które wybrałbyś, i dlaczego?](#jaka-jest-różnica-pomiędzy-css-resetting-oraz-normalizing-które-wybrałbyś-i-dlaczego)
-- [Opisz `float`y i jak one działają.](#opisz-floaty-i-jak-one-działają)
-- [Opisz `z-index` i jak powstaje stacking context.](#opisz-z-index-i-jak-powstaje-stacking-context)
-- [Opisz Block Formatting Context (BFC) i jak działa.](#opisz-block-formatting-context-bfc-i-jak-działa)
-- [Jakie są różne techniki czyszczenia i które są odpowiednie w jakim kontekście?](#jakie-są-różne-techniki-czyszczenia-i-które-są-odpowiednie-w-jakim-kontekście)
-- [Wyjaśnij CSS sprites, i jak zaimplementujesz je na stronie lub witrynie.](#wyjaśnij-css-sprites-i-jak-zaimplementujesz-je-na-stronie-lub-witrynie)
-- [Jak podchodziłbyś do rozwiązywania problemów związanych ze stylem specyficznym dla przeglądarki?](#jak-podchodziłbyś-do-rozwiązywania-problemów-związanych-ze-stylem-specyficznym-dla-przeglądarki)
-- [Jak wyświetlasz swoje strony w przeglądarkach z ograniczeniami funkcji? Jakich technik/procesów używasz?](#jak-wyświetlasz-swoje-strony-w-przeglądarkach-z-ograniczeniami-funkcji-jakich-technikprocesów-używasz)
-- [Jakie są różne sposoby wizualnego ukrywania treści (i udostępniania jej tylko dla czytników ekranu)?](#jakie-są-różne-sposoby-wizualnego-ukrywania-treści-i-udostępniania-jej-tylko-dla-czytników-ekranu)
-- [Czy kiedykolwiek korzystałeś z systemu siatki (grid system), a jeśli tak, to co preferujesz?](#czy-kiedykolwiek-korzystałeś-z-systemu-siatki-grid-system-a-jeśli-tak-to-co-preferujesz)
-- [Czy używałeś lub implementowałeś media queries lub mobile-specific layouts/CSS?](#czy-używałeś-lub-implementowałeś-media-queries-lub-mobile-specific-layoutsCSS)
-- [Czy znasz stylizację SVG?](#czy-znasz-stylizację-cvg)
-- [Czy możesz podać przykład właściwości @media innej niż screen?](#czy-możesz-podać-przykład-właściwości-media-innej-niż-screen)
-- [Jakie są "tricki" do pisania wydajnego CSS?](#jakie-są-tricki-do-pisania-wydajnego-css)
-- [Jakie są zalety/wady korzystania z preprocesorów CSS?](#jakie-są-zaletywady-korzystania-z-preprocesorów-css)
-- [Opisz, co lubisz, a czego nie w preprocesorach CSS, z których korzystałeś.](#opisz-co-lubisz-a-czego-nie-w-preprocesorach-css-z-których-korzystałeś)
-- [Jak zaimplementowałbyś kompozycję do projektowania stron internetowych, która wykorzystuje niestandardowe czcionki?](#jak-zaimplementowałbyś-kompozycję-do-projektowania-stron-internetowych-która-wykorzystuje-niestandardowe-czcionki)
-- [Wyjaśnij, w jaki sposób przeglądarka określa, które elementy pasują do selektora CSS.](#wyjaśnij-w-jaki-sposób-przeglądarka-określa-które-elementy-pasują-do-selektora-css)
-- [Opisz pseudoelementy i omów, do czego służą.](#opisz-pseudoelementy-i-omów-do-czego-służą)
-- [Wyjaśnij swoje zrozumienie box model i sposób, w jaki chcesz, aby przeglądarka w CSS renderowała układ w różnych modelach pudełkowych.](#wyjaśnij-swoje-zrozumienie-box-model-i-sposób-w-jaki-chcesz-aby-przeglądarka-w-css-renderowała-układ-w-różnych-modelach-pudełkowych)
-- [Co robi `* { box-sizing: border-box; }`? Jakie są tego zalety?](#co-robi---box-sizing-border-box--jakie-są-tego-zalety)
-- [Czym jest właściwość `display` w CSS i czy możesz podać kilka przykładów jej użycia?](#czym-jest-właściwość-display-w-css-i-czy-możesz-podać-kilka-przykładów-jej-użycia)
-- [Jaka jest różnica pomiędzy `inline`, a `inline-block`?](#jaka-jest-różnica-pomiędzy-inline-a-inline-block)
-- [Jaka jest różnica między pozycjonowaniem `relative`, `fixed`, `absolute` i `static` elementu?](#jaka-jest-różnica-między-pozycjonowaniem-relative-fixed-absolute-i-static-elementu)
-- [Z jakich istniejących frameworków CSS korzystałeś lokalnie lub na produkcji? Jak byś je zmienił/ulepszył?](#z-jakich-istniejących-frameworków-css-korzystałeś-lokalnie-lub-na-produkcji-jak-byś-je-zmieniłulepszył)
-- [Czy robiłeś coś w nowej specyfikacji CSS Flexbox lub Grid?](#czy-robiłeś-coś-w-nowej-specyfikacji-css-flexbox-lub-grid)
-- [Czy potrafisz wyjaśnić różnicę między kodowaniem strony internetowej, aby była responsywna, a używaniem mobile-first strategy?](#czy-potrafisz-wyjaśnić-różnicę-między-kodowaniem-strony-internetowej-aby-była-responsywna-a-używaniem-mobile-first-strategy)
-- [Czym różni się projektowanie responsywne od projektowania adaptacyjnego?](#czym-różni-się-projektowanie-responsywne-od-projektowania-adaptacyjnego)
-- [Czy kiedykolwiek pracowałeś z grafiką Retina? Jeśli tak, kiedy i jakich technik użyłeś?](#czy-kiedykolwiek-pracowałeś-z-grafiką-retina-jeśli-tak-kiedy-i-jakich-technik-użyłeś)
-- [Czy jest jakiś powód, dla którego chciałbyś użyć `translate ()` zamiast pozycjonowania `absolute` lub odwrotnie? I dlaczego?](#czy-jest-jakiś-powód-dla-którego-chciałbyś-użyć-translate-zamiast-pozycjonowania-absolute-lub-odwrotnie-i-dlaczego)
+<TOCInline toc={toc} />
 
 ### Czym jest specyficzność selektora CSS i jak działa?
 

website/i18n/pl/docusaurus-plugin-content-docs/current/html-questions.md

@@ -4,19 +4,9 @@ title: Pytania z HTML
 
 Odpowiedzi do [Front-end Job Interview Questions - HTML Questions](https://github.com/h5bp/Front-end-Developer-Interview-Questions/blob/master/src/questions/html-questions.md). Pull request mile widziany, jeśli masz jakieś sugestie lub poprawki!
 
-## Spis treści
+import TOCInline from '@theme/TOCInline';
 
-- [Co robi DOCTYPE?](#co-robi-doctype)
-- [W jaki sposób wyświetlasz stronę z treścią w wielu językach?](#w-jaki-sposób-wyświetlasz-stronę-z-treścią-w-wielu-językach)
-- [Jakich rzeczy należy się wystrzegać podczas projektowania lub tworzenia witryn wielojęzycznych?](#jakich-rzeczy-należy-się-wystrzegać-podczas-projektowania-lub-tworzenia-witryn-wielojęzycznych)
-- [Do czego są dobre atrybuty `data-`?](#do-czego-są-dobre-atrybuty-data)
-- [Rozważ HTML5 jako Open Web Platform. Jakie są elementy składowe HTML5?](#rozważ-html5-jako-open-web-platform-jakie-są-elementy-składowe-html5)
-- [Opisz różnicę pomiędzy `cookie`, `sessionStorage` oraz `localStorage`.](#opisz-różnicę-pomiędzy-cookie-sessionStorage-oraz-localstorage)
-- [Opisz różnicę pomiędzy `<script>`, `<script async>` oraz `<script defer>`.](#opisz-różnicę-pomiędzy-script-script-async-oraz-script-defer)
-- [Dlaczego ogólnie dobrym pomysłem jest pozycjonowanie CSS `<link>` pomiędzy `<head></head>` oraz JS `<script>` tuż przed `</body>`? Czy znasz jakieś wyjątki?](#dlaczego-ogólnie-dobrym-pomysłem-jest-pozycjonowanie-css-link-pomiędzy-headhead-oraz-js-script-tuż-przed-body-czy-znasz-jakieś-wyjątki)
-- [Co to jest rendering progresywny?](#co-to-jest-rendering-progresywny)
-- [Dlaczego warto użyć atrybutu `srcset` w tagu obrazu? Wyjaśnij proces wykorzystywany przez przeglądarkę podczas oceny zawartości tego atrybutu.](#dlaczego-warto-użyć-atrybutu-srcset-w-tagu-obrazu-wyjaśnij-proces-wykorzystywany-przez-przeglądarkę-podczas-oceny-zawartości-tego-atrybutu)
-- [Czy używałeś wcześniej różnych języków szablonów HTML?](#czy-używałeś-wcześniej-różnych-języków-szablonów-html)
+<TOCInline toc={toc} />
 
 ### Co robi DOCTYPE?
 

website/i18n/pl/docusaurus-plugin-content-docs/current/javascript-questions.md

@@ -4,62 +4,9 @@ title: Pytania z JavaScript
 
 Odpowiedzi do [Front-end Job Interview Questions - JS Questions](https://github.com/h5bp/Front-end-Developer-Interview-Questions/blob/master/src/questions/javascript-questions.md). Pull requesty mile widziane, jeśli masz sugestie i poprawki!
 
-## Spis treści
+import TOCInline from '@theme/TOCInline';
 
-- [Wyjaśnij delegowanie zdarzeń](#wyjaśnij-delegowanie-zdarzeń)
-- [Wyjaśnij jak `this` działa w JavaScript](#wyjaśnij-jak-this-działa-w-javascript)
-- [Wyjaśnij, jak działa dziedziczenie prototypowe](#wyjaśnij-jak-działa-dziedziczenie-prototypowe)
-- [Co sądzisz o AMD vs CommonJS?](#co-sądzisz-o-amd-vs-commonjs)
-- [Wyjaśnij, dlaczego następujące elementy nie działają jako IIFE: `function foo(){ }();`. Co należy zmienić, aby poprawnie uczynić to IIFE?](#wyjaśnij-dlaczego-następujące-elementy-nie-działają-jako-iife-function-foo-co-należy-zmienić-aby-poprawnie-uczynić-to-iife)
-- [Jaka jest różnica między zmienną: `null`, `undefined` lub niezadeklarowaną? Jak sprawdziłbyś którykolwiek z tych stanów?](#jaka-jest-różnica-między-zmienną-null-undefined-lub-niezadeklarowaną-jak-sprawdziłbyś-którykolwiek-z-tych-stanów)
-- [Czym jest domknięcie i jak/dlaczego miałbyś je zastosować?](#czym-jest-domknięcie-i-jakdlaczego-miałbyś-je-zastosować)
-- [Czy możesz opisać główną różnicę pomiędzy pętlą `.forEach`, a pętlą `.map()` i dlaczego wybrałbyś jeden albo drugi?](#czy-możesz-opisać-główną-różnicę-pomiędzy-pętlą-forEach-a-pętlą-map-i-dlaczego-wybrałbyś-jeden-albo-drugi)
-- [Jaki jest typowy przypadek użycia funkcji anonimowych?](#jaki-jest-typowy-przypadek-użycia-funkcji-anonimowych)
-- [Jak organizujesz swój kod? (wzorzec modułu, klasyczne dziedziczenie?)](#jak-organizujesz-swój-kod-wzorzec-modułu-klasyczne-dziedziczenie)
-- [Jaka jest różnica między obiektami hosta a obiektami macierzystymi?](#jaka-jest-różnica-między-obiektami-hosta-a-obiektami-macierzystymi)
-- [Różnica pomiędzy: `function Person(){}`, `var person = Person()`, i `var person = new Person()`?](#różnica-pomiędzy-function-person-var-person--person-i-var-person--new-person)
-- [Jaka jest różnica pomiędzy `.call` i `.apply`?](#jaka-jest-różnica-pomiędzy-call-and-apply)
-- [Wytłumacz `Function.prototype.bind`.](#wytłumacz-functionprototypebind)
-- [Kiedy użyłbyś `document.write()`?](#kiedy-użyłbyś-documentwrite)
-- [Jaka jest różnica między wykrywaniem funkcji, feature inference i używaniem UA string?](#jaka-jest-różnica-między-wykrywaniem-funkcji-feature-inference-i-używaniem-ua-string)
-- [Wyjaśnij Ajax tak szczegółowo, jak to możliwe.](#wyjaśnij-ajax-tak-szczegółowo-jak-to-możliwe)
-- [Jakie są zalety i wady korzystania z Ajax?](#jakie-są-zalety-i-wady-korzystania-z-ajax)
-- [Wyjaśnij, jak działa JSONP (i jak to naprawdę nie jest Ajax).](#wyjaśnij-jak-działa-jsonp-i-jak-to-naprawdę-nie-jest-ajax)
-- [Czy kiedykolwiek używałeś szablonów JavaScript? Jeśli tak, z jakich bibliotek korzystałeś?](#czy-kiedykolwiek-używałeś-szablonów-javascript-jeśli-tak-z-jakich-bibliotek-korzystałeś)
-- [Wytłumacz "hoisting".](#wytłumacz-hoisting)
-- [Opisz event bubbling.](#opisz-event-bubbling)
-- [Jaka jest różnica pomiędzy "attribute", a "property"?](#jaka-jest-różnica-pomiędzy-attribute-a-property)
-- [Dlaczego rozszerzenie wbudowanych obiektów JavaScript nie jest dobrym pomysłem?](#dlaczego-rozszerzenie-wbudowanych-obiektów-javascript-nie-jest-dobrym-pomysłem)
-- [Różnica między document `load` event, a document `DOMContentLoaded` event?](#różnica-między-document-load-event-a-document-domcontentloaded-event)
-- [Jaka jest różnica pomiędzy `==` i `===`?](#jaka-jest-różnica-pomiędzy--i-)
-- [Wyjaśnij same-origin policy w odniesieniu do JavaScript.](#wyjaśnij-same-origin-policy-w-odniesieniu-do-javascript)
-- [Spraw aby działało: `duplicate([1,2,3,4,5]); // [1,2,3,4,5,1,2,3,4,5]`](#spraw-aby-działało)
-- [Dlaczego nazywa się to wyrażeniem trójargumentowym, co oznacza słowo "trójargumentowe"?](#dlaczego-nazywa-się-to-wyrażeniem-trójargumentowym-co-oznacza-słowo-trójargumentowe)
-- [Czym jest `"use strict";`? Jakie są zalety i wady korzystania z tego?](#czym-jest-use-strict-jakie-są-zalety-i-wady-korzystania-z-tego)
-- [Utwórz pętlę for, która będzie się powtarzać do `100` podczas wysyłania **"fizz"** w wielokrotnościach `3`, **"buzz"** w wielokrotnościach `5` i **"fizzbuzz"** w wielokrotnościach `3` oraz `5`.](#utwórz-pętlę-for-która-będzie-się-powtarzać-do-100-podczas-wysyłania-fizz-w-wielokrotnościach-3-buzz-w-wielokrotnościach-5-i-fizzbuzz-w-wielokrotnościach-3-oraz-5)
-- [Dlaczego generalnie dobrym pomysłem jest pozostawienie globalnego zasięgu witryny takim, jakim jest, i nigdy go nie dotykać?](#dlaczego-generalnie-dobrym-pomysłem-jest-pozostawienie-globalnego-zasięgu-witryny-takim-jakim-jest-i-nigdy-go-nie-dotykać)
-- [Dlaczego miałbyś używać czegoś takiego jak zdarzenie `load`? Czy to wydarzenie ma wady? Czy znasz jakieś alternatywy i dlaczego miałbyś je wykorzystać?](#dlaczego-miałbyś-używać-czegoś-takiego-jak-zdarzenie-load-czy-to-wydarzenie-ma-wady-czy-znasz-jakieś-alternatywy-i-dlaczego-miałbyś-je-wykorzystać)
-- [Wyjaśnij, czym jest SAP i jak uczynić ją przyjazną SEO.](#wyjaśnij-czym-jest-sap-i-jak-uczynić-ją-przyjazną-seo)
-- [Jaki jest zakres twojego doświadczenia z Promises i/lub ich polyfills?](#jaki-jest-zakres-twojego-doświadczenia-z-promises-ilub-ich-polyfills)
-- [Jakie są zalety i wady korzystania z obietnic zamiast callbacks?](#jakie-są-zalety-i-wady-korzystania-z-obietnic-zamiast-callbacks)
-- [Jakie są zalety/wady pisania kodu JavaScript w języku kompilującym się w JavaScript?](#jakie-są-zaletywady-pisania-kodu-javascript-w-języku-kompilującym-się-w-javascript)
-- [Jakich narzędzi i technik używasz do debugowania kodu JavaScript?](#jakich-narzędzi-i-technik-używasz-do-debugowania-kodu-javascript)
-- [Jakich konstrukcji językowych używasz do iteracji właściwości obiektów i elementów tablicy?](#jakich-konstrukcji-językowych-używasz-do-iteracji-właściwości-obiektów-i-elementów-tablicy)
-- [Wyjaśnij różnicę między obiektami mutable, a immutable.](#wyjaśnij-różnicę-między-obiektami-mutable-a-immutable)
-- [Wyjaśnij różnicę między funkcjami synchronicznymi i asynchronicznymi.](#wyjaśnij-różnicę-między-funkcjami-synchronicznymi-i-asynchronicznymi)
-- [Co to jest pętla zdarzeń? Jaka jest różnica między stosem wywołań (call stack) a kolejką zadań (task queue)?](#co-to-jest-pętla-zdarzeń-jaka-jest-różnica-między-stosem-wywołań-call-stack-a-kolejką-zadań-task-queue)
-- [Wyjaśnij różnice w korzystaniu z `foo` pomiędzy `function foo() {}` i `var foo = function() {}`](#wyjaśnij-różnice-w-korzystaniu-z-foo-pomiędzy-function-foo-i-var-foo-function-)
-- [Jakie są różnice między zmiennymi utworzonymi za pomocą `let`, `var` lub `const`?](#jakie-są-różnice-między-zmiennymi-utworzonymi-za-pomocą-let-var-lub-const)
-- [Jakie są różnice między konstruktorami funkcji ES6 i ES5?](#jakie-są-różnice-między-konstruktorami-funkcji-es6-i-es5)
-- [Czy możesz podać przypadek użycia nowej składni funkcji arrow =>? Czym ta nowa składnia różni się od innych funkcji?](#czy-możesz-podać-przypadek-użycia-nowej-składni-funkcji-arrow-czym-ta-nowa-składnia-różni-się-od-innych-funkcji)
-- [Jaka jest zaleta korzystania ze składni arrow syntax dla metody w konstruktorze?](#jaka-jest-zaleta-korzystania-ze-składni-arrow-syntax-dla-metody-w-konstruktorze)
-- [Jaka jest definicja funkcji wyższego rzędu?](#jaka-jest-definicja-funkcji-wyższego-rzędu)
-- [Czy możesz podać przykład destrukturyzacji obiektu lub tablicy?](#czy-możesz-podać-przykład-destrukturyzacji-obiektu-lub-tablicy)
-- [ES6 Template Literals oferują dużą elastyczność w generowaniu ciągów, czy możesz podać przykład?](#es6-template-literals-oferują-dużą-elastyczność-w-generowaniu-ciągów-czy-możesz-podać-przykład)
-- [Czy możesz podać przykład curry function i dlaczego ta składnia ma tę zaletę?](#czy-możesz-podać-przykład-curry-function-i-dlaczego-ta-składnia-ma-tę-zaletę)
-- [Jakie są zalety korzystania ze składni spread syntax i czym różni się od rest syntax?](#jakie-są-zalety-korzystania-ze-składni-spread-syntax-i-czym-różni-się-od-rest-syntax)
-- [Jak współdzielić kod między plikami?](#jak-współdzielić-kod-między-plikami)
-- [Dlaczego warto tworzyć członków klasy statycznej?](#dlaczego-warto-tworzyć-członków-klasy-statycznej)
+<TOCInline toc={toc} />
 
 ### Wyjaśnij delegowanie zdarzeń
 

website/i18n/pr/docusaurus-plugin-content-docs/current/css-questions.md

@@ -4,15 +4,9 @@ title: Perguntas de CSS
 
 Respostas às <a href="https://github.com/h5bp/Front-end-Developer-Interview-Questions/blob/master/src/questions/css-questions.md" id="top">Perguntas da Entrevista de Trabalho de Front-end - Questões CSS</a>. Pull requests para sugestões e correções são bem-vindos!
 
-## Índice
+import TOCInline from '@theme/TOCInline';
 
-- [O que é a especificidade do seletor CSS e como funciona?](#01)
-- [Qual é a diferença entre "redefinir"/"resetting" e "normalizar"/"normalizing" o CSS? Qual você escolheri a e porquê](#02)?
-- [Descreva `float` e como eles funcionam.](#03)
-- [Descreva o z-index e como o contexto de empilhamento é formado.](#04)
-- [Descreva o BFC (Block Formatting Context) e como ele funciona.](#05)
-- [Quais são as várias técnicas de limpeza e quais são apropriadas para qual contexto?](#06)
-- [Explique os sprites CSS e como você os implementaria em uma página ou site.](#07)
+<TOCInline toc={toc} />
 
 ### <a id="01">O que é a especificidade do seletor CSS e como funciona?</a>
 

website/i18n/pr/docusaurus-plugin-content-docs/current/html-questions.md

@@ -4,19 +4,9 @@ title: Perguntas de HTML
 
 Respostas a [Front-end Job Interview Questions - HTML Questions](https://github.com/h5bp/Front-end-Developer-Interview-Questions/blob/master/src/questions/Índice.md). Os pedidos de sugestões e correções são bem-vindos!
 
-## Índice
+import TOCInline from '@theme/TOCInline';
 
-- [O que faz um doctype?](#what-does-a-doctype-do)
-- [Como é que tu serves uma página com conteúdo em vários idiomas?](#how-do-you-serve-a-page-with-content-in-multiple-languages)
-- [Que tipo de coisas tu deves desconfiar ao projetar ou desenvolver sites multilíngues?](#what-kind-of-things-must-you-be-wary-of-when-designing-or-developing-for-multilingual-sites)
-- [Quais são os atributos `data-` bons para?](#what-are-data--attributes-good-for)
-- [Considera HTML5 como uma plataforma aberta. Quais são os blocos de construção do HTML5?](#consider-html5-as-an-open-web-platform-what-are-the-building-blocks-of-html5)
-- [Descreve a diferença entre uma `cookie`, `sessionStorage` e `localStorage`.](#describe-the-difference-between-a-cookie-sessionstorage-and-localstorage)
-- [Descreva a diferença entre `<script>`, `<script async>` e `<script defer>`.](#describe-the-difference-between-script-script-async-and-script-defer)
-- [Por que é geralmente uma boa ideia posicionar o CSS `<link>`s entre `<head></head>` e JS `<script>`s antes de `</body>`? Tu conheces alguma exceção?](#why-is-it-generally-a-good-idea-to-position-css-links-between-headhead-and-js-scripts-just-before-body-do-you-know-any-exceptions)
-- [O que é a renderização progressiva?](#what-is-progressive-rendering)
-- [Por que usarias um atributo `srcset` numa etiqueta de imagem? Explica o processo que o navegador usa ao avaliar o conteúdo deste atributo](#why-you-would-use-a-srcset-attribute-in-an-image-tag-explain-the-process-the-browser-uses-when-evaluating-the-content-of-this-attribute)
-- [Tu já usaste diferentes linguagens de modelos de HTML antes?](#have-you-used-different-html-templating-languages-before)
+<TOCInline toc={toc} />
 
 ### O que faz um `DOCTYPE`?
 

website/i18n/ru/docusaurus-plugin-content-docs/current/html-questions.md

@@ -4,19 +4,9 @@ title: Вопросы по HTML
 
 Ответы на [Вопросы кандидату на должность фронтенд-разработчика - Вопросы по HTML](https://github.com/h5bp/Front-end-Developer-Interview-Questions/tree/master/src/contents/ru#html).
 
-## Содержание
+import TOCInline from '@theme/TOCInline';
 
-- [Для чего нужен DOCTYPE?](#для-чего-нужен-doctype)
-- [Как следует оформлять страницу, содержимое которой может быть на разных языках?](#как-следует-оформлять-страницу-содержимое-которой-может-быть-на-разных-языках)
-- [На что необходимо обратить внимание при разработке мультиязычных сайтов?](#на-что-необходимо-обратить-внимание-при-разработке-мультиязычных-сайтов)
-- [Для чего нужны `data-` атрибуты?](#для-чего-нужны-data-атрибуты)
-- [Представьте HTML5 как открытую веб-платформу. Из каких блоков состоит HTML5?](#представьте-html5-как-открытую-веб-платформу-из-каких-блоков-состоит-html5)
-- [Объясните разницу между `cookie`, `sessionStorage` и `localStorage`.](#объясните-разницу-между-cookie-sessionstorage-и-localstorage)
-- [Объясните разницу между `<script>`, `<script async>` и `<script defer>`.](#объясните-разницу-между-script-script-async-и-script-defer)
-- [Почему хорошей практикой считается располагать `<link>` для подключения CSS между `<head></head>`, а `<script>` для подключения JS ставить перед `</body>`? Знаете ли вы исключения?](#почему-хорошей-практикой-считается-располагать-link-для-подключения-css-между-headhead-а-script-для-подключения-js-ставить-перед-body-знаете-ли-вы-исключения)
-- [Что такое прогрессивный рендеринг?](#что-такое-прогрессивный-рендеринг)
-- [Для чего используется атрибут `srcset` в теге изображения? Опишите процесс, который браузер использует при обработке содержимого этого атрибута.](#для-чего-используется-атрибут-srcset-в-теге-изображения-опишите-процесс-который-браузер-использует-при-обработке-содержимого-этого-атрибута)
-- [Приходилось ли вам работать с языками HTML-шаблонизации?](#приходилось-ли-вам-работать-с-языками-html-шаблонизации)
+<TOCInline toc={toc} />
 
 ### Для чего нужен DOCTYPE?
 

website/i18n/ru/docusaurus-plugin-content-docs/current/javascript-questions.md

@@ -4,62 +4,9 @@ title: Вопросы по JavaScript
 
 Ответы на [Вопросы кандидату на должность фронтенд-разработчика - Вопросы по Javascript](https://github.com/h5bp/Front-end-Developer-Interview-Questions/tree/master/src/contents/ru#js).
 
-## Содержание
+import TOCInline from '@theme/TOCInline';
 
-- [Объясните делегирование событий](#объясните-делегирование-событий)
-- [Объясните, как `this` работает в JavaScript](#объясните-как-this-работает-в-javascript)
-- [Расскажите, как работает прототипное наследование](#расскажите-как-работает-прототипное-наследование)
-- [Что вы думаете о AMD против CommonJS?](#что-вы-думаете-о-amd-против-commonjs)
-- [Объясните, почему это не является IIFE: `function foo(){ }();`. Что необходимо изменить, чтобы это стало IIFE?](#объясните-почему-это-не-является-iife-function-foo-что-необходимо-изменить-чтобы-это-стало-iife)
-- [В чем различие между переменными, значение которых: `null`, `undefined` и не объявлено? Как бы вы проверили их на каждое из этих значений?](#в-чем-различие-между-переменными-значение-которых-null-undefined-и-не-объявлено-как-бы-вы-проверили-их-на-каждое-из-этих-значений)
-- [Что такое замыкание и как/для чего его используют?](#что-такое-замыкание-и-какдля-чего-его-используют)
-- [Можете ли вы описать основное различие между циклом `.forEach` и циклом `.map()`? И в каких случаях каждый из них используется?](#можете-ли-вы-описать-основное-различие-между-циклом-foreach-и-циклом-map-и-в-каких-случаях-каждый-из-них-используется)
-- [В каких случаях обычно используются анонимные функции?](#в-каких-случаях-обычно-используются-анонимные-функции)
-- [Как вы организуете свой код? (module pattern, classical inheritance)](#как-вы-организуете-свой-код-module-pattern-classical-inheritance)
-- [В чем разница между host-объектами и нативными объектами?](#в-чем-разница-между-host-объектами-и-нативными-объектами)
-- [В чем разница между: `function Person(){}`, `var person = Person()`, и `var person = new Person()`?](#в-чем-разница-между-function-person-var-person-person-и-var-person-new-person)
-- [В чем разница между `.call` и `.apply`?](#в-чем-разница-между-call-и-apply)
-- [Что делает и для чего нужна функция `Function.prototype.bind`?](#что-делает-и-для-чего-нужна-функция-functionprototypebind)
-- [В каких случаях используется `document.write()`?](#в-каких-случаях-используется-documentwrite)
-- [В чем разница между feature detection (определение возможностей браузера), feature inference (предположение возможностей) и анализом строки user-agent?](#в-чем-разница-между-feature-detection-определение-возможностей-браузера-feature-inference-предположение-возможностей-и-анализом-строки-user-agent)
-- [Расскажите об Ajax как можно более подробно](#расскажите-об-ajax-как-можно-более-подробно)
-- [Какие преимущества и недостатки в использовании Ajax?](#какие-преимущества-и-недостатки-в-использовании-ajax)
-- [Объясните, как работает JSONP (и почему это не совсем AJAX)).](#объясните-как-работает-jsonp-и-почему-это-не-совсем-ajax)
-- [Вы когда-нибудь использовали шаблонизацию на JavaScript? Если да, то какие библиотеки вы использовали?](#вы-когда-нибудь-использовали-шаблонизацию-на-javascript-если-да-то-какие-библиотеки-вы-использовали)
-- [Расскажите, что такое поднятие (hoisting)](#расскажите-что-такое-поднятие-hoisting)
-- [Объясните, что такое всплытие событий (event bubbling)](#объясните-что-такое-всплытие-событий-event-bubbling)
-- [В чем разница между "атрибутом" (attribute) и "свойством" (property)?](#в-чем-разница-между-атрибутом-attribute-и-свойством-property)
-- [Почему не следует расширять нативные JavaScript-объекты?](#почему-не-следует-расширять-нативные-javascript-объекты)
-- [В чем разница между событием `load` и событием `DOMContentLoaded`?](#в-чем-разница-между-событием-load-и-событием-domcontentloaded)
-- [В чем разница между `==` и `===`?](#в-чем-разница-между-и)
-- [Объясните same-origin policy в контексте JavaScript](#объясните-same-origin-policy-в-контексте-javascript)
-- [Сделайте так, чтобы этот код работал: `duplicate([1,2,3,4,5]); // [1,2,3,4,5,1,2,3,4,5]`](#сделайте-так-чтобы-этот-код-работал)
-- [Почему тернарный оператор так называется?](#почему-тернарный-оператор-так-называется)
-- [Что делает строчка "use strict";? Какие достоинства и недостатки от ее использования?](#что-делает-строчка-use-strict-какие-достоинства-и-недостатки-от-ее-использования)
-- [Напишите цикл, который перебирает числа до 100, возвращая "fizz" на числа кратные 3, "buzz" на числа кратные 5 и "fizzbuzz" на числа кратные 3 и 5](#напишите-цикл-который-перебирает-числа-до-100-возвращая-fizz-на-числа-кратные-3-buzz-на-числа-кратные-5-и-fizzbuzz-на-числа-кратные-3-и-5)
-- [Почему считается хорошим тоном оставить глобальную область видимости (global scope) в нетронутом состоянии?](#почему-считается-хорошим-тоном-оставить-глобальную-область-видимости-global-scope-в-нетронутом-состоянии)
-- [Для чего используют событие `load`? Есть ли у этого события недостатки? Знаете ли вы какие-либо альтернативы, и в каких случаях бы стали их использовать?](#для-чего-используют-событие-load-есть-ли-у-этого-события-недостатки-знаете-ли-вы-какие-либо-альтернативы-и-в-каких-случаях-бы-стали-их-использовать)
-- [Расскажите, что такое одностраничное приложение, и как сделать его SEO-оптимизированным](#расскажите-что-такое-одностраничное-приложение-и-как-сделать-его-seo-оптимизированным)
-- [Насколько вы опытны в работе с промисами (promises) и/или их полифилами?](#насколько-вы-опытны-в-работе-с-промисами-promises-иили-их-полифилами)
-- [Какие преимущества и недостатки при использовании промисов вместо колбэков (callbacks)?](#какие-преимущества-и-недостатки-при-использовании-промисов-вместо-колбэков-callbacks)
-- [Каковы преимущества и недостатки написания JavaScript-кода на языке, который компилируется в JavaScript?](#каковы-преимущества-и-недостатки-написания-javascript-кода-на-языке-который-компилируется-в-javascript)
-- [Какие инструменты и методы вы используете при отладке кода?](#какие-инструменты-и-методы-вы-используете-при-отладке-кода)
-- [Какие языковые конструкции вы используете для итерации по свойствам объекта и элементам массива?](#какие-языковые-конструкции-вы-используете-для-итерации-по-свойствам-объекта-и-элементам-массива)
-- [Объясните разницу между изменяемыми (mutable) и неизменяемыми (immutable) объектами](#объясните-разницу-между-изменяемыми-mutable-и-неизменяемыми-immutable-объектами)
-- [Объясните разницу между синхронными и асинхронными функциями](#объясните-разницу-между-синхронными-и-асинхронными-функциями)
-- [Что такое цикл событий (event loop)? В чем разница между стеком вызовов (call stack) и очередью событий (task queue)? ](#что-такое-цикл-событий-event-loop-в-чем-разница-между-стеком-вызовов-call-stack-и-очередью-событий-task-queue)
-- [Объясните разницу при использовании `foo` в `function foo() {}` и `var foo = function() {}`](#объясните-разницу-при-использовании-foo-в-function-foo-и-var-foo-function)
-- [В чем различие между переменными, созданными при помощи `let`, `var` и `const`?](#в-чем-различие-между-переменными-созданными-при-помощи-let-var-и-const)
-- [В чем разница между классом в ES6 и функцией-конструктором в ES5?](#в-чем-разница-между-классом-в-es6-и-функцией-конструктором-в-es5)
-- [Можете ли вы привести пример использования стрелочных функции =>? Чем они отличаются от других функций?](#можете-ли-вы-привести-пример-использования-стрелочных-функции-чем-они-отличаются-от-других-функций)
-- [В чем преимущество использования стрелочных функций для метода в конструкторе?](#в-чем-преимущество-использования-стрелочных-функций-для-метода-в-конструкторе)
-- [Дайте определение функции высшего порядка](#дайте-определение-функции-высшего-порядка)
-- [Можете ли вы привести пример деструктуризации объекта или массива?](#можете-ли-вы-привести-пример-деструктуризации-объекта-или-массива)
-- [Шаблонные строки в ES6 намного упрощают создание строк, можете ли вы привести пример их использования?](#шаблонные-строки-в-es6-намного-упрощают-создание-строк-можете-ли-вы-привести-пример-их-использования)
-- [Можете ли вы привести пример каррированной функции (curry function) и в чем их преимущество?](#можете-ли-вы-привести-пример-каррированной-функции-curry-function-и-в-чем-их-преимущество)
-- [В чем преимущества использования spread оператора и чем он отличается от rest оператора?](#в-чем-преимущества-использования-spread-оператора-и-чем-он-отличается-от-rest-оператора)
-- [Каким образом можно обмениваться кодом между файлами?](#каким-образом-можно-обмениваться-кодом-между-файлами)
-- [Для чего используются статические члены класса?](#для-чего-используются-статические-члены-класса)
+<TOCInline toc={toc} />
 
 ### Объясните делегирование событий
 

website/i18n/tl/docusaurus-plugin-content-docs/current/css-questions.md

@@ -4,39 +4,9 @@ title: Mga Katanungan sa CSS
 
 Mga kasagutan sa [Mga Kasagutan sa Pakikipanayam sa Front-end na Trabaho - Mga Katanungan sa CSS](https://github.com/h5bp/Front-end-Developer-Interview-Questions/blob/master/src/questions/css-questions.md). Malugod na tatanggapin ang mga Pull request para sa mga suhestyon at mga koreksyon!
 
-## Talaan ng nilalaman
+import TOCInline from '@theme/TOCInline';
 
-- [Ano ang pagsisigurado ng CSS selector at kung paano ito gumagana?](#ano-ang-pagsisigurado-ng-css-selector-at-kung-paano-ito-gumagana)
-- [Ano ang pagkakaiba sa pagitan ng "pag-reset" at "pag-normalize" ng CSS? saan sa dalawa ang iyong pipiliin, at bakit?](#ano-ang-pagkakaiba-sa-pagitan-ng-pag-reset-at-pag-normalize-ng-css-saan-sa-dalawa-ang-iyong-pipiliin-at-bakit)
-- [Ilarawan ang mga `float` at kung paano sila gumagana.](#ilarawan-ang-mga-float-at-kung-paano-sila-gumagana)
-- [Ilarawan ang z-index at kung papaano nabuo ang konteksto.](iIlarawan-ang-z-index-at-kung-papaano-nabuo-ang-konteksto)
-- [Ilarawan ang BFK (Block Formatting na Konteksto) at papaaano ito gumagana.](#ilarawan-ang-bfk-block-formatting-na-konteksto-at-papaaano-ito-gumagana)
-- [Ano ang iba't ibang teknik ng paglilinis at kung ano ang nararapat sa kung ano ang konteksto?](#ano-ang-ibat-ibang-teknik-ng-paglilinis-at-kung-ano-ang-nararapat-sa-kung-ano-ang-konteksto)
-- [Ipaliwanag ang mga CSS na sprite, at papaano mo ipapatupad ang mga ito sa isang pahina o site.](#ipaliwanag-ang-mga-css-na-sprite-at-papaano-mo-ipapatupad-ang-mga-ito-sa-isang-pahina-o-site)
-- [Papaano mo didiskartehan ang pag-aayos ng mga ispisipik sa browser na pag-eestilo na isyu?](#papaano-mo-didiskartehan-ang-pag-aayos-ng-mga-ispisipik-sa-browser-na-pag-eestilo-na-isyu)
-- [Papaano mo inahahanda ang iyong mga pahina para sa mga browser na kulang sa tampok? Ano-ano ang mga teknik or proseso ang iyong ginagamit?](#papaano-mo-inahahanda-ang-iyong-mga-pahina-para-sa-mga-browser-na-kulang-sa-tampok-ano-ano-ang-mga-teknik-or-proseso-ang-iyong-ginagamit)
-- [Ano-ano ang mga iba't ibang pamamaraan upang matago ang nakatagong nilalaman (at gawan ng paraan na ito ay magagamit lamang ng mga mambabasa ng iskrin)?](#ano-ano-ang-mga-ibat-ibang-pamamaraan-upang-matago-ang-nakatagong-nilalaman-at-gawan-ng-paraan-na-ito-ay-magagamit-lamang-ng-mga-mambabasa-ng-iskrin)
-- [Ikaw ba ay nakagamit kailanman ng sistemang grid?, at kung gayon, Ano ang iyong mas pipiliin?](#ikaw-ba-ay-nakagamit-kailanman-ng-sistemang-grid-at-kung-gayon-ano-ang-iyong-mas-pipiliin)
-- [Ikaw ba ay nakagamit oh nakapagpatupad na ng mga query sa mobile o mga layout na espisipik sa mobile/CSS?](#ikaw-ba-ay-nakagamit-oh-nakapagpatupad-na-ng-mga-query-sa-mobile-o-mga-layout-na-espisipik-sa-mobilecss)
-- [Ikaw ba ay pamilyar sa estilong SVG?](#ikaw-ba-ay-pamilyar-sa-estilong-svg)
-- [Makapagbibigay kaba ng halimbawa ng klase ng @media maliban sa iskrin?](#makapagbibigay-kaba-ng-halimbawa-ng-klase-ng-media-maliban-sa-iskrin)
-- [Ano-ano ang ilan sa mga "pasabog" para sa epektibong pagsusulat ng CSS?](#ano-ano-ang-ilan-sa-mga-pasabog-para-sa-epektibong-pagsusulat-ng-css)
-- [Ano ang mga pakinabang o di-pakinabang ng paggamit ng mga preprocessors ng CSS?](#ano-ang-mga-pakinabang-o-di-pakinabang-ng-paggamit-ng-mga-preprocessors-ng-css)
-- [Ilarawan kung ano ang iyong gusto at di gusto tungkol sa CSS na mga preprocessor na iyong nagamit.](#ilarawan-kung-ano-ang-iyong-gusto-at-di-gusto-tungkol-sa-css-na-mga-preprocessor-na-iyong-nagamit)
-- [Papaano mo ipapatupad ang isang web design comp na gumagamit ng mga di pangkaraniwang font?](#papaano-mo-ipapatupad-ang-isang-web-design-comp-na-gumagamit-ng-mga-di-pangkaraniwang-font)
-- [Ipaliwanag kung paano tinutukoy ng isang browser kung anu-anong mga elemento ang tumutugma sa tagapili ng CSS.](#ipaliwanag-kung-paano-tinutukoy-ng-isang-browser-kung-anu-anong-mga-elemento-ang-tumutugma-sa-tagapili-ng-css)
-- [Ilarawan ang mga elementong pseudo at talakayin kung para saan ito gagamitin.](#ilarawan-ang-mga-elementong-pseudo-at-talakayin-kung-para-saan-ito-gagamitin)
-- [Ipaliwanag ang iyong pagkakaintindi sa modelong kahon at papaano mo pagsasabihan ang browser sa CSS na mag-render ng iyong layout sa iba't ibang modelo ng kahon.](#ipaliwanag-ang-iyong-pagkakaintindi-sa-modelong-kahon-at-papaano-mo-pagsasabihan-ang-browser-sa-css-na-mag-render-ng-iyong-layout-sa-ibat-ibang-modelo-ng-kahon)
-- [Ano ang ginagawa ng `* { box-sizing: border-box; }`? Anu-ano ang mga pakinabang nito?](#ano-ang-ginagawa-ng---box-sizing-border-box--anu-ano-ang-mga-pakinabang-nito)
-- [Ano ang katangian ng CSS na `display` at pwede ka bang magbigay ng ilang mga halimbawa ng paggamit nito?](#ano-ang-katangian-ng-css-na-display-at-pwede-ka-bang-magbigay-ng-ilang-mga-halimbawa-ng-paggamit-nito)
-- [Ano ang pagkakaiba sa pagitan ng `inline` at `inline-block`?](#ano-ang-pagkakaiba-sa-pagitan-ng-inline-at-inline-block)
-- [Ano ang pagkakaiba sa pagitan ng `relative`, `fixed`, `absolute` at elementong nakaposisyong panig sa `static`?](#ano-ang-pagkakaiba-sa-pagitan-ng-relative-fixed-absolute-at-elementong-nakaposisyong-panig-sa-static)
-- [Ano ang mga umiiral na framework ng CSS na ginamit mo ng lokal, o kaya naman ay sa produksyon? Papaano mo babaguhin o mapapabuti ang mga ito?](#ano-ang-mga-umiiral-na-framework-ng-css-na-ginamit-mo-ng-lokal-o-kaya-naman-ay-sa-produksyon-papaano-mo-babaguhin-o-mapapabuti-ang-mga-ito)
-- [Ikaw ba ay nakapaglaro na sa paligid ng bagong CSS Flexbox o Grid na specs?](#ikaw-ba-ay-nakapaglaro-na-sa-paligid-ng-bagong-css-flexbox-o-grid-na-specs)
-- [Maipapaliwanag mo ba ang kaibahan sa pagitan ng pag-code ng isang web site na tumutugon kumpara sa paggamit ng diskarteng mobile ang una?](#maipapaliwanag-mo-ba-ang-kaibahan-sa-pagitan-ng-pag-code-ng-isang-web-site-na-tumutugon-kumpara-sa-paggamit-ng-diskarteng-mobile-ang-una)
-- [Sa anong paraan naiiba ang disenyo ng tumutugon mula sa disenyo ng umaangkop?](#sa-anong-paraan-naiiba-ang-disenyo-ng-tumutugon-mula-sa-disenyo-ng-umaangkop)
-- [Ikaw ba ay nakagamit na ng mga grapikong retina? kung gayon, kelan at anu-anong mga teknik ang iyong ginamit?](#ikaw-ba-ay-nakagamit-na-ng-mga-grapikong-retina-kung-gayon-kelan-at-anu-anong-mga-teknik-ang-iyong-ginamit)
-- [May kadahilanan ba na nais mong gamitin ang `translate()` kesa sa `absolute` na pag-poposisyon, o kabaliktaran? at bakit?](#may-kadahilanan-ba-na-nais-mong-gamitin-ang-translate-kesa-sa-absolute-na-pag-poposisyon-o-kabaliktaran-at-bakit)
+<TOCInline toc={toc} />
 
 ### Ano ang pagsisigurado ng CSS selector at kung paano ito gumagana?
 

website/i18n/tl/docusaurus-plugin-content-docs/current/html-questions.md

@@ -4,19 +4,9 @@ title: Mga Tanong sa HTML
 
 Mga sagot sa [Mga Tanong sa Pakikipanayam para sa Trabahong Pangfront-end - Mga Tanong sa HTML](https://github.com/h5bp/Front-end-Developer-Interview-Questions/blob/master/src/questions/html-questions.md). Malugod naming tatanggaping ang mga pull request para sa mga mungkahi at mga koreksyon
 
-## Talaan ng nilalaman
+import TOCInline from '@theme/TOCInline';
 
-- [Ano ang ginagawa ng `DOCTYPE`?](#ano-ang-ginagawa-ng-doctype)
-- [Papaano mo ihahain ang pahinang may iba't-ibang lenggwaheng nilalaman?](#papaano-mo-ihahain-ang-pahinang-may-ibat-ibang-lenggwaheng-nilalaman)
-- [Anong uri ng mga bagay ang dapat mong ingatan ukol sa pagdidisenyo o pag-develop ng mga multilingual na site?](#anong-uri-ng-mga-bagay-ang-dapat-mong-ingatan-ukol-sa-pagdidisenyo-o-pag-develop-ng-mga-multilingual-na-site)
-- [Saan maganda ang mga `data-`na katangian?](#saan-maganda-ang-mga-data-na-katangian)
-- [Isaalang-alang ang HTML5 bilang isang bukas na web platform. Ano-ano ang mga pangunahing sangkap ng HTML5?](#isaalang-alang-ang-html5-bilang-isang-bukas-na-web-platform-ano-ano-ang-mga-pangunahing-sangkap-ng-html5)
-- [Ilarawan ang pagkakaiba sa pagitan ng isang `cookie`,`sessionStorage` at `localStorage`.](#ilarawan-ang-pagkakaiba-sa-pagitan-ng-isang-cookie-sessionstorage-at-localstorage)
-- [Ilarawan ang pagkakaiba sa pagitan ng `<script>`, `<script async>` at `<script defer>`.](#ilarawan-ang-pagkakaiba-sa-pagitan-ng-script-script-async-at-script-defer)
-- [Bakit karaniwang magandang ideya na ilagay ang mga CSS `<link>` sa pagitan ng `<head> </ head>` at JS `<script>` s bago ang `/ <body>`? May alam ka bang anumang mga pagbubukod?](#bakit-karaniwang-magandang-ideya-na-ilagay-ang-mga-css-link-sa-pagitan-ng-head-head-at-js-script-s-bago-ang-body-may-alam-ka-bang-anumang-mga-pagbubukod)
-- [Ano ang progresibong pag-render?](#ano-ang-progresibong-pag-render)
-- [Bakit ka gagamit ng isang `srcset` na katangian sa isang tag ng imahe? Ipaliwanag ang proseso na ginagamit ng browser sa pagsuri ng nilalaman ng katangiang ito.](#bakit-ka-gagamit-ng-isang-srcset-na-katangian-sa-isang-tag-ng-imahe-ipaliwanag-ang-proseso-na-ginagamit-ng-browser-sa-pagsuri-ng-nilalaman-ng-katangiang-ito)
-- [Nakagamit ka na ba ng ibang lenggwahe sa pag-template ng HTML?](#nakagamit-ka-na-ba-ng-ibang-lenggwahe-sa-pag-template-ng-html)
+<TOCInline toc={toc} />
 
 ### Ano ang ginagawa ng `DOCTYPE`?
 

website/i18n/tl/docusaurus-plugin-content-docs/current/javascript-questions.md

@@ -4,62 +4,9 @@ title: Mga Tanong sa JS
 
 Mga Sagot sa [Mga Tanong sa Pakikipanayam sa Trabahong Pangfront-end - Mga Tanong sa JS](https://github.com/h5bp/Front-end-Developer-Interview-Questions/blob/master/src/questions/javascript-questions.md). Ang mga pull request para sa mga suhestyon at koreksyon ay malugod na tatanggapin
 
-## Talaan ng nilalaman
+import TOCInline from '@theme/TOCInline';
 
-- [Ipaliwanag ang delegasyon ng kaganapan](#ipaliwanag-ang-delegasyon-ng-kaganapan)
-- [Ipaliwanag kung paano gumagana ang `this` na ito sa JavaScript](#ipaliwanag-kung-paano-gumagana-ang-this-na-ito-sa-javascript)
-- [Ipaliwanag kung paano gumagana ang prototypal na pagmamana](#ipaliwanag-kung-paano-gumagana-ang-prototypal-na-pagmamana)
-- [Ano ang iyong naiisip sa AMD laban sa CommonJS?](#ano-ang-iyong-naiisip-sa-amd-laban-sa-commonjs)
-- [Ipaliwanag kung bakit ang mga sumusunod ay hindi gumagana bilang isang IIFE: `function foo(){ }();`. Ano ang kailangang baguhin upang gawing maayos itong IIFE?](#ipaliwanag-kung-bakit-ang-mga-sumusunod-ay-hindi-gumagana-bilang-isang-iife-function-foo--ano-ang-kailangang-baguhin-upang-gawing-maayos-itong-iife)
-- [Ano ang kaibahan sa pagitan ng isang variable na: `null`, `undefined` o hindi naipahayag? Paano mo gagawin ang pag-check para sa alinman sa mga kalagayang ito?](#ano-ang-kaibahan-sa-pagitan-ng-isang-variable-na-null-undefined-o-hindi-naipahayag-paano-mo-gagawin-ang-pag-check-para-sa-alinman-sa-mga-kalagayang-ito)
-- [Ano ang pagsasara, at paano mo gagamitin ang isa sa mga ito?](#ano-ang-pagsasara-at-paano-mo-gagamitin-ang-isa-sa-mga-ito)
-- [Mailalarawan mo ba ang pangunahing pagkakaiba sa pagitan ng isang `.forEach` na loop at isang `.Map()` na loop at bakit kailangan mo lang pumili ng isa mula sa dalawa?](#mailalarawan-mo-ba-ang-pangunahing-pagkakaiba-sa-pagitan-ng-isang-foreach-na-loop-at-isang-map-na-loop-at-bakit-kailangan-mo-lang-pumili-ng-isa-mula-sa-dalawa?)
-- [Ano ang isang tipikal na kaso ng paggamit para sa mga hindi kilalang punksyon?](#ano-ang-isang-tipikal-na-kaso-ng-paggamit-para-sa-mga-hindi-kilalang-punksyon)
-- [Paano mo inaayos ang iyong code? (modular na pattern, makalumang pagmamana?)](#paano-mo-inaayos-ang-iyong-code-modular-na-pattern-makalumang-pagmamana)
-- [Ano ang pagkakaiba sa pagitan ng mga host na bagay at mga likas na bagay?](#ano-ang-pagkakaiba-sa-pagitan-ng-mga-host-na-bagay-at-mga-likas-na-bagay)
-- [Kaibahan sa pagitan ng: punksyon na `Person(){}`, `var person = Person()`, at `var person = new Person()`?](#kaibahan-sa-pagitan-ng-punksyon-na-person-var-person--person-var-person--new-person)
-- [Ano ang pagkakaiba sa pagitan ng `.call` at `.apply`?](#ano-ang-pagkakaiba-sa-pagitan-ng-call-at-apply)
-- [Ipaliwanag ang `Function.prototype.bind`.](#ipaliwanag-ang-functionprototypebind)
-- [Kelan ka gagamit ng `document.write()`?](#kelan-ka-gagamit-ng-documentwrite)
-- [Ano ang kaibahan sa pagitan ng pagtukoy na tampok, tampok na pagkakilala, at paggamit ng UA na string?](#ano-ang-kaibahan-sa-pagitan-ng-pagtukoy-na-tampok-tampok-na-pagkakilala-at-paggamit-ng-Uua-na-string)
-- [Ipaliwanag ang Ajax sa mas detalyadong pamamaraan hangga't maaari.](#ipaliwanag-ang-ajax-sa-mas-detalyadong-pamamaraan-hanggat-maaari)
-- [Ano ang mga kalamangan at di-kalamangan ng paggamit ng Ajax?](#ano-ang-mga-kalamangan-at-di-kalamangan-ng-paggamit-ng-ajax)
-- [Ipaliwanag kung papaano gumagana ang JSONP (at kung bakit hindi talaga Ajax).](#ipaliwanag-kung-papaano-gumagana-ang-jsonp-at-kung-bakit-hindi-talaga-ajax)
-- [Ikaw ba ay nakagamit na ng JavaScript sa pag-template? Kung gayon, anong mga librerya ang ginamit mo?](#ikaw-ba-ay-nakagamit-na-ng-javascript-sa-pag-template-kung-gayon-anong-mga-librerya-ang-ginamit-mo)
-- [Ipaliwanag ang "hoisting".](#ipaliwanag-ang-hoisting)
-- [Ilarawan ang kaganapan ng pagbubwak.](#ilarawan-ang-kaganapan-ng-pagbubwak)
-- [Ano ang pagkakaiba sa pagitan ng isang "katangian" at isang "propyedad"?](#ano-ang-pagkakaiba-sa-pagitan-ng-isang-katangian-at-isang-propyedad)
-- [Bakit ang pagpapalawak ng mga built-in na JavaScript na mga bagay ay hindi isang magandang ideya?](#bakit-ang-pagpapalawak-ng-mga-built-in-na-javascript-na-mga-bagay-ay-hindi-isang-magandang-ideya)
-- [Pagkakaiba sa pagitan ng kaganapan ng `pag-load` ng dokumento at dokumento ng `DOMContentLoaded` na kaganapan?](#pagkakaiba-sa-pagitan-ng-kaganapan-ng-pag-load-ng-dokumento-at-dokumento-ng-domcontentloaded-na-kaganapan)
-- [Ano ang pagkakaiba sa pagitan ng `==` at `===`?](#ano-ang-pagkakaiba-sa-pagitan-ng--at-)
-- [Ipaliwanag ang patakaran na pareho pareho dapat ang pinanggalingan tungkol sa JavaScript.](#ipaliwanag-ang-patakaran-na-pareho-pareho-dapat-ang-pinanggalingan-tungkol-sa-javascript)
-- [Paganahin ito:](#paganahin-ito)
-- [Bakit tinatawag itong isang ternary na ekspresyon, ano ang ibig sabihin ng salitang "Ternary"?](#bakit-tinatawag-itong-isang-ternary-na-ekspresyon-ano-ang-ibig-sabihin-ng-salitang-ternary)
-- [Ano ang `"use strict";`? ano ang mga bentahe at di-bentahe sa paggamit nito?](#ano-ang-use-strict-ano-ang-mga-bentahe-at-di-bentahe-sa-paggamit-nito)
-- [Gumawa ng para sa loop na mag-iterate hanggang sa 100 habang mag-ouput ng "fizz" sa multiples ng 3, "buzz" sa pagmultiplika ng 5 at "fizzbuzz" sa pagmultiplika ng 3 at 5](#gumawa-ng-para-sa-loop-na-mag-iterate-hanggang-sa-100-habang-mag-ouput-ng-fizz-sa-multiples-ng-3-buzz-sa-pagmultiplika-ng-5-at-fizzbuzz-sa-pagmultiplika-ng-3-at-5)
-- [Bakit, sa pangkalahatan, isang magandang ideya na iwanan ang pandaigdigang saklaw ng isang website bilang kung ano man ito at hindi kailanman na galawin ito?](#bakit-sa-pangkalahatan-isang-magandang-ideya-na-iwanan-ang-pandaigdigang-saklaw-ng-isang-website-bilang-kung-ano-man-ito-at-hindi-kailanman-na-galawin-ito)
-- [Bakit mo gagamitin ang isang bagay tulad ng `load` na kaganapan? Mayroon bang mga di-bentahe ang kaganapang ito? May alam ka bang anumang mga alternatibo, at bakit mo gagamitin ang mga ito?](#bakit-mo-gagamitin-ang-isang-bagay-tulad-ng-load-na-kaganapan-mayroon-bang-mga-di-bentahe-ang-kaganapang-ito-may-alam-ka-bang-anumang-mga-alternatibo-at-bakit-mo-gagamitin-ang-mga-ito)
-- [Ipaliwanag kung ano ang isang solong pahina na app at kung paano gumawa ng isang SEO-friendly.](#ipaliwanag-kung-ano-ang-isang-solong-pahina-na-app-at-kung-paano-gumawa-ng-isang-seo-friendly)
-- [Ano ang lawak ng iyong karanasan sa mga Pangako at o ang kanilang mga polyfill?](#ano-ang-lawak-ng-iyong-karanasan-sa-mga-pangako-at-o-ang-kanilang-mga-polyfill)
-- [Ano ang mga kalamangan at kahinaan ng paggamit ng mga Pangako sa halip ng mga callback?](#ano-ang-mga-kalamangan-at-kahinaan-ng-paggamit-ng-mga-pangako-sa-halip-ng-mga-callback?)
-- [Ano ang ilan sa mga pakinabang o di-pakinabang ng pagsulat ng JavaScript code sa isang wika na naka-compile sa JavaScript?](#ano-ang-ilan-sa-mga-pakinabang-o-di-pakinabang-ng-pagsulat-ng-javascript-code-sa-isang-wika-na-naka-compile-sa-javascript)
-- [Anong mga kagamitan at pamamaraan ang ginagamit mo sa pag-debug ng JavaScript na code?](#anong-mga-kagamitan-at-pamamaraan-ang-ginagamit-mo-sa-pag-debug-ng-javascript-na-code)
-- [Anong mga pag-construct ng wika ang ginagamit mo para sa pag-ulit sa mga katangian ng bagay at mga item na array?](#anong-mga-pag-construct-ng-wika-ang-ginagamit-mo-para-sa-pag-ulit-sa-mga-katangian-ng-bagay-at-mga-item-na-array)
-- [Ipaliwanag ang pagkakaiba sa pagitan ng mga bagay na nababago at hindi nababago.](#ipaliwanag-ang-pagkakaiba-sa-pagitan-ng-mga-bagay-na-nababago-at-hindi-nababago)
-- [Ipaliwanag ang pagkakaiba sa pagitan ng sabay at hindi sabay na punksiyon.](#ipaliwanag-ang-pagkakaiba-sa-pagitan-ng-sabay-at-hindi-sabay-na-punksiyon)
-- [Ano ang loop na kaganapan? Ano ang pagkakaiba sa pagitan ng call na stack at queue ng gawain?](#ano-ang-loop-na-kaganapan-ano-ang-pagkakaiba-sa-pagitan-ng-call-na-stack-at-queue-ng-gawain)
-- [Ipaliwanag ang mga pagkakaiba sa paggamit ng `foo` sa pagitan ng `function foo() {}` at `var foo = function() {}`](#ipaliwanag-ang-mga-pagkakaiba-sa-paggamit-ng-foo-sa-pagitan-ng-function-foo--at-var-foo--function-)
-- [Ano ang mga pagkakaiba sa pagitan ng mga variable na nilikha sa pamamagitan ng paggamit ng `let`,`var` o `const`?](#ano-ang-mga-pagkakaiba-sa-pagitan-ng-mga-variable-na-nilikha-sa-pamamagitan-ng-paggamit-ng-let-var-o-const)
-- [Ano ang mga pagkakaiba sa pagitan ng ES6 na class at mga ES5 na taga-construct na punksyon?](#ano-ang-mga-pagkakaiba-sa-pagitan-ng-es6-na-class-at-mga-es5-na-taga-construct-na-punksyon)
-- [May maaalok ka bang isang kaso ng paggamit para sa bagong arrow => sintaks ng punksyon? Paano naiiba ang bagong sintaks na ito sa iba pang mga punksyon?](#may-maaalok-ka-bang-isang-kaso-ng-paggamit-para-sa-bagong-arrow--sintaks-ng-punksyon-Paano-naiiba-ang-bagong-sintaks-na-ito-sa-iba-pang-mga-punksyon)
-- [Ano ang bentahe para sa paggamit ng sintaks na arrow para sa isang paraan sa isang taga-construct?](#ano-ang-bentahe-para-sa-paggamit-ng-sintaks-na-arrow-para-sa-isang-paraan-sa-isang-taga-construct)
-- [Ano ang kahulugan ng isang mas mataas na hanay na punksyon?](#ano-ang-kahulugan-ng-isang-mas-mataas-na-hanay-na-punksyon)
-- [Makapagbibigaay kaba ng isang halimbawa para sa pag-destructure ng isang bagay o isang array?](#makapagbibigaay-kaba-ng-isang-halimbawa-para-sa-pag-destructure-ng-isang-bagay-o-isang-array)
-- [Ang literal na ES6 na template ay nag-aalok ng maraming kakayahan na umangkop sa pagbuo ng mga string, maaari ka bang makapagbigay ng isang halimbawa?](#ang-literal-na-es6-na-template-ay-nag-aalok-ng-maraming-kakayahan-na-umangkop-sa-pagbuo-ng-mga-string-maaari-ka-bang-makapagbigay-ng-isang-halimbawa)
-- [Makapagbibigay kaba ng isang halimbawa ng isang punksyon na curry at kung bakit ang sintaks na ito ay nag-aalok ng isang kalamangan?](#makapagbibigay-kaba-ng-isang-halimbawa-ng-isang-punksyon-na-curry-at-kung-bakit-ang-sintaks-na-ito-ay-nag-aalok-ng-isang-kalamangan)
-- [Ano ang mga pakinabang ng paggamit ng spread na sintaks at kung paano ito naiiba mula sa rest na sintaks?](#ano-ang-mga-pakinabang-ng-paggamit-ng-spread-na-sintaks-at-kung-paano-ito-naiiba-mula-sa-rest-na-sintaks)
-- [Paano ka makakabahagi ng code sa pagitan ng mga file?](#paano-ka-makakabahagi-ng-code-sa-pagitan-ng-mga-file)
-- [Bakit gusto mong lumikha ng mga statik na miyembro ng klase?](#bakit-gusto-mong-lumikha-ng-mga-statik-na-miyembro-ng-klase)
+<TOCInline toc={toc} />
 
 ### Ipaliwanag ang delegasyon ng kaganapan
 

website/i18n/zh/docusaurus-plugin-content-docs/current/css-questions.md

@@ -4,39 +4,9 @@ title: CSS 问题
 
 本章节是[前端开发者面试问题 - CSS 部分](https://github.com/h5bp/Front-end-Developer-Interview-Questions/blob/master/src/questions/css-questions.md)的参考答案。 欢迎提出 PR 进行建议和指正！
 
-## 目录
+import TOCInline from '@theme/TOCInline';
 
-- [CSS 选择器的优先级是如何计算的？](#css-选择器的优先级是如何计算的)
-- [重置（resetting）CSS 和 标准化（normalizing）CSS 的区别是什么？你会选择哪种方式，为什么？](#重置resettingcss-和-标准化normalizingcss-的区别是什么你会选择哪种方式为什么)
-- [请阐述`Float`定位的工作原理。](#请阐述float定位的工作原理)
-- [请阐述`z-index`属性，并说明如何形成层叠上下文（stacking context）。](#请阐述z-index属性并说明如何形成层叠上下文stacking-context)
-- [请阐述块格式化上下文（Block Formatting Context）及其工作原理。](#请阐述块格式化上下文block-formatting-context及其工作原理)
-- [有哪些清除浮动的技术，都适用哪些情况？](#有哪些清除浮动的技术都适用哪些情况)
-- [请解释什么是精灵图（css sprites），以及如何实现？](#请解释什么是精灵图css-sprites以及如何实现)
-- [如何解决不同浏览器的样式兼容性问题？](#如何解决不同浏览器的样式兼容性问题)
-- [如何为功能受限的浏览器提供页面？ 使用什么样的技术和流程？](#如何为功能受限的浏览器提供页面-使用什么样的技术和流程)
-- [有什么不同的方式可以隐藏内容（使其仅适用于屏幕阅读器）？](#有什么不同的方式可以隐藏内容使其仅适用于屏幕阅读器)
-- [你使用过栅格系统吗？偏爱哪一个？](#你使用过栅格系统吗偏爱哪一个)
-- [你是否使用过媒体查询或移动优先的布局？](#你是否使用过媒体查询或移动优先的布局)
-- [你熟悉制作 SVG 吗？](#你熟悉制作-svg-吗)
-- [除了`screen`，你还能说出一个 @media 属性的例子吗？](#除了screen你还能说出一个-media-属性的例子吗)
-- [编写高效的 CSS 应该注意什么？](#编写高效的-css-应该注意什么)
-- [使用 CSS 预处理的优缺点分别是什么？](#使用-css-预处理的优缺点分别是什么)
-- [对于你使用过的 CSS 预处理，说说喜欢和不喜欢的地方？](#对于你使用过的-css-预处理说说喜欢和不喜欢的地方)
-- [如何实现一个使用非标准字体的网页设计？](#如何实现一个使用非标准字体的网页设计)
-- [解释浏览器如何确定哪些元素与 CSS 选择器匹配。](#解释浏览器如何确定哪些元素与-css-选择器匹配)
-- [描述伪元素及其用途。](#描述伪元素及其用途)
-- [说说你对盒模型的理解，以及如何告知浏览器使用不同的盒模型渲染布局。](#说说你对盒模型的理解以及如何告知浏览器使用不同的盒模型渲染布局)
-- [`* { box-sizing: border-box; }`会产生怎样的效果？](#--box-sizing-border-box-会产生怎样的效果)
-- [`display`的属性值都有哪些？](#display的属性值都有哪些)
-- [`inline`和`inline-block`有什么区别？](#inline和inline-block有什么区别)
-- [`relative`、`fixed`、`absolute`和`static`四种定位有什么区别？](#relativefixedabsolute和static四种定位有什么区别)
-- [你使用过哪些现有的 CSS 框架？你是如何改进它们的？](#你使用过哪些现有的-css-框架你是如何改进它们的)
-- [你了解 CSS Flexbox 和 Grid 吗？](#你了解-css-flexbox-和-grid-吗)
-- [请解释在编写网站时，响应式与移动优先的区别。](#请解释在编写网站时响应式与移动优先的区别)
-- [响应式设计与自适应设计有何不同？](#响应式设计与自适应设计有何不同)
-- [你有没有使用过视网膜分辨率的图形？当中使用什么技术？](#你有没有使用过视网膜分辨率的图形当中使用什么技术)
-- [什么情况下，用`translate()`而不用绝对定位？什么时候，情况相反。](#什么情况下用translate而不用绝对定位什么时候情况相反)
+<TOCInline toc={toc} />
 
 ### CSS 选择器的优先级是如何计算的？
 

website/i18n/zh/docusaurus-plugin-content-docs/current/html-questions.md

@@ -4,19 +4,9 @@ title: HTML 问题
 
 本章节是[前端开发者面试问题 - HTML 部分](https://github.com/h5bp/Front-end-Developer-Interview-Questions/blob/master/src/questions/html-questions.md)的参考答案。 欢迎提出 PR 进行建议和指正！
 
-## 目录
+import TOCInline from '@theme/TOCInline';
 
-- [`DOCTYPE`有什么用？](#doctype有什么用)
-- [如何提供包含多种语言内容的页面？](#如何提供包含多种语言内容的页面)
-- [在设计开发多语言网站时，需要留心哪些事情？](#在设计开发多语言网站时需要留心哪些事情)
-- [什么是`data-`属性？](#什么是data-属性)
-- [将 HTML5 看作成开放的网络平台，什么是 HTML5 的基本构件（building block）？](#将-html5-看作成开放的网络平台什么是-html5-的基本构件building-block)
-- [请描述`cookie`、`sessionStorage`和`localStorage`的区别。](#请描述cookiesessionstorage和localstorage的区别)
-- [请描述`<script>`、`<script async>`和`<script defer>`的区别。](#请描述scriptscript-async和script-defer的区别)
-- [为什么最好把 CSS 的`<link>`标签放在`<head></head>`之间？为什么最好把 JS 的`<script>`标签恰好放在`</body>`之前，有例外情况吗？](#为什么最好把css的link标签放在headhead之间为什么最好把js的script标签恰好放在body之前有例外情况吗)
-- [什么是渐进式渲染（progressive rendering）？](#什么是渐进式渲染progressive-rendering)
-- [为什么在`<img>`标签中使用`srcset`属性？请描述浏览器遇到该属性后的处理过程。](#为什么在img标签中使用srcset属性请描述浏览器遇到该属性后的处理过程)
-- [你有过使用不同模版语言的经历吗？](#你有过使用不同模版语言的经历吗)
+<TOCInline toc={toc} />
 
 ### `DOCTYPE`有什么用？
 

website/i18n/zh/docusaurus-plugin-content-docs/current/javascript-questions.md

@@ -4,67 +4,9 @@ title: JavaScript 问题
 
 本章节是[前端开发者面试问题 - JS 部分](https://github.com/h5bp/Front-end-Developer-Interview-Questions/blob/master/src/questions/javascript-questions.md)的参考答案。 欢迎提出 PR 进行建议和指正！
 
-## 目录
+import TOCInline from '@theme/TOCInline';
 
-- [请解释事件委托（event delegation）。](#请解释事件委托event-delegation)
-- [请简述`JavaScript`中的`this`。](#请简述javascript中的this)
-- [请解释原型继承（prototypal inheritance）的工作原理。](#请解释原型继承prototypal-inheritance的工作原理)
-- [说说你对 AMD 和 CommonJS 的了解。](#说说你对-amd-和-commonjs-的了解)
-- [请解释下面代码为什么不能用作 IIFE：`function foo(){ }();`，需要作出哪些修改才能使其成为 IIFE？](#请解释下面代码为什么不能用作-iifefunction-foo-需要作出哪些修改才能使其成为-iife)
-- [`null`、`undefined`和未声明变量之间有什么区别？如何检查判断这些状态值？](#nullundefined和未声明变量之间有什么区别如何检查判断这些状态值)
-- [什么是闭包（closure），为什么使用闭包？](#什么是闭包closure为什么使用闭包)
-- [请说明`.forEach`循环和`.map()`循环的主要区别，它们分别在什么情况下使用？](#请说明foreach循环和map循环的主要区别它们分别在什么情况下使用)
-- [匿名函数的典型应用场景是什么？](#匿名函数的典型应用场景是什么)
-- [你如何组织自己的代码？（使用模块模式（module pattern）还是经典继承（classical inheritance）？）](#你如何组织自己的代码使用模块模式module-pattern还是经典继承classical-inheritance)
-- [宿主对象（host objects）和原生对象（native objects）的区别是什么？](#宿主对象host-objects和原生对象native-objects的区别是什么)
-- [下列语句有什么区别：`function Person(){}`、`var person = Person()`和`var person = new Person()`？](#下列语句有什么区别function-personvar-person--person和var-person--new-person)
-- [`.call`和`.apply`有什么区别？](#call和apply有什么区别)
-- [请说明`Function.prototype.bind`的用法。](#请说明functionprototypebind的用法)
-- [什么时候会用到`document.write()`？](#什么时候会用到documentwrite)
-- [功能检测（feature detection）、功能推断（feature inference）和使用 UA 字符串之间有什么区别？](#功能检测feature-detection功能推断feature-inference和使用-ua-字符串之间有什么区别)
-- [请尽可能详细地解释 Ajax。](#请尽可能详细地解释-ajax)
-- [使用 Ajax 的优缺点分别是什么？](#使用ajax的优缺点分别是什么)
-- [请说明 JSONP 的工作原理，它为什么不是真正的 Ajax？](#请说明-jsonp-的工作原理它为什么不是真正的-ajax)
-- [你使用过 JavaScript 模板吗？用过什么相关的库？](#你使用过-javascript-模板吗用过什么相关的库)
-- [请解释变量提升（hoisting）。](#请解释变量提升hoisting)
-- [请描述事件冒泡。](#请描述事件冒泡)
-- [“attribute” 和 “property” 之间有什么区别？](#attribute-和-property-之间有什么区别)
-- [为什么扩展 JavaScript 内置对象是不好的做法？](#为什么扩展-javascript-内置对象是不好的做法)
-- [document 中的`load`事件和`DOMContentLoaded`事件之间的区别是什么？](#document-中的load事件和domcontentloaded事件之间的区别是什么)
-- [`==`和`===`的区别是什么？](#和的区别是什么)
-- [请解释关于 JavaScript 的同源策略。](#请解释关于-javascript-的同源策略)
-- [请使下面的语句生效：](#请使下面的语句生效)
-
-```js
-duplicate([1, 2, 3, 4, 5]); // [1,2,3,4,5,1,2,3,4,5]
-```
-
-- [请说明三元表达式中“三元”这个词代表什么？](#请说明三元表达式中三元这个词代表什么)
-- [什么是`"use strict";`？使用它有什么优缺点？](#什么是use-strict使用它有什么优缺点)
-- [创建一个循环，从 1 迭代到 100，`3`的倍数时输出 "fizz"，`5`的倍数时输出 "buzz"，同时为`3`和`5`的倍数时输出 "fizzbuzz"。](#创建一个循环从1迭代到1003的倍数时输出-fizz5的倍数时输出-buzz同时为3和5的倍数时输出-fizzbuzz)
-- [为什么不要使用全局作用域？](#为什么不要使用全局作用域)
-- [为什么要使用`load`事件？这个事件有什么缺点吗？你知道一些代替方案吗，为什么使用它们？](#为什么要使用load事件这个事件有什么缺点吗你知道一些代替方案吗为什么使用它们)
-- [请解释单页应用是什么，如何使其对 SEO 友好。](#请解释单页应用是什么如何使其对seo友好)
-- [你对 Promises 及其 polyfill 的掌握程度如何？](#你对-promises-及其-polyfill-的掌握程度如何)
-- [`Promise`代替回调函数有什么优缺点？](#promise代替回调函数有什么优缺点)
-- [用转译成 JavaScript 的语言写 JavaScript 有什么优缺点？](#用转译成-javascript-的语言写-javascript-有什么优缺点)
-- [你使用什么工具和技巧调试 JavaScript 代码？](#你使用什么工具和技巧调试-javascript-代码)
-- [你使用什么语句遍历对象的属性和数组的元素？](#你使用什么语句遍历对象的属性和数组的元素)
-- [请解释可变对象和不可变对象之间的区别。](#请解释可变对象和不可变对象之间的区别)
-- [请解释同步和异步函数之间的区别。](#请解释同步和异步函数之间的区别)
-- [什么是事件循环？调用堆栈和任务队列之间有什么区别？](#什么是事件循环调用堆栈和任务队列之间有什么区别)
-- [请解释`function foo() {}`和`var foo = function() {}`之间`foo`的用法上的区别。](#请解释function-foo-和var-foo--function-之间foo的用法上的区别)
-- [使用`let`、`var`和`const`创建变量有什么区别？](#使用letvar和const创建变量有什么区别)
-- [ES6 的类和 ES5 的构造函数有什么区别？](#es6-的类和-es5-的构造函数有什么区别)
-- [你能给出一个使用箭头函数的例子吗，箭头函数与其他函数有什么不同？](#你能给出一个使用箭头函数的例子吗箭头函数与其他函数有什么不同)
-- [在构造函数中使用箭头函数有什么好处？](#在构造函数中使用箭头函数有什么好处)
-- [高阶函数（higher-order）的定义是什么？](#高阶函数higher-order的定义是什么)
-- [请给出一个解构（destructuring）对象或数组的例子。](#请给出一个解构destructuring对象或数组的例子)
-- [ES6 的模板字符串为生成字符串提供了很大的灵活性，你可以举个例子吗？](#es6-的模板字符串为生成字符串提供了很大的灵活性你可以举个例子吗)
-- [你能举出一个柯里化函数（curry function）的例子吗？它有哪些好处？](#你能举出一个柯里化函数curry-function的例子吗它有哪些好处)
-- [使用扩展运算符（spread）的好处是什么，它与使用剩余参数语句（rest）有什么区别？](#使用扩展运算符spread的好处是什么它与使用剩余参数语句rest有什么区别)
-- [如何在文件之间共用代码？](#如何在文件之间共用代码)
-- [什么情况下会用到静态类成员？](#什么情况下会用到静态类成员)
+<TOCInline toc={toc} />
 
 ### 请解释事件委托（event delegation）。