Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Traduction de dockerize-vuejs-app #161

Merged
merged 3 commits into from
Oct 2, 2018

Conversation

maxirozay
Copy link

No description provided.

Copy link

@DaedalusDev DaedalusDev left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Bonjour,

juste une petite remarque concernant l'utilisation alternée de "on" et "nous". Je ne sais pas si il y a un style imposé (je débute ici, n'y voyez pas une agression) mais je pense qu'il serait sympa d'homogénéiser au moins au sein d'un même article.
On fait pas des documentations en "quatrains et alexandrins", ça reste du technique mais c'est plus sympa pour la lecture.

Merci.

src/v2/cookbook/dockerize-vuejs-app.md Outdated Show resolved Hide resolved

<p>Cette page est en cours de traduction. Pour nous aider, vous pouvez participer sur <a href="https://github.com/vuejs-fr/vuejs.org" target="_blank">le dépôt GitHub dédié de Vuejs-FR</a>.</p><p>So you built your first Vue.js app using the amazing [Vue.js webpack template](https://github.com/vuejs-templates/webpack) and now you really want to show off with your colleagues by demonstrating that you can also run it in a Docker container.</p>
Vous avez construit votre app Vue.js en utilisant le magnifique [Vue.js webpack template](https://github.com/vuejs-templates/webpack) et maintenant vous voulez vraiment impressionner vos collègues en montrant que vous pouvez aussi la déployer dans un container Docker.

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

  • la déployer -> l'exécuter

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Copy link
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Je suis pas sure de comment conjuguer si j'utilise le mot "build", je laisse "vous avez build" ou " vous avez buildé" ?

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Les deux propositions ne me choquent pas. Quelqu'un responsable du dépôt peut donner une préférence SVP ?

RUN npm install

# copy project files and folders to the current working directory (i.e. 'app' folder)
# copie les fichiers et dossiers du project dans le dossier de travail (par exemple : le dossier 'app')

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

i.e. je crois que c'est pour 'in exemple'

  • par exemple -> dans l'exemple

Copy link
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

En français on dit "par exemple", en tout cas je n'ai jamais entendu "dans l'exemple..." à moins que ça soit pour dire "dans l'exemple suivant".

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Je le voyais bien comme "dans l'exemple suivant". Quelqu'un confirme ou infirme svp ?

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

(par exemple : le dossier 'app')

cela me parait correct

RUN npm run build

EXPOSE 8080
CMD [ "http-server", "dist" ]
```

It may seem reduntant to first copy `package.json` and `package-lock.json` and then all project files and folders in two separate steps but there is actually [a very good reason for that](http://bitjudo.com/blog/2014/03/13/building-efficient-dockerfiles-node-dot-js/) (spoiler: it allows us to take advantage of cached Docker layers).
Il peut sembler redondant de copier `package.json` et `package-lock.json` et ensuite tous les fichiers et dossiers du projet en deux étapes différentes mais il y a [une très bonne raison pour ça](http://bitjudo.com/blog/2014/03/13/building-efficient-dockerfiles-node-dot-js/) (résumé: ça nous permet de prendre avantage des Docker layers cachés)

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

  • des Docker layers cachés -> de la mise en cache des Docker layers


```bash
docker build -t vuejs-cookbook/dockerize-vuejs-app .
```

Finally, let's run our Vue.js app in a Docker container:
Finalement, lançons notre app Vue.js dans un container Docker :

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

  • dans un container -> dans le container

Copy link
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Dans lequel? Cette phrase est veut simplement dire qu'on va utiliser un container comme en anglais ou c'est écrit "a".

src/v2/cookbook/dockerize-vuejs-app.md Outdated Show resolved Hide resolved

By leveraging the [Continuous Delivery](https://martinfowler.com/bliki/ContinuousDelivery.html) discipline we build our software in a way that it can potentially be released to production at any time. Such engineering practice is enabled by means of what is normally called [continuous delivery pipeline](https://martinfowler.com/bliki/DeploymentPipeline.html). The purpose of a continuous delivery pipeline is to split our build into stages (e.g. compilation, unit tests, integration tests, performance tests, etc.) and let each stage verify our build artifact whenever our software changes. Ultimately, each stage increases our confidence in the production readiness of our build artifact and, therefore, reduces the risk of breaking things in production (or any other environment for that matters).
En utilisant la [déploiement continue](https://martinfowler.com/bliki/ContinuousDelivery.html) on construit nos logiciels de manière à ce qu'ils peuvent potentiellement être déployer en production n'importe quand. Ces pratiques d'ingénierie sont permit grâce à ce qui est normalement appelé le [pipeline de déploiement continue](https://martinfowler.com/bliki/DeploymentPipeline.html). Le but d'un pipeline de déploiement continue est de fragmenté notre construction en plusieurs étapes (par exemple : la compilation, les tests unitaires, les tests d’intégration, les tests de performance, etc) et laissé chaque étape vérifier notre artefact de construction quand notre logiciel change. Chaque étape augmente notre confiance dans la stabilité de la construction de notre artefact, et donc, réduit le risque de casser quelque chose en production (ou n'importe quel autre environnement).

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

  • la [déploiement continue] -> l'[intégration continue]
  • qu'ils peuvent potentiellement être déployer -> qu'ils puissent potentiellement être déployés
  • d'ingénierie sont permit -> d'ingénierie sont permises
  • [pipeline de déploiement continue] -> [pipeline d'intégration continue]
  • est de fragmenté notre construction -> est de fragmenter notre build
  • les tests d’intégration -> les tests de non régression (à confirmer)
  • et laissé -> et laisser
  • artefact de construction -> build de production
  • stabilité de la construction de notre artefact -> stabilité du build


So, creating a Docker image for our Vue.js app is a good choice here because that would represent our final build artifact, the same artifact that would be verified against our continuous delivery pipeline and that could potentially be released to production with confidence.
Alors, créer une image Docker pour notre app Vue.js est une bonne chose car ça représente notre artefact de construction final, le même artefact qui va être utilisé localement pour le développement et qui peut être utilisé pour le déploiement en production avec confiance.

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

  • notre artefact de construction final -> notre build de production final
  • qui va être utilisé localement pour le développement -> qui va être vérifié par notre plateforme d'intégration continue


If your company is not into Docker and Kubernetes just yet or you simply want to get your MVP out the door, maybe dockerizing your Vue.js app is not what you need.
Si votre entreprise n'est pas encore intéressée par Docker et Kubernetes ou vous voulez simplement déployer votre MVP, peut être que votre app Vue.js n'est pas ce qu'il vous faut.

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

  • ou vous -> ou que vous
  • peut être que votre app Vue.js -> peut être que dockerizer votre app Vue.js

* hosting your SPA on [Amazon S3](https://aws.amazon.com/s3/) and serving it with [Amazon CloudFront](https://aws.amazon.com/cloudfront/) (see [this](https://serverless-stack.com/chapters/deploy-the-frontend.html) link for a detailed guide).
Il existe d'autres alternatives comme :
* utiliser une plateforme tout-en-un comme [Netlify](https://www.netlify.com/);
* héberger votre SPA sur [Amazon S3](https://aws.amazon.com/s3/) et la servir avec [Amazon CloudFront](https://aws.amazon.com/cloudfront/) (voir [ce](https://serverless-stack.com/chapters/deploy-the-frontend.html) pour un guide détaillé).

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

  • voir [ce] -> voir [ici]

@maxirozay
Copy link
Author

Salut @DaedalusDev , pour répondre à ta questions sur le "on"/"nous", je n'ai aucune idée si il y a une méthode préféré. Quand je traduit quelque chose qui à été fait par l'auteur j'utilise nous (par exemple : "nous avons fait ceci car ...") et j'utilise "on" pour tout ce qui inclut le lecteur (par exemple : "on peut utiliser ceci pour ...").

Pour "l’intégration continue" ça serait parler d'un autre sujet alors je peux pas utiliser ce terme (voir https://www.atlassian.com/continuous-delivery/ci-vs-ci-vs-cd.). J'ai utilisé "déploiement continue" pour garder les mêmes initiales pour faire que ça soit plus facile de se souvenir de ce qu'est CD.

Merci d'aider!

@DaedalusDev
Copy link

Salut @maxirozay, OK bien vu j'ai un peu mélangé, mais du coup vu que "delivery" c'est plutôt livraison, dans la plupart de la doc, je traduirai "livraison continue". Tu bosses dans une boîte qui utilise cette méthode justement ? Nous on travaille en intégration continue et j'ai de suite fait l'amalgame.

Merci à toi.

@maxirozay
Copy link
Author

J'utilise la CI aussi mais ce n'était pas de quoi l'auteur parlait. Pour "livraison continue" je suis d'accord aussi j’hésitai à le mettre mais comme je t'ai dis j'ai choisit "déploiement continue" pour garder la lettre "d" et parce que ça me parlait plus mais si livraison continue est plus correct je peux changer.

RUN npm install

# copy project files and folders to the current working directory (i.e. 'app' folder)
# copie les fichiers et dossiers du project dans le dossier de travail (par exemple : le dossier 'app')
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

  • projet

* we have split our original `Dockerfile` in multiple stages by leveraging the Docker [multi-stage builds](https://docs.docker.com/develop/develop-images/multistage-build/) feature;
* the first stage is responsible for building a production-ready artifact of our Vue.js app;
* the second stage is responsible for serving such artifact using NGINX.
Regardons qu'est-ce qu'il ce passe ici :
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

  • Regardons ce qu'il se passe ici:

* the second stage is responsible for serving such artifact using NGINX.
Regardons qu'est-ce qu'il ce passe ici :
* nous avons fragmenté notre `Dockerfile` original en plusieurs étapes en utilisant la fonction [multi-stage builds](https://docs.docker.com/develop/develop-images/multistage-build/) de Docker;
* la première étape est responsable de la création d'un artefact prêt pour la production de notre app Vue.js;
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

  • artéfact (graphie rectifiée)

Copy link
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Les deux sont juste non (https://fr.wikipedia.org/wiki/Art%C3%A9fact)? Mon correcteur me dit de ne pas mettre d'accent.

Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Les deux sont justes oui; l'un est en graphie rectifiée et l'autre non, c'est la seule différence. On a choisi de suivre la graphie rectifiée pour @vuejs-fr

Regardons qu'est-ce qu'il ce passe ici :
* nous avons fragmenté notre `Dockerfile` original en plusieurs étapes en utilisant la fonction [multi-stage builds](https://docs.docker.com/develop/develop-images/multistage-build/) de Docker;
* la première étape est responsable de la création d'un artefact prêt pour la production de notre app Vue.js;
* la deuxième étape est responsable du service de notre artefact en utilisant NGINX.
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

  • artéfact (graphie rectifiée)


By leveraging the [Continuous Delivery](https://martinfowler.com/bliki/ContinuousDelivery.html) discipline we build our software in a way that it can potentially be released to production at any time. Such engineering practice is enabled by means of what is normally called [continuous delivery pipeline](https://martinfowler.com/bliki/DeploymentPipeline.html). The purpose of a continuous delivery pipeline is to split our build into stages (e.g. compilation, unit tests, integration tests, performance tests, etc.) and let each stage verify our build artifact whenever our software changes. Ultimately, each stage increases our confidence in the production readiness of our build artifact and, therefore, reduces the risk of breaking things in production (or any other environment for that matters).
En utilisant le [déploiement continue](https://martinfowler.com/bliki/ContinuousDelivery.html) on construit nos logiciels de manière à ce qu'ils puissent potentiellement être déployés en production n'importe quand. Ces pratiques d'ingénierie sont permises grâce à ce qui est normalement appelé le [pipeline de déploiement continue](https://martinfowler.com/bliki/DeploymentPipeline.html). Le but d'un pipeline de déploiement continue est de fragmenté notre build en plusieurs étapes (par exemple : la compilation, les tests unitaires, les tests d’intégration, les tests de performance, etc) et laisser chaque étape vérifier notre artefact de build quand notre logiciel change. Chaque étape augmente notre confiance dans la stabilité du build de notre artefact, et donc, réduit le risque de casser quelque chose en production (ou n'importe quel autre environnement).
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

  • déploiement continu
  • fragmenter
  • etc.
  • artéfact (graphie rectifiée)


If you are reading this cookbook, chances are you already know why you decided to dockerize your Vue.js app. But if you simply landed on this page after hitting the Google's `I'm feeling lucky` button, let me share with you a couple of good reasons for doing that.
Si vous lisez ce tutoriel, il y a des chances que vous savez déjà pourquoi vous avez décidé de dockeriser votre app Vue.js. Mais si vous avez simplement atterrit sur cette page après avoir cliqué sur le bouton `j'ai de la chance` de Google, laissez moi partager quelques bonnes raisons de le faire.
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

  • atterri
  • laissez-moi

* Microservices
* DevOps
* DevOps (Développement Opérationnel)
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Majuscule à opérationnel?

Copy link
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Alors tout en minuscule ?

Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

J'hésite je t'avoue. Comme c'est le développement d'un acronyme, mettre des majuscules au début des mots peut être indiqué; par contre en français, il me semble que pour les acronymes, on ne mets pas de majuscules partout.

Du coup soit on laisse tel quel, soit on enlève les majuscules. D'autres avis? @haeresis @forresst @sylvainpolletvillard

Copy link
Member

@sylvainpolletvillard sylvainpolletvillard Sep 24, 2018

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

C'est le cas usuel de décrire un acronyme en mettant ses lettres en majuscule, même en français. C'est parfois utile quand c'est la seconde lettre d'un mot ou que certains mots de liaison sont omis : Société Nationale des Chemins de Fer. L'exception est quand l'acronyme est choisi pour être vocalisé, en prenant des syllabes ou en omettant des initiales de mots forts, comme Hadopi par exemple

Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Bah pour reprendre ton exemple de la S.N.C.F., sur le site de l'Académie française ils mettent en majuscule uniquement le premier mot, comme s'il s'agissait d'un nom propre multimot.

http://academie-francaise.fr/questions-de-langue#79_strong-em-sigles-et-acronymes-diffrence-genre-pluriel-em-strong

Copy link
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Donc je met "Développement opérationnel"?

Copy link
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

tandis que les français ne prennent pas cette peine

Ça reste du français "Développement opérationnel" je met une majuscule juste au début et si quelqu'un veut changer il peut toujours le faire.


By adopting the [microservices architectural style](https://martinfowler.com/microservices/), we end up building a single application as a suite of small services, each running in its own process and communicating with lightweight mechanisms. These services are built around business capabilities and independently deployable by fully automated deployment machinery.
En adoptant le [style d'architectural des microservices](https://martinfowler.com/microservices/), on finit par construire une seule application comme une suite de petits services, chaque service est lancé de manière indépendante et communique avec des mécanismes léger. Ces services sont construits autour des besoins du business et sont déployés indépendamment via des méthodes de déploiement automatisées.
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

  • légers
  • bizness (en graphie rectifée même si c'est super moche ^^)


So, delivering our Vue.js app as a Docker image helps reducing, if not removing entirely, the difference between running the service on a developer's laptop, the production environment or any environment we may think of.
livrer notre app Vue.js avec une image Docker aide à réduire, sinon supprimer totalement, les différences entre lancer le service sur l'ordinateur d'un développeur, un environnement de production ou n'importe quel autre environnement.
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Majuscule au début de la phrase? Et point à celle d'avant?


### Effects of Continuous Delivery
### Les effets du déploiement continue (Continuous Delivery)
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

  • continu

Copy link

@rspt rspt left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

J'ai oublié ça :)

type: cookbook
order: 13
---

## Simple Example
## Exemple simple
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Je mettrais juste "Exemple"

@MachinisteWeb MachinisteWeb merged commit 0349891 into vuejs-fr:master Oct 2, 2018
@MachinisteWeb
Copy link
Member

Merci pour ce travail et vos relectures !

@maxirozay maxirozay deleted the dockerize-vuejs-app branch October 2, 2018 11:19
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

6 participants