Skip to content

Commit 4ddfb57

Browse files
authored
Merge pull request #415 from HachemiH/master
Conflicts fixed after Sync with upstream @ bf7d8bb
2 parents 9fafbad + 44c5464 commit 4ddfb57

File tree

104 files changed

+427
-2584
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

104 files changed

+427
-2584
lines changed

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

Lines changed: 2 additions & 49 deletions
Original file line numberDiff line numberDiff line change
@@ -36,15 +36,9 @@ Les termes ci-dessus sont bons à retenir, car ils sont utilisés dans les artic
3636
3737
Les moteurs sont compliqués. Mais le fonctionnement de base est facile à comprendre.
3838
39-
<<<<<<< HEAD
4039
1. Le moteur (intégré si c’est un navigateur) lit ("analyse") le script.
4140
2. Ensuite, il convertit ("compile") le script en langage machine.
4241
3. Enfin le code machine s'exécute, très rapidement.
43-
=======
44-
1. The engine (embedded if it's a browser) reads ("parses") the script.
45-
2. Then it converts ("compiles") the script to machine code.
46-
3. And then the machine code runs, pretty fast.
47-
>>>>>>> bf7d8bb1af3b416d393af1c15b03cb1352da1f9c
4842
4943
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.
5044
```
@@ -53,11 +47,7 @@ Le moteur applique des optimisations à chaque étape du processus. Il surveille
5347

5448
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.
5549

56-
<<<<<<< HEAD
5750
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.
58-
=======
59-
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.
60-
>>>>>>> bf7d8bb1af3b416d393af1c15b03cb1352da1f9c
6151

6252
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.
6353

@@ -73,19 +63,14 @@ Par exemple, JavaScript dans le navigateur est capable de :
7363

7464
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.
7565

76-
<<<<<<< HEAD
7766
Les exemples de telles restrictions sont:
78-
=======
79-
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.
80-
>>>>>>> bf7d8bb1af3b416d393af1c15b03cb1352da1f9c
8167

8268
- 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.
8369

8470
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>`.
8571

8672
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).
8773

88-
<<<<<<< HEAD
8974
- 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).
9075

9176
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.
@@ -97,19 +82,6 @@ JavaScript's abilities in the browser are limited to protect the user's safety.
9782
![](limitations.svg)
9883

9984
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.
100-
=======
101-
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).
102-
- 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).
103-
104-
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.
105-
106-
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.
107-
- 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.
108-
109-
![](limitations.svg)
110-
111-
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.
112-
>>>>>>> bf7d8bb1af3b416d393af1c15b03cb1352da1f9c
11385

11486
## Qu'est-ce qui rend JavaScript unique ?
11587

@@ -125,47 +97,28 @@ JavaScript est la seule technologie de navigateur qui combine ces trois élémen
12597

12698
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.
12799

128-
<<<<<<< HEAD
129100
Cela dit, JavaScript permet également de créer des serveurs, des applications mobiles, etc.
130-
=======
131-
That said, JavaScript can be used to create servers, mobile applications, etc.
132-
>>>>>>> bf7d8bb1af3b416d393af1c15b03cb1352da1f9c
133101

134102
## Les langages "par dessus" JavaScript
135103

136104
La syntaxe de JavaScript ne convient pas aux besoins de tous. Différentes personnes veulent des fonctionnalités différentes.
137105

138106
Il faut s’y attendre, parce que les projets et les exigences sont différents pour tous.
139107

140-
<<<<<<< HEAD
141-
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.
142-
=======
143-
So, recently a plethora of new languages appeared, which are *transpiled* (converted) to JavaScript before they run in the browser.
144-
>>>>>>> bf7d8bb1af3b416d393af1c15b03cb1352da1f9c
108+
Donc, récemment, une pléthore de nouveaux langages sont apparus, qui sont _transpilés_ (convertis) en JavaScript avant leur exécution dans le navigateur.
145109

146110
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".
147111

148112
Les exemples de ce genre de langages :
149113

