Coder Social home page Coder Social logo

reactjs / fr.react.dev Goto Github PK

View Code? Open in Web Editor NEW
89.0 15.0 161.0 150.69 MB

Version française du site de documentation officiel de React

Home Page: https://fr.react.dev

License: Creative Commons Attribution 4.0 International

JavaScript 34.52% CSS 7.63% HTML 0.29% Shell 0.01% TypeScript 57.54%

fr.react.dev's Introduction

react.dev

This repo contains the source code and documentation powering react.dev.

Getting started

Prerequisites

  1. Git
  2. Node: any 12.x version starting with v12.0.0 or greater
  3. Yarn: See Yarn website for installation instructions
  4. A fork of the repo (for any contributions)
  5. A clone of the react.dev repo on your local machine

Installation

  1. cd react.dev to go into the project root
  2. yarn to install the website's npm dependencies

Running locally

  1. yarn dev to start the development server (powered by Next.js)
  2. open http://localhost:3000 to open the site in your favorite browser

Contributing

Guidelines

The documentation is divided into several sections with a different tone and purpose. If you plan to write more than a few sentences, you might find it helpful to get familiar with the contributing guidelines for the appropriate sections.

Create a branch

  1. git checkout main from any folder in your local react.dev repository
  2. git pull origin main to ensure you have the latest main code
  3. git checkout -b the-name-of-my-branch (replacing the-name-of-my-branch with a suitable name) to create a branch

Make the change

  1. Follow the "Running locally" instructions
  2. Save the files and check in the browser
  3. Changes to React components in src will hot-reload
  4. Changes to markdown files in content will hot-reload
  5. If working with plugins, you may need to remove the .cache directory and restart the server

Test the change

  1. If possible, test any visual changes in all latest versions of common browsers, on both desktop and mobile.
  2. Run yarn check-all. (This will run Prettier, ESLint and validate types.)

Push it

  1. git add -A && git commit -m "My message" (replacing My message with a commit message, such as Fix header logo on Android) to stage and commit your changes
  2. git push my-fork-name the-name-of-my-branch
  3. Go to the react.dev repo and you should see recently pushed branches.
  4. Follow GitHub's instructions.
  5. If possible, include screenshots of visual changes. A preview build is triggered after your changes are pushed to GitHub.

Translation

If you are interested in translating react.dev, please see the current translation efforts here.

License

Content submitted to react.dev is CC-BY-4.0 licensed, as found in the LICENSE-DOCS.md file.

fr.react.dev's People

Contributors

acdlite avatar alexkrolick avatar bastiendmt avatar bvaughn avatar chenglou avatar danilowoz avatar gaearon avatar gkueny avatar jeremiepat avatar jimfb avatar juliettelofaro avatar koba04 avatar kohei-takata avatar laurerc avatar lbelavoir avatar lex111 avatar linsolas avatar marocchino avatar mustaphalimam avatar petehunt avatar reactjs-translation-bot avatar rickhanlonii avatar robinmetral avatar sophiebits avatar tdd avatar tesseralis avatar vjeux avatar yangshun avatar zpao avatar zqran avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

fr.react.dev's Issues

Consistent "analyze comment" job failure on sync PRs

Hey @gaearon!

So we're getting sync PRs again 👏 but they seem to be constructed in a way that consistently wrecks the "analyze comment" job? Unlike bundle analyses, retrying this job a few times consistently fails.

Are you seeing this on other repos? It would mean the sync PRs need to be tweaked to pass that job. Otherwise there's something fishy on our side somehow…

See https://github.com/reactjs/fr.react.dev/actions/runs/4806030381/jobs/8553073969

Best,

Ecriture inclusive => lecture pénible

Super doc ...
mais l'écriture inclusive est aussi pénible que le fait qu'il n'y ait qu'aussi peu de femme dans l'informatique.
Merci de ne pas combattre le feu par le feu.

Git conflict syntax was not removed after before in docs/handling-events file

French translation final steps!

Congrats! You all are almost done translating the React docs to French 🎉

A couple more things to do before we can mark this translation as complete:

  • Replace "reactjs.org" to "fr.reactjs.org" in the following places:
    • package.json
    • site-constants.js
    • gatsby-config.js
    • MarkdownPage (the link href in "Edit this page")
  • Change html.js to have the attribute lang="fr"
  • Go over each section in the site to:
    • Make sure there are no formatting errors (dangling markdown/html tags) or untranslated English
    • Make sure the sections and style are consistent.
  • Change the DocSearch API key. One of the maintainers needs to sign up for DocSearch

HomePage / Page d'accueil

