Merge pull request #412 from javascript-tutorial/sync-bf7d8bb1

Sync with upstream @ bf7d8bb

Author: HachemiH

1-js/01-getting-started/1-intro/article.md

@@ -36,9 +36,15 @@ Les termes ci-dessus sont bons à retenir, car ils sont utilisés dans les artic
 
 Les moteurs sont compliqués. Mais le fonctionnement de base est facile à comprendre.
 
+<<<<<<< HEAD
 1. Le moteur (intégré si c’est un navigateur) lit ("analyse") le script.
 2. Ensuite, il convertit ("compile") le script en langage machine.
 3. Enfin le code machine s'exécute, très rapidement.
+=======
+1. The engine (embedded if it's a browser) reads ("parses") the script.
+2. Then it converts ("compiles") the script to machine code.
+3. And then the machine code runs, pretty fast.
+>>>>>>> bf7d8bb1af3b416d393af1c15b03cb1352da1f9c
 
 Le moteur applique des optimisations à chaque étape du processus. Il surveille même le script compilé en cours d'exécution, analyse les données qui le traversent et applique des optimisations au code machine en fonction de ces informations.
 ```
@@ -47,7 +53,11 @@ Le moteur applique des optimisations à chaque étape du processus. Il surveille
 
 Le JavaScript moderne est un langage de programmation "sûr". Il ne fournit pas d'accès de bas niveau à la mémoire ou au processeur, parce qu'il a été initialement conçu pour les navigateurs qui n'en ont pas besoin.
 
+<<<<<<< HEAD
 Les fonctionnalités dépendent grandement de l'environnement qui exécute JavaScript. Par exemple, [Node.js](https://fr.wikipedia.org/wiki/Node.js) prend en charge les fonctions qui permettent à JavaScript de lire / écrire des fichiers arbitrairement, d'exécuter des requêtes réseau, etc.
+=======
+Modern JavaScript is a "safe" programming language. It does not provide low-level access to memory or the CPU, because it was initially created for browsers which do not require it.
+>>>>>>> bf7d8bb1af3b416d393af1c15b03cb1352da1f9c
 
 JavaScript intégré au navigateur peut faire tout ce qui concerne la manipulation des pages Web, l'interaction avec l'utilisateur et le serveur Web.
 
@@ -63,14 +73,19 @@ Par exemple, JavaScript dans le navigateur est capable de :
 
 Les capacités de JavaScript dans le navigateur sont limitées pour la sécurité de l'utilisateur. L'objectif est d'empêcher une page Web malveillante d'accéder à des informations privées ou de nuire aux données de l'utilisateur.
 
+<<<<<<< HEAD
 Les exemples de telles restrictions sont:
+=======
+JavaScript's abilities in the browser are limited to protect the user's safety. The aim is to prevent an evil webpage from accessing private information or harming the user's data.
+>>>>>>> bf7d8bb1af3b416d393af1c15b03cb1352da1f9c
 
 - JavaScript sur une page Web ne peut pas lire/écrire des fichiers arbitrairement sur le disque dur, les copier ou exécuter des programmes. Il n'a pas d'accès direct aux fonctions du système d'exploitation.
 
   Les navigateurs modernes lui permettent de fonctionner avec des fichiers, mais l'accès est limité et n'est fourni que si l'utilisateur effectue certaines actions, comme «déposer» un fichier dans une fenêtre de navigateur ou le sélectionner via une balise `<input>`.
 
   Il existe des moyens d’interagir avec une webcam/microphone et d’autres appareils, mais ils nécessitent une autorisation explicite de l’utilisateur. Ainsi, une page compatible avec JavaScript ne permet pas d'activer une caméra Web, d'observer l'environnement et d'envoyer les informations à la [NSA](https://fr.wikipedia.org/wiki/National_Security_Agency).
 
+<<<<<<< HEAD
 - Différents onglets / fenêtres ne se connaissent généralement pas. Parfois, ils se croisent, par exemple lorsqu'une fenêtre utilise JavaScript pour ouvrir l'autre. Mais même dans ce cas, le JavaScript d'une page ne peut pas accéder à l'autre si elle provient de sites différents (provenant d'un autre domaine, protocole ou port).
 
   C'est ce qu'on appelle la "politique de même origine" (“Same Origin Policy”). Pour contourner cette sécurité, _les deux pages_ doivent se mettre d'accord et contenir un code JavaScript spécial qui gère l'échange de données. Nous allons voir cela plus loin dans ce tutoriel.
@@ -82,6 +97,19 @@ Les exemples de telles restrictions sont:
 ![](limitations.svg)
 
 De telles limites n'existent pas si JavaScript est utilisé en dehors du navigateur, par exemple sur un serveur. Les navigateurs modernes permettent également l’installation de plug-ins / extensions susceptibles d’obtenir des autorisations étendues.
+=======
+    There are ways to interact with the camera/microphone and other devices, but they require a user's explicit permission. So a JavaScript-enabled page may not sneakily enable a web-camera, observe the surroundings and send the information to the [NSA](https://en.wikipedia.org/wiki/National_Security_Agency).
+- Different tabs/windows generally do not know about each other. Sometimes they do, for example when one window uses JavaScript to open the other one. But even in this case, JavaScript from one page may not access the other page if they come from different sites (from a different domain, protocol or port).
+
+    This is called the "Same Origin Policy". To work around that, *both pages* must agree for data exchange and must contain special JavaScript code that handles it. We'll cover that in the tutorial.
+
+    This limitation is, again, for the user's safety. A page from `http://anysite.com` which a user has opened must not be able to access another browser tab with the URL `http://gmail.com`, for example, and steal information from there.
+- JavaScript can easily communicate over the net to the server where the current page came from. But its ability to receive data from other sites/domains is crippled. Though possible, it requires explicit agreement (expressed in HTTP headers) from the remote side. Once again, that's a safety limitation.
+
+![](limitations.svg)
+
+Such limitations do not exist if JavaScript is used outside of the browser, for example on a server. Modern browsers also allow plugins/extensions which may ask for extended permissions.
+>>>>>>> bf7d8bb1af3b416d393af1c15b03cb1352da1f9c
 
 ## Qu'est-ce qui rend JavaScript unique ?
 
@@ -97,20 +125,29 @@ JavaScript est la seule technologie de navigateur qui combine ces trois élémen
 
 C’est ce qui rend JavaScript unique. C’est pourquoi c’est l’outil le plus répandu pour créer des interfaces de navigateur.
 
+<<<<<<< HEAD
 Cela dit, JavaScript permet également de créer des serveurs, des applications mobiles, etc.
+=======
+That said, JavaScript can be used to create servers, mobile applications, etc.
+>>>>>>> bf7d8bb1af3b416d393af1c15b03cb1352da1f9c
 
 ## Les langages "par dessus" JavaScript
 
 La syntaxe de JavaScript ne convient pas aux besoins de tous. Différentes personnes veulent des fonctionnalités différentes.
 
 Il faut s’y attendre, parce que les projets et les exigences sont différents pour tous.
 
+<<<<<<< HEAD
 Donc, récemment, une pléthore de nouveaux langages sont apparus, qui sont _transposés_ (convertis) en JavaScript avant leur exécution dans le navigateur.
+=======
+So, recently a plethora of new languages appeared, which are *transpiled* (converted) to JavaScript before they run in the browser.
+>>>>>>> bf7d8bb1af3b416d393af1c15b03cb1352da1f9c
 
 Les outils modernes rendent la [transpilation](https://fr.wiktionary.org/wiki/transpilation) très rapide et transparente, permettant aux développeurs de coder dans une autre langue et de la convertir automatiquement "sous le capot".
 
 Les exemples de ce genre de langages :
 
+<<<<<<< HEAD
 - [CoffeeScript](http://coffeescript.org/) est un "sucre syntaxique" pour JavaScript, il introduit une syntaxe plus courte, permettant d’écrire du code plus précis et plus clair. Habituellement, les développeurs Ruby l'aiment bien.
 - [TypeScript](http://www.typescriptlang.org/) se concentre sur l'ajout de "typage strict des données" pour simplifier le développement et la prise en charge de systèmes complexes. Il est développé par Microsoft.
 - [Flow](http://flow.org/) ajoute également la saisie de données, mais de manière différente. Développé par Facebook.
@@ -119,6 +156,16 @@ Les exemples de ce genre de langages :
 - [Kotlin](https://kotlinlang.org/docs/reference/js-overview.html) est un langage de programmation moderne, concis et sûr qui peut cibler le navigateur ou Node.
 
 Il en existe évidemment bien plus, cela dit, même si nous utilisons un de ces langages, nous devrions également connaître le langage JavaScript, pour bien comprendre ce que nous faisons.
+=======
+- [CoffeeScript](https://coffeescript.org/) is "syntactic sugar" for JavaScript. It introduces shorter syntax, allowing us to write clearer and more precise code. Usually, Ruby devs like it.
+- [TypeScript](https://www.typescriptlang.org/) is concentrated on adding "strict data typing" to simplify the development and support of complex systems. It is developed by Microsoft.
+- [Flow](https://flow.org/) also adds data typing, but in a different way. Developed by Facebook.
+- [Dart](https://www.dartlang.org/) is a standalone language that has its own engine that runs in non-browser environments (like mobile apps), but also can be transpiled to JavaScript. Developed by Google.
+- [Brython](https://brython.info/) is a Python transpiler to JavaScript that enables the writing of applications in pure Python without JavaScript.
+- [Kotlin](https://kotlinlang.org/docs/reference/js-overview.html) is a modern, concise and safe programming language that can target the browser or Node.
+
+There are more. Of course, even if we use one of these transpiled languages, we should also know JavaScript to really understand what we're doing.
+>>>>>>> bf7d8bb1af3b416d393af1c15b03cb1352da1f9c
 
 ## Résumé
 

1-js/01-getting-started/2-manuals-specifications/article.md

@@ -1,15 +1,23 @@
 
 # Manuels et spécifications
 
+<<<<<<< HEAD
 Ce livre est un *tutoriel*. Il vise à vous aider à apprendre progressivement le langage. Mais une fois que vous maîtriserez les bases, vous aurez besoin d’autres ressources.
+=======
+This book is a *tutorial*. It aims to help you gradually learn the language. But once you're familiar with the basics, you'll need other resources.
+>>>>>>> bf7d8bb1af3b416d393af1c15b03cb1352da1f9c
 
 <iframe width="560" height="315" src="https://www.youtube.com/embed/TqQs_MKMqwU" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
 
 ## Spécification
 
 [The ECMA-262 specification](https://www.ecma-international.org/publications/standards/Ecma-262.htm) contient les informations les plus détaillées et formalisées sur JavaScript. C'est elle qui définit le langage.
 
+<<<<<<< HEAD
 Une nouvelle version de la spécification est publiée chaque année. La dernière version en cours est disponible à cette adresse : <https://tc39.es/ecma262/>.
+=======
+A new specification version is released every year. Between these releases, the latest specification draft is at <https://tc39.es/ecma262/>.
+>>>>>>> bf7d8bb1af3b416d393af1c15b03cb1352da1f9c
 
 Pour en savoir plus sur les fonctionnalités à venir, y compris celles qui sont "presque standards" (appelées aussi "stage 3"), vous pouvez consulter les propositions à cette adresse : <https://github.com/tc39/proposals>.
 
@@ -19,19 +27,32 @@ De plus, si vous développez pour le navigateur, d'autres spécifications sont c
 
 - **La référence MDN (Mozilla) JavaScript** est le principal manuel avec des exemples et d’autres informations. C’est une excellente source pour obtenir des informations détaillées sur les fonctions linguistiques, les méthodes, etc.
 
+<<<<<<< HEAD
     On peut la trouver à cette adresse : <https://developer.mozilla.org/fr/docs/Web/JavaScript/Reference>.
 
   Cependant, il est souvent préférable d’utiliser une recherche sur Internet. Utilisez simplement "MDN [terme]" dans la requête, par exemple <https://google.com/search?q=MDN+parseInt> pour rechercher la fonction `parseInt`.
+=======
+    You can find it at <https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference>.
+
+Although, it's often best to use an internet search instead. Just use "MDN [term]" in the query, e.g. <https://google.com/search?q=MDN+parseInt> to search for the `parseInt` function.
+>>>>>>> bf7d8bb1af3b416d393af1c15b03cb1352da1f9c
 
 
 ## Tableaux de compatibilité
 
 JavaScript est un langage en développement, de nouvelles fonctionnalités sont ajoutées régulièrement.
 
+<<<<<<< HEAD
 Pour voir si elles sont supportées dans les moteurs, au sein des navigateurs et autres, voir :
 
 - <http://caniuse.com> - tables de prise en charge par fonctionnalité, par exemple pour voir quels moteurs supportent les fonctions de cryptographie modernes : <http://caniuse.com/#feat=cryptography>.
 - <https://kangax.github.io/compat-table> - un tableau avec les fonctionnalités linguistiques et les moteurs qui les prennent en charge ou non.
+=======
+- <https://caniuse.com> - per-feature tables of support, e.g. to see which engines support modern cryptography functions: <https://caniuse.com/#feat=cryptography>.
+- <https://kangax.github.io/compat-table> - a table with language features and engines that support those or don't support.
+
+All these resources are useful in real-life development, as they contain valuable information about language details, their support, etc.
+>>>>>>> bf7d8bb1af3b416d393af1c15b03cb1352da1f9c
 
 Toutes ces ressources sont utiles dans le quotidien des développeurs, parce qu'elles contiennent des informations précieuses sur les fonctionnalités du langage, leur support, etc.
 

1-js/01-getting-started/3-code-editors/article.md

@@ -15,9 +15,13 @@ Un IDE charge le projet (peut contenir de nombreux fichiers), permet la navigati
 Si vous n'avez pas encore pensé à sélectionner un IDE, examinez les variantes suivantes :
 
 - [Visual Studio Code](https://code.visualstudio.com/) (cross-platform, free).
+<<<<<<< HEAD
 - [WebStorm](http://www.jetbrains.com/webstorm/) pour le développement frontend et autres éditeurs de la même société si vous avez besoin de langues supplémentaires.
 
 Pour Windows, il existe également "Visual Studio", à ne pas confondre avec "Visual Studio Code ". "Visual Studio" est un éditeur payant et puissant, uniquement conçu pour Windows, bien adapté à la plate-forme .NET. C’est aussi bon en JavaScript. Il y a aussi une version gratuite [Visual Studio Community](https://www.visualstudio.com/vs/community/).
+=======
+- [WebStorm](https://www.jetbrains.com/webstorm/) (cross-platform, paid).
+>>>>>>> bf7d8bb1af3b416d393af1c15b03cb1352da1f9c
 
 La plupart des IDE sont payants, mais ont une période d'essai. Leur coût est généralement négligeable par rapport au salaire d’un développeur qualifié, alors choisissez le meilleur pour vous.
 
@@ -38,6 +42,12 @@ Les options suivantes méritent votre attention :
 - [Notepad++](https://notepad-plus-plus.org/) (Windows, gratuit).
 - [Vim](http://www.vim.org/) et [Emacs](https://www.gnu.org/software/emacs/) sont également cool, si vous savez comment les utiliser.
 
+<<<<<<< HEAD
+=======
+- [Sublime Text](http://www.sublimetext.com) (cross-platform, shareware).
+- [Notepad++](https://notepad-plus-plus.org/) (Windows, free).
+- [Vim](http://www.vim.org/) and [Emacs](https://www.gnu.org/software/emacs/) are also cool if you know how to use them.
+>>>>>>> bf7d8bb1af3b416d393af1c15b03cb1352da1f9c
 
 ## Ne discutons pas
 

1-js/02-first-steps/04-variables/3-uppercast-constant/task.md

@@ -12,13 +12,24 @@ const birthday = '18.04.1982';
 const age = someCode(birthday);
 ```
 
+<<<<<<< HEAD
 Ici nous avons une constante date `birthday` et l'`age` est calculé à partir de `birthday` avec l'aide d'un code (il n'est pas prévu pour être court, et parce que les détails n'ont pas d'importance ici).
+=======
+Here we have a constant `birthday` for the date, and also the `age` constant.
+
+The `age` is calculated from `birthday` using `someCode()`, which means a function call that we didn't explain yet (we will soon!), but the details don't matter here, the point is that `age` is calculated somehow based on the `birthday`.
+>>>>>>> bf7d8bb1af3b416d393af1c15b03cb1352da1f9c
 
 Serait-il juste d'utiliser des majuscules pour `birthday`? Pour `age`? Ou même pour les deux ?
 
 ```js
+<<<<<<< HEAD
 const BIRTHDAY = '18.04.1982'; // créer en majuscule ?
 
 const AGE = someCode(BIRTHDAY); // créer en majuscule ?
-```
+=======
+const BIRTHDAY = '18.04.1982'; // make birthday uppercase?
 
+const AGE = someCode(BIRTHDAY); // make age uppercase?
+>>>>>>> bf7d8bb1af3b416d393af1c15b03cb1352da1f9c
+```

1-js/02-first-steps/04-variables/article.md

@@ -63,7 +63,12 @@ let age = 25;
 let message = 'Hello';
 ```
 
+<<<<<<< HEAD
 Certaines personnes écrivent également de nombreuses variables comme celle-ci :
+=======
+Some people also define multiple variables in this multiline style:
+
+>>>>>>> bf7d8bb1af3b416d393af1c15b03cb1352da1f9c
 ```js no-beautify
 let user = 'John',
   age = 25,
@@ -104,6 +109,11 @@ Nous pouvons mettre n'importe quelle valeur dans la boîte.
 
 Nous pouvons aussi la changer. La valeur peut être modifiée autant de fois que nécessaire :
 
+<<<<<<< HEAD
+=======
+We can also change it as many times as we want:
+
+>>>>>>> bf7d8bb1af3b416d393af1c15b03cb1352da1f9c
 ```js run
 let message;
 
@@ -192,8 +202,13 @@ let 1a; // ne peut pas commencer avec un chiffre
 let mon-nom; // un trait d'union '-' n'est pas autorisé dans le nom
 ```
 
+<<<<<<< HEAD
 ```smart header="La casse est importante"
 Des variables nommées `pomme` and `PomMe` -- sont deux variables différentes.
+=======
+```smart header="Case matters"
+Variables named `apple` and `APPLE` are two different variables.
+>>>>>>> bf7d8bb1af3b416d393af1c15b03cb1352da1f9c
 ```
 
 ````smart header="Les lettres non latines sont autorisées mais non recommandées"
@@ -263,8 +278,12 @@ myBirthday = '01.01.2001'; // erreur, ne peut pas réaffecter la constante !
 
 Lorsqu'un programmeur est certain que la variable ne doit jamais changer, il peut utiliser `const` pour le garantir et également le montrer clairement à tout le monde.
 
+<<<<<<< HEAD
 
 ### Les constantes en majuscules
+=======
+### Uppercase constants
+>>>>>>> bf7d8bb1af3b416d393af1c15b03cb1352da1f9c
 
 Il existe une pratique répandue d’utiliser des constantes comme alias pour des valeurs difficiles à mémoriser, qui sont connues avant leur exécution.
 
@@ -293,14 +312,23 @@ Quand devrions-nous utiliser les majuscules pour une constante et quand devrions
 
 Être une "constante" signifie simplement que la valeur ne change jamais. Mais il existe des constantes connues avant l'exécution (comme une valeur hexadécimale pour le rouge), et il y a celles qui sont *calculées* en temps réel, pendant l'exécution, mais ne changent pas après l'affectation.
 
+<<<<<<< HEAD
 Par exemple :
+=======
+For instance:
+
+>>>>>>> bf7d8bb1af3b416d393af1c15b03cb1352da1f9c
 ```js
 const pageLoadTime = /* temps pris par une page Web pour charger */;
 ```
 
 La valeur de `pageLoadTime` n’est pas connue avant le chargement de la page, elle est donc nommée normalement. Mais cela reste une constante, car elle ne change pas après l’affectation.
 
+<<<<<<< HEAD
 En d'autres termes, les constantes nommées en majuscules ne sont utilisées que comme alias pour les valeurs "codées en dur".
+=======
+In other words, capital-named constants are only used as aliases for "hard-coded" values.
+>>>>>>> bf7d8bb1af3b416d393af1c15b03cb1352da1f9c
 
 ## Nommez les choses correctement