150-
<<<<<<< HEAD
151114
- [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.
152115
- [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.
153116
- [Flow](http://flow.org/) ajoute également la saisie de données, mais de manière différente. Développé par Facebook.
154117
- [Dart](https://www.dartlang.org/) est un langage autonome doté de son propre moteur qui s'exécute dans des environnements autres que les navigateurs (comme les applications mobiles), mais peut aussi être transpilé en JavaScript. Développé par Google.
155118
- [Brython](https://brython.info/) est un transpilateur Python vers JavaScript qui permet d'écrire des applications en Python pur sans JavaScript.
156119
- [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.
157120

158-
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.
159-
=======
160-
- [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.
161-
- [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.
162-
- [Flow](https://flow.org/) also adds data typing, but in a different way. Developed by Facebook.
163-
- [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.
164-
- [Brython](https://brython.info/) is a Python transpiler to JavaScript that enables the writing of applications in pure Python without JavaScript.
165-
- [Kotlin](https://kotlinlang.org/docs/reference/js-overview.html) is a modern, concise and safe programming language that can target the browser or Node.
166-
167-
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.
168-
>>>>>>> bf7d8bb1af3b416d393af1c15b03cb1352da1f9c
121+
Il en existe évidemment bien plus, cela dit, même si nous utilisons un de ces langages transpilés, nous devrions également connaître le langage JavaScript, pour bien comprendre ce que nous faisons.
169122

170123
## Résumé
171124

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

Lines changed: 0 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -1,23 +1,15 @@
11

22
# Manuels et spécifications
33

4-
<<<<<<< HEAD
54
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.
6-
=======
7-
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.
8-
>>>>>>> bf7d8bb1af3b416d393af1c15b03cb1352da1f9c
95

106
<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>
117

128
## Spécification
139

1410
[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.
1511

16-
<<<<<<< HEAD
1712
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/>.
18-
=======
19-
A new specification version is released every year. Between these releases, the latest specification draft is at <https://tc39.es/ecma262/>.
20-
>>>>>>> bf7d8bb1af3b416d393af1c15b03cb1352da1f9c
2113

2214
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>.
2315

@@ -27,32 +19,19 @@ De plus, si vous développez pour le navigateur, d'autres spécifications sont c
2719

2820
- **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.
2921

30-
<<<<<<< HEAD
3122
On peut la trouver à cette adresse : <https://developer.mozilla.org/fr/docs/Web/JavaScript/Reference>.
3223

3324
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`.
34-
=======
35-
You can find it at <https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference>.
36-
37-
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.
38-
>>>>>>> bf7d8bb1af3b416d393af1c15b03cb1352da1f9c
3925

4026

4127
## Tableaux de compatibilité
4228

4329
JavaScript est un langage en développement, de nouvelles fonctionnalités sont ajoutées régulièrement.
4430

45-
<<<<<<< HEAD
4631
Pour voir si elles sont supportées dans les moteurs, au sein des navigateurs et autres, voir :
4732

4833
- <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>.
4934
- <https://kangax.github.io/compat-table> - un tableau avec les fonctionnalités linguistiques et les moteurs qui les prennent en charge ou non.
50-
=======
51-
- <https://caniuse.com> - per-feature tables of support, e.g. to see which engines support modern cryptography functions: <https://caniuse.com/#feat=cryptography>.
52-
- <https://kangax.github.io/compat-table> - a table with language features and engines that support those or don't support.
53-
54-
All these resources are useful in real-life development, as they contain valuable information about language details, their support, etc.
55-
>>>>>>> bf7d8bb1af3b416d393af1c15b03cb1352da1f9c
5635

5736
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.
5837

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

Lines changed: 1 addition & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -15,13 +15,9 @@ Un IDE charge le projet (peut contenir de nombreux fichiers), permet la navigati
1515
Si vous n'avez pas encore pensé à sélectionner un IDE, examinez les variantes suivantes :
1616

1717
- [Visual Studio Code](https://code.visualstudio.com/) (cross-platform, free).
18-
<<<<<<< HEAD
19-
- [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.
18+
- [WebStorm](https://www.jetbrains.com/webstorm/) (cross-platform, payant).
2019

2120
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/).
22-
=======
23-
- [WebStorm](https://www.jetbrains.com/webstorm/) (cross-platform, paid).
24-
>>>>>>> bf7d8bb1af3b416d393af1c15b03cb1352da1f9c
2521

2622
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.
2723

@@ -37,17 +33,10 @@ En pratique, les éditeurs légers peuvent avoir beaucoup de plug-ins, y compris
3733

3834
Les options suivantes méritent votre attention :
3935

40-
- [Atom](https://atom.io/) (multiplateforme, gratuit).
4136
- [Sublime Text](http://www.sublimetext.com) (multiplateforme, payant).
4237
- [Notepad++](https://notepad-plus-plus.org/) (Windows, gratuit).
4338
- [Vim](http://www.vim.org/) et [Emacs](https://www.gnu.org/software/emacs/) sont également cool, si vous savez comment les utiliser.
4439

45-
<<<<<<< HEAD
46-
=======
47-
- [Sublime Text](http://www.sublimetext.com) (cross-platform, shareware).
48-
- [Notepad++](https://notepad-plus-plus.org/) (Windows, free).
49-
- [Vim](http://www.vim.org/) and [Emacs](https://www.gnu.org/software/emacs/) are also cool if you know how to use them.
50-
>>>>>>> bf7d8bb1af3b416d393af1c15b03cb1352da1f9c
5140

5241
## Ne discutons pas
5342

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

Lines changed: 4 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -12,24 +12,14 @@ const birthday = '18.04.1982';
1212
const age = someCode(birthday);
1313
```
1414

15-
<<<<<<< HEAD
16-
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).
17-
=======
18-
Here we have a constant `birthday` for the date, and also the `age` constant.
15+
Ici, nous avons une constante `birthday` pour la date de naissance, ainsi que la constante `age`.
1916

20-
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`.
21-
>>>>>>> bf7d8bb1af3b416d393af1c15b03cb1352da1f9c
17+
L'`age` est calculé à partir de `birthday` en utilisant `someCode()`, ce qui signifie un appel de fonction que nous n'avons pas encore expliqué (nous le ferons bientôt !), mais les détails n'ont pas d'importance ici, le fait est que l'`age` est calculé d'une manière ou d'une autre en fonction de la date de naissance `birthday`.
2218

2319
Serait-il juste d'utiliser des majuscules pour `birthday`? Pour `age`? Ou même pour les deux ?
2420

2521
```js
26-
<<<<<<< HEAD
27-
const BIRTHDAY = '18.04.1982'; // créer en majuscule ?
22+
const BIRTHDAY = '18.04.1982'; // mettre l'anniversaire en majuscule ?
2823

29-
const AGE = someCode(BIRTHDAY); // créer en majuscule ?
30-
=======
31-
const BIRTHDAY = '18.04.1982'; // make birthday uppercase?
32-
33-
const AGE = someCode(BIRTHDAY); // make age uppercase?
34-
>>>>>>> bf7d8bb1af3b416d393af1c15b03cb1352da1f9c
24+
const AGE = someCode(BIRTHDAY); // mettre l'âge en majuscule ?
3525
```

0 commit comments

Comments
 (0)