La page d'accueil n'est pas un monolite, tous les fichiers suivant on besoin d'être traduit:

Contenus

  • /content/home/marketing/component-based.md
  • /content/home/marketing/declarative.md
  • /content/home/marketing/learn-once-write-anywhere.md
  • /content/home/examples/a-component-using-external-plugins.md
  • /content/home/examples/a-simple-component.md
  • /content/home/examples/a-stateful-component.md
  • /content/home/examples/an-application.md

Exemples
Pour les exemples, on ne traduit que les commentaires et les éventuel string affichées mais pas les noms de variables.

  • /content/home/examples/a-component-using-external-plugins.js
  • /content/home/examples/a-simple-component.js
  • /content/home/examples/a-stateful-component.js
  • /content/home/examples/an-application.js

Automation issues and questions

@gaearon Hey Dan! How's it been?

Finally kicking the FR re-translation effort into gear 🎉, yay!

We're getting weird GitHub Actions job failures due to oooold Node versions in there. Anything the docs team can fix? Also, any idea when can we expect weekly automated backport/sync PRs from upstream, as we had on the former docs?

Best,

faute de frappes "Transfert de refs"

Bonjour,
Il y a une faute de frappe dans la traduction française de la page transferts de ref.

Dans le deuxième paragraphes :

"Bien qu’une telle encapsulation soit souhaitable pour les composants applicatifs tels que FeedStory ou Comment, elle peut être gênante pour les composants hautement réutilisables, tels que FancyButton ou MyTextInput. Ces composants ont tendance à être utilisés un peu partout dans dans l’application de manière similaire à un button ou un input, et l’accès à leurs nœuds DOM peut s’avérer nécessaire pour la gestion du focus, de la sélection ou des animations."

hope it can be useful

New French Translation Progress

Liste des mainteneurs

À l’intention des nouveaux·elles traducteur·rices

Pour traduire une page :

  1. Vérifiez que personne d’autre n’a déjà pris la main dessus dans la liste de tâches et les commentaires ci-dessous.
  2. Commentez ci-dessous avec le nom de la page que vous voulez traduire. Ne traduisez qu’une page à la fois. @tdd reportera votre nom dans la liste de tâches.
  3. Envoyez une PR interne au fork et ajoutez-la à votre commentaire (@tdd reportera, pareil)

⚠️⚠️⚠️ Avant de continuer, lisez nos bonnes pratiques et le glossaire pour comprendre comment traduire au mieux divers sujets techniques et spécifiques à React.

Soyez diligent·e·s dans vos traductions ! Si vous vous apercevez que vous ne pouvez pas continuer ou juste aller au bout de votre page en cours, faites-le savoir à l'équipe pour que quelqu'un d'autre reprenne la main.

À l’intention des mainteneurs

Quand quelqu’un propose une traduction, mettez à jour cette issue avec son nom et le n° de la PR, par exemple :

Quand les PRs sont fusionnées, pensez à cocher la case de la page !

Main Content

To do before releasing as an "official" translation. Please translate these pages first.

Note that each section has an index page, which needs to be translated too.

Learn React

API Reference

Navigation and UI

We suggest to leave most of the UI translation until the end. We plan to do some invasive changes to the website folder layout and components, so postponing this until your translation is almost complete would make it easier to merge the changes from our side later. It might make sense to translate the homepage above the fold early, but leave the rest for later. As individual pages get translated, you can change the page titles in the corresponding sidebar files. Finally, when you're translating the navigation, make sure to test both desktop and mobile layouts.

  • Homepage (currently in HomeContent.js)
  • Sidebars (currently in src/sidebar*.json)
  • Top-level navigation (currently in TopNav.tsx)

When You're Ready...

After everything above is translated, add your language to deployedLanguages in Seo.tsx of the original reactjs/react.dev repository.

Secondary Content

These API pages should ideally be translated too, but they're less urgent and can be done after the others:

Optional Content

These aren't the main translation targets, but if you'd like to do them, feel free to expand the list to include their subpages:

Introducing JSX / Introduction à JSX

Fichiers

  • /content/docs/introducing-jsx.md

Recommandations
Pour les exemples, on ne traduit que les commentaires et les éventuelles string affichées mais pas les noms de variables.

Hello World / Bonjour, Monde

Fichiers

  • /content/docs/hello-world.md

Recommandations
Pour les exemples, on ne traduit que les commentaires et les éventuelles string affichées mais pas les noms de variables.

Tutoriel

Fichiers

  • /content/tutorial/tutorial.md
  • /content/tutorial/nav.yml

