Giter Site home page Giter Site logo

reactjs / ja.react.dev Goto Github PK

View Code? Open in Web Editor NEW
243.0 23.0 171.0 154.21 MB

React documentation website in Japanese

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

License: Creative Commons Attribution 4.0 International

JavaScript 33.43% CSS 7.28% HTML 0.27% Shell 0.01% TypeScript 59.00%

ja.react.dev's Introduction

react.dev

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

以下はオリジナル(英語版)リポジトリの README です。日本語版 React ドキュメントへの貢献(翻訳・修正など)に興味がある方はこちらの Wiki ページを参照してください。

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.

ja.react.dev's People

Contributors

acdlite avatar alexkrolick avatar bvaughn avatar chenglou avatar danilowoz avatar dependabot[bot] avatar gaearon avatar harish-sethuraman avatar jimfb avatar koba04 avatar kohei-takata avatar lex111 avatar marocchino avatar mcsheffrey avatar numb86 avatar petehunt avatar potato4d avatar react-translations-bot avatar reactjs-translation-bot avatar rickhanlonii avatar robhrt7 avatar sebmarkbage avatar smikitky avatar sophiebits avatar tesseralis avatar uehaj 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  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  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

ja.react.dev's Issues

Japanese Translation Progress

For New Translators

To translate a page:

  1. Check that no one else has claimed your page in the checklist and comments below.
  2. Comment below with the name of the page you would like to translate. Take only one page at a time.
  3. Submit a PR!

Please check the style guide and word list to make sure translations are written in a consistent manner.

Also check out the Crowdin repository before starting translation of a new article. Click and open each article to see how much work has been actually done. "0%" in the index page does not mean the article has not been translated!

For Reviewers

Before starting your thorough review, please make a comment in the individual PR page so that too many duplicate suggestions/comments will not happen at the same time. "Reviewers" section at the right means "those people will review eventually".

Work List

(🏃 Work in Progress; 👀 In Review)

Core Pages

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

Basics

API Reference

Navigation

These are the navigation links that appears in the sidebar. Possibly wait until
the corresponding sections are translated to do these.

Next Steps

These are the next most important translations, ordered by importance:

Installation

Hooks

Everyone is hooked on hooks! People are really excited for these and it would be great for them to be translated.

  • Hooks (@smikitky)
    • Introducing Hooks #18
    • Hooks at a Glance #48
    • Using the State Hook #51
    • Using the Effect Hook #54
    • Rules of Hooks #64
    • Building Your Own Hooks #65
    • Hooks API Reference #130
    • Hooks FAQ #115

Warnings

These are the pages that you get when you click the links in the console (e.g. https://reactjs.org/warnings/dont-call-proptypes.html). People tend to search these, so please don't translate the error message itself.

  • Warnings (@uehaj) #50
    • dont-call-proptypes
    • invalid-aria-prop
    • legacy-factories
    • refs-must-have-owner
    • special-props
    • unknown-prop
    • invalid-hook-call-warning (new)

Advanced Guides

FAQ

Testing 🆕

Contributing

Priority: Low

Components

Components in src/components that have some text in them.

Additional Translations

These are not the primary translation targets.

  • Blog
  • Community

Establish reviewing process

Now that many people are interested in review and we have many active PRs, we should establish a written rule regarding the review process.

  • Who will take responsibility in the initial review process?
  • When a maintainer (@koba04 @potato4d @koba04) can decide to merge?

Font issue related to <em>

In some browser environments, Japanese text surrounded by <em></em> does not look different from ordinary texts. Technically speaking, this is not a bug but an intended behavior because Japanese fonts have no concept of italics. Still, we need to ensure the text is visually emphasized in some way or another, in all browsers.

Possible solutions:

  • Give up on <em> with Japanese (*あああ*) entirely, and use explicit brackets or quotation marks instead (「あああ」)
  • Add a rule in CSS and ensure <em> will somehow look different (But this also affects English text)
    • color
    • font-width
    • transform: skewX(-15deg);
  • Introduce "post-process" JavaScript code to change <em> to <strong> or <em class="bold"> only when it includes Japanese characters. Or find a way to do it during the server-side rendering process.

Decide on translation of some terms

While reference-glossary.md is helpful, translators need to agree on words that are commonly used throughout the document but are less React-specific. Let me continue this in Japanese.


1年半ほど前に書いたReact日本語版ドキュメント翻訳者用メモがあり、Crowdinの訳はだいたいそれに基づいているのですが、ちょっと幾つかの用語について不安になってきました。特に新しい人もいらっしゃっているので意見を聞ければと思います。

  • imperative code は「手続き型コード」とすべきでしょうか「命令型コード」とすべきでしょうか。Wikipediaによれば両者ほぼ同義らしいですが、個人的には「手続き型」の方に圧倒的に馴染みがあるため、そっちでもいいのかなという気もしています。
  • reconciliation と reconciler の訳についてご意見はありますか。初歩的な記事で「リコンシリエーション」を使いまくると意味不明になりそうですが、一方で、内部実装系の記事 (fiber reconcilerの新機能とか) では避けて通れない用語でもあります。最初は「突き合わせ処理 (reconciliation)」か「擦り合わせ処理 (reconciliation)」から始めて、踏み込んだ記事で「リコンシリエーション」「リコンサイラ」に移行するような感じが無難なのかなと感じています。
  • render / rendering は「レンダー」で、renderer は「レンダラ」で、それぞれ統一してよさそうでしょうか。「3音以上の語は原則伸ばさない」というJISの法則に従えば「レンダ」になるはずですが、感覚的にあまり馴染みがない感じがしています。
  • higher-order component を「高階コンポーネント」」ではなく「高次コンポーネント」とすべきというご意見の方はいらっしゃいますか。
  • render prop を「レンダープロップ」とカタカナにするのは如何でしょうか。(HoCと並んで言及されることが多いので片方だけアルファベットなのは収まりが悪いことが多く、割といつも歯がゆい感じがしています)
  • controlled component / uncontrolled component について、「制御されたコンポーネント」「非制御コンポーネント」はちょっとダサいなと思いつつも、「コントロールドコンポーネント」も長すぎるなと感じています。良い案はありますでしょうか。
  • 別の所でも書きましたが、囲み枠の見出しの訳は「Tip → ヒント」「Note → 補足」でいいでしょうか。「Note → メモ」でもいいかもしれませんが。
  • その他全般的な訳語統一に関するご意見はありますか。

Create reactjs/textlint-checker-for-react-jp-docs

I would like to create a repository for the dedicated TextLint rule package "reactjs/textlint-checker-for-react-jp-docs".

That will contribute to improving the quality of future translations.

But, we have other higher priority tasks.
Although this work may not be possible now,let's first write down the rules necessary for this Issue.

Setting up CI and test site

Currently, CircleCI doesn't run for PRs from fork repositories, so I enabled the setting.
If it doesn't cause any problems, I'd like to require status checks to pass before merging.

In addition to that, Is it helpful to enable deploy preview using Neflify like reactjs/reactjs.org?

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.