Recommandations
Dans le menu on ne localise que les title. On ne touche pas aux ID ni aux URL.

Pour les exemples, on ne traduit que les commentaires et les éventuelles string affichées mais pas les noms de variables.

[OLD] Legacy French Translation Progress

Liste des mainteneurs

À l’intention des nouveaux·elles traducteur·rices

Pour traduire une page :

  1. Vérifiez que personne d’autre n’a déjà pris la main dessus dans la liste de tâches et les commentaires ci-dessous.
  2. Commentez ci-dessous avec le nom de la page que vous voulez traduire. Ne traduisez qu’une page à la fois. @tdd reportera votre nom dans la liste de tâches.
  3. Envoyez une PR interne au fork et ajoutez-la à votre commentaire (@tdd reportera, pareil)

Avant de continuer, lisez nos bonnes pratiques et le glossaire pour comprendre comment traduire au mieux divers sujets techniques et spécifiques à React.

Vous pouvez vous aider des traductions existantes dans Crowdin mais attention, leur qualité est très variable. Nos propres docs ont priorité sur les choix de traduction. Assurez-vous par ailleurs de vérifier que le contenu que vous y trouvez est bien à jour par rapport au contenu actuel du site, pour éviter de traduire un truc obsolète.

Soyez diligent·e·s dans vos traductions ! Si vous vous apercevez que vous ne pouvez pas continuer ou juste aller au bout de votre page en cours, faites-le savoir à l'équipe pour que quelqu'un d'autre reprenne la main.

À l’intention des mainteneurs

Quand quelqu’un propose une traduction, mettez à jour cette issue avec son nom et le n° de la PR, par exemple :

Quand les PRs sont fusionnées, pensez à cocher la case de la page !

Pages Fondamentales

Ces pages doivent être finalisées avant toute sortie de traduction « officielle ». Merci de traduire ces pages en priorité.

Basics / Les Bases

API Reference / Référence API

Navigation

Ce sont les liens de navigation qui apparaissent dans la barre latérale. Essayez d’attendre que les sections cibles soient traduites pour mettre à jour leurs liens.

  • tutorial/nav.yml (@tdd) #81
  • docs/nav.yml (@tdd) #27 + partiels au fil des trads

Étapes suivantes

Ce sont les traductions complémentaires les plus importantes, ici par ordre décroissant de priorité :

Installation

Hooks

Tout le monde est accroc aux hooks ! Les gens sont super intéressés par ça et ce serait top pour de traduire cette partie. (Note de @tdd : la VF du blog Overreacted.io de @gaearon fait une excellente source d'inspiration, ahem…)

Warnings / Avertissements

Ce sont les pages sur lesquelles on arrive en cliquant les liens dans la console
(ex. https://reactjs.org/warnings/dont-call-proptypes.html). Les gens ont tendance à faire des recherches dessus, alors merci de ne pas traduire le message d’erreur lui-même (en tout cas pas en remplacement, mais en complément de la VO).

Advanced Guides / Guides Avancés

FAQ

Contributing / Contribuer

Priorité : Basse

Composants (@tdd) #27

Ce sont les composants dans src/components qui comportent un peu de texte.

  • CodeEditor (@tdd)
  • CodeExample (@tdd)
  • ErrorDecoder (@tdd)
  • LayoutFooter (@tdd)
  • LayoutHeader (@tdd)
  • MarkdownPage (@tdd)
  • (et y'en a davantage encore, qui ont été traduits aussi…)

Traductions complémentaires

Ce ne sont clairement pas les objectifs principaux de la traduction

🌍 Translation for faq-internals

Working on the translation for Virtual DOM and Internals 🙂

  • id: faq-internals
  • title: Virtual DOM and Internals
  • permalink: docs/faq-internals.html
  • layout: docs
  • category: FAQ

Title Case or Localized title case?

Hey @gaearon a typography question here!

React's docs use “reasonable title case” (pronouns, conjunctions, etc. are usually lowercase). This is not a de-facto English standard, but is commonplace in the press and has become widespread in English tech docs.

However, title casing is pretty foreign to other roman-letters languages, such as French.

Is this an intentional design choice that you wish roman-letters languages would preserve? Or was that a sort of reflex, and you don't mind locale-aware title casing?

French translations use the same casing as English so far, but it does feel foreign.

Let us know!

/cc @JeremiePat @shinework @tesseralis

Rendering Elements / Rendre les elements

Fichiers

  • /content/docs/rendering-elements.md

Recommandations
Pour les exemples, on ne traduit que les commentaires et les éventuelles string affichées mais pas les noms de variables.

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.