mirror of
https://github.com/freeCodeCamp/freeCodeCamp.git
synced 2026-05-28 18:26:54 +00:00
chore(i18n,docs): processed translations (#48802)
This commit is contained in:
camperbot
@@ -51,8 +51,8 @@ There are a few steps to take in order to allow the codebase to build in your de
|
||||
|
||||
First, visit the `config/i18n.ts` file to add the language to the list of available languages and configure the values. There are several objects here.
|
||||
|
||||
- `availableLangs`: For both the `client` and `curriculum` arrays, add the text name of the language. This is the value that will be used in the `.env` file later.
|
||||
- `auditedCerts`: Add the text name of the language as the _key_, and add an array of `SuperBlocks.{cert}` variables as the _value_. This tells the client which certifications are fully translated.
|
||||
- `Languages`: Add the new language to `Languages` enum, similar to the others. The string value here will be used in the `.env` file to set a build language later.
|
||||
- `availableLangs`: Add the new property from the `Languages` enum to both the `client` and `curriculum` arrays.
|
||||
- `i18nextCodes`: These are the ISO language codes for each language. You will need to add the appropriate ISO code for the language you are enabling. These do need to be unique for each language.
|
||||
- `LangNames`: These are the display names for the language selector in the navigation menu.
|
||||
- `LangCodes`: These are the language codes used for formatting dates and numbers. These should be Unicode CLDR codes instead of ISO codes.
|
||||
@@ -62,78 +62,53 @@ First, visit the `config/i18n.ts` file to add the language to the list of availa
|
||||
As an example, if you wanted to enable Dothraki as a language, your `i18n.ts` objects should look like this:
|
||||
|
||||
```js
|
||||
export const availableLangs = {
|
||||
client: ['english', 'espanol', 'chinese', 'chinese-traditional', 'dothraki'],
|
||||
curriculum: [
|
||||
'english',
|
||||
'espanol',
|
||||
'chinese',
|
||||
'chinese-traditional',
|
||||
'dothraki'
|
||||
]
|
||||
};
|
||||
export enum Languages {
|
||||
English = 'english',
|
||||
Espanol = 'espanol',
|
||||
Chinese = 'chinese',
|
||||
ChineseTrandational = 'chinese-traditional',
|
||||
Dothraki = 'dothraki'
|
||||
}
|
||||
|
||||
export const auditedCerts = {
|
||||
espanol: [
|
||||
SuperBlocks.RespWebDesign,
|
||||
SuperBlocks.JsAlgoDataStruct,
|
||||
SuperBlocks.FrontEndDevLibs,
|
||||
SuperBlocks.DataVis,
|
||||
SuperBlocks.BackEndDevApis
|
||||
export const availableLangs = {
|
||||
client: [
|
||||
Languages.English,
|
||||
Languages.Espanol,
|
||||
Languages.Chinese,
|
||||
Languages.ChineseTrandational,
|
||||
Languages.Dothraki
|
||||
],
|
||||
chinese: [
|
||||
SuperBlocks.RespWebDesign,
|
||||
SuperBlocks.JsAlgoDataStruct,
|
||||
SuperBlocks.FrontEndDevLibs,
|
||||
SuperBlocks.DataVis,
|
||||
SuperBlocks.BackEndDevApis,
|
||||
SuperBlocks.QualityAssurance,
|
||||
SuperBlocks.SciCompPy,
|
||||
SuperBlocks.DataAnalysisPy,
|
||||
SuperBlocks.InfoSec,
|
||||
SuperBlocks.MachineLearningPy
|
||||
],
|
||||
'chinese-traditional': [
|
||||
SuperBlocks.RespWebDesign,
|
||||
SuperBlocks.JsAlgoDataStruct,
|
||||
SuperBlocks.FrontEndDevLibs,
|
||||
SuperBlocks.DataVis,
|
||||
SuperBlocks.BackEndDevApis,
|
||||
SuperBlocks.QualityAssurance,
|
||||
SuperBlocks.SciCompPy,
|
||||
SuperBlocks.DataAnalysisPy,
|
||||
SuperBlocks.InfoSec,
|
||||
SuperBlocks.MachineLearningPy
|
||||
],
|
||||
dothraki: [
|
||||
SuperBlocks.RespWebDesign,
|
||||
SuperBlocks.JsAlgoDataStruct,
|
||||
SuperBlocks.FrontEndDevLibs
|
||||
curriculum: [
|
||||
Languages.English,
|
||||
Languages.Espanol,
|
||||
Languages.Chinese,
|
||||
Languages.ChineseTrandational,
|
||||
Languages.Dothraki
|
||||
]
|
||||
};
|
||||
|
||||
export const i18nextCodes = {
|
||||
english: 'en',
|
||||
espanol: 'es',
|
||||
chinese: 'zh',
|
||||
'chinese-traditional': 'zh-Hant',
|
||||
dothraki: 'mis'
|
||||
[Languages.English]: 'en',
|
||||
[Languages.Espanol]: 'es',
|
||||
[Languages.Chinese]: 'zh',
|
||||
[Languages.ChineseTrandational]: 'zh-Hant',
|
||||
[Languages.Dothraki]: 'mis'
|
||||
};
|
||||
|
||||
export enum LangNames = {
|
||||
english: 'English',
|
||||
espanol: 'Español',
|
||||
chinese: '中文（簡體字）',
|
||||
'chinese-traditional': '中文（繁體字）',
|
||||
dothraki: 'Dothraki'
|
||||
[Languages.English]: 'English',
|
||||
[Languages.Espanol]: 'Español',
|
||||
[Languages.Chinese]: '中文（簡體字）',
|
||||
[Languages.ChineseTrandational]: '中文（繁體字）',
|
||||
[Languages.Dothraki]: 'Dothraki'
|
||||
};
|
||||
|
||||
export enum LangCodes = {
|
||||
english: 'en-US',
|
||||
espanol: 'es-419',
|
||||
chinese: 'zh',
|
||||
'chinese-traditional': 'zh-Hant',
|
||||
dothraki: 'mis'
|
||||
[Languages.English]: 'en-US',
|
||||
[Languages.Espanol]: 'es-419',
|
||||
[Languages.Chinese]: 'zh',
|
||||
[Languages.ChineseTrandational]: 'zh-Hant',
|
||||
[Languages.Dothraki]: 'mis'
|
||||
};
|
||||
|
||||
export const hiddenLangs = ['dothraki'];
|
||||
@@ -143,6 +118,71 @@ export const rtlLangs = [''];
|
||||
|
||||
> [!NOTE] When a language has been set up in the deployment pipeline AND has a public `/news` instance live, it can be removed from the `hiddenLangs` array and be made available to the public.
|
||||
|
||||
### Configure the Language Superblock Order
|
||||
|
||||
In the [config/superblock-order.ts](https://github.com/freeCodeCamp/freeCodeCamp/blob/main/config/superblock-order.ts) file, you need to set the order and state of all the superblocks for the new language in the `superBlockOrder` object. Copy one of the language keys and all its values, paste it to the bottom of the object (or wherever), and change the key to your new language from the `Languages` enum.
|
||||
|
||||
```js
|
||||
export const superBlockOrder: SuperBlockOrder = {
|
||||
...
|
||||
[Languages.Dothraki]: {
|
||||
[CurriculumMaps.Landing]: [
|
||||
SuperBlocks.RespWebDesignNew,
|
||||
SuperBlocks.JsAlgoDataStruct,
|
||||
SuperBlocks.FrontEndDevLibs,
|
||||
SuperBlocks.DataVis,
|
||||
SuperBlocks.RelationalDb,
|
||||
SuperBlocks.BackEndDevApis,
|
||||
SuperBlocks.QualityAssurance,
|
||||
SuperBlocks.SciCompPy,
|
||||
SuperBlocks.DataAnalysisPy,
|
||||
SuperBlocks.InfoSec,
|
||||
SuperBlocks.MachineLearningPy
|
||||
],
|
||||
[CurriculumMaps.Learn]: {
|
||||
[TranslationStates.Audited]: {
|
||||
[SuperBlockStates.Current]: [
|
||||
SuperBlocks.RespWebDesignNew,
|
||||
SuperBlocks.JsAlgoDataStruct,
|
||||
SuperBlocks.FrontEndDevLibs,
|
||||
SuperBlocks.DataVis,
|
||||
SuperBlocks.RelationalDb,
|
||||
SuperBlocks.BackEndDevApis,
|
||||
SuperBlocks.QualityAssurance,
|
||||
SuperBlocks.SciCompPy,
|
||||
SuperBlocks.DataAnalysisPy,
|
||||
SuperBlocks.InfoSec,
|
||||
SuperBlocks.MachineLearningPy,
|
||||
SuperBlocks.CodingInterviewPrep
|
||||
],
|
||||
[SuperBlockStates.New]: [],
|
||||
[SuperBlockStates.Upcoming]: [SuperBlocks.JsAlgoDataStructNew],
|
||||
[SuperBlockStates.Legacy]: [SuperBlocks.RespWebDesign]
|
||||
},
|
||||
[TranslationStates.NotAudited]: {
|
||||
[SuperBlockStates.Current]: [],
|
||||
[SuperBlockStates.New]: [],
|
||||
[SuperBlockStates.Upcoming]: [],
|
||||
[SuperBlockStates.Legacy]: []
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
The order of the superblocks in this object is how they appear on the "Landing" page and "Learn" maps. Follow the comments in that file so you know how you are allowed to order the superblocks, then move them to their proper places for the new language.
|
||||
|
||||
> [!ATTENTION] Do not change the order of any of the keys in the object, just move the superblocks to the different arrays
|
||||
|
||||
The `CurriculumMaps.Landing` array should contain exactly one superblock for all our current certifications, and the `CurriculumMaps.Learn` object should have all existing superblocks in it. Translated superblocks go in `TranslationStates.Audited` and non-translated superblocks go in `TranslationStates.NotAudited`. Each of those two objects has four different states a superblock can be in.
|
||||
|
||||
- `SuperBlockStates.Current`: Means that the superblock is current, `(New) Responsive Web Design` for example.
|
||||
- `SuperBlockStates.New`: These only show up when `SHOW_NEW_CURRICULUM` is set to `true` in your `.env` file. It is for displaying new superblocks on a specific build. For example, when we released the new RWD, we only showed in on English to start.
|
||||
- `SuperBlockStates.Upcoming`: These only show up when `SHOW_UPCOMING_CHANGES` is set to `true` in your `.env` file. It is to show superblocks locally while they are in development. Or, if you just need to hide a superblock from the map for some other reason.
|
||||
- `SuperBlockStates.Legacy`: A superblock is moved here when a newer version of that superblock has been fully translated and replaced it.
|
||||
|
||||
### Configure Search
|
||||
|
||||
Next, open the `client/src/utils/algolia-locale-setup.ts` file. This data is used for the search bar that loads `/news` articles. While it is unlikely that you are going to test this functionality, missing the data for your language can lead to errors when attempting to build the codebase locally.
|
||||
|
||||
Add an object for your language to the `algoliaIndices` object. You should use the the same values as the `english` object for local testing, replacing the `english` key with your language's `availableLangs` value.
|
||||
@@ -176,30 +216,6 @@ const algoliaIndices = {
|
||||
};
|
||||
```
|
||||
|
||||
### Releasing a Superblock
|
||||
|
||||
After a superblock has been fully translated into a language, there are two steps to release it. First add the superblock enum to that language's `auditedCerts` array. So, if you want to release the new Responsive Web Design superblock for Dothraki, the array should look like this:
|
||||
|
||||
```ts
|
||||
export const auditedCerts = {
|
||||
// other languages
|
||||
dothraki: [
|
||||
SuperBlocks.RespWebDesignNew, // the newly translated superblock
|
||||
SuperBlocks.RespWebDesign,
|
||||
SuperBlocks.JsAlgoDataStruct,
|
||||
SuperBlocks.FrontEndDevLibs
|
||||
]
|
||||
};
|
||||
```
|
||||
|
||||
Finally, if the superblock is in a "new" state (that is, replacing a legacy superblock), the `languagesWithAuditedBetaReleases` array should be updated to include the new language like this:
|
||||
|
||||
```ts
|
||||
export const languagesWithAuditedBetaReleases: ['english', 'dothraki'];
|
||||
```
|
||||
|
||||
This will move the new superblock to the correct place in the curriculum map on `/learn`.
|
||||
|
||||
## Enabling Localized Videos
|
||||
|
||||
For the video challenges, you need to change a few things. First add the new locale to the GraphQL query in the `client/src/templates/Challenges/video/Show.tsx` file. For example, adding Dothraki to the query:
|
||||
|
||||
@@ -80,7 +80,7 @@ Some community members also develop on Windows 10 natively with Git for Windows
|
||||
|
||||
| Prerequisite | Version | Notes |
|
||||
| --------------------------------------------------------------------------------------------- | ------- | ------------------------------------------------------------------------------------------- |
|
||||
| [Node.js](http://nodejs.org) | `16.x` | We use the "Active LTS" version, See [LTS Schedule](https://nodejs.org/en/about/releases/). |
|
||||
| [Node.js](http://nodejs.org) | `18.x` | We use the "Active LTS" version, See [LTS Schedule](https://nodejs.org/en/about/releases/). |
|
||||
| npm (comes bundled with Node) | `8.x` | We use the version bundled with Node.js Active LTS. |
|
||||
| [MongoDB Community Server](https://docs.mongodb.com/manual/administration/install-community/) | `4.2.x` | - |
|
||||
|
||||
|
||||
@@ -17,8 +17,8 @@ Let's understand how the i18n frameworks and tooling work.
|
||||
Most of files for translating the platform are located in the [`client/i18n`](https://github.com/freeCodeCamp/freeCodeCamp/tree/main/client/i18n) folder. Each language has a directory within that containing JSON files with the translations.
|
||||
|
||||
```console
|
||||
config/i18n
|
||||
└── all-langs.ts
|
||||
config
|
||||
└── i18n.ts
|
||||
...
|
||||
client/i18n
|
||||
├── configForTests.js
|
||||
@@ -29,37 +29,33 @@ Most of files for translating the platform are located in the [`client/i18n`](ht
|
||||
│ │ ├── links.json
|
||||
│ │ ├── meta-tags.json
|
||||
│ │ ├── motivation.json
|
||||
│ │ ├── translations.json
|
||||
│ │ └── trending.json
|
||||
│ │ └── translations.json
|
||||
... ...
|
||||
│ ├── dothraki
|
||||
│ │ ├── intro.json
|
||||
│ │ ├── links.json
|
||||
│ │ ├── meta-tags.json
|
||||
│ │ ├── motivation.json
|
||||
│ │ ├── translations.json
|
||||
│ │ └── trending.json
|
||||
│ │ └── translations.json
|
||||
... ...
|
||||
│ ├── english
|
||||
│ │ ├── intro.json
|
||||
│ │ ├── links.json
|
||||
│ │ ├── meta-tags.json
|
||||
│ │ ├── motivation.json
|
||||
│ │ ├── translations.json
|
||||
│ │ └── trending.json
|
||||
│ │ └── translations.json
|
||||
│ └── espanol
|
||||
│ ├── intro.json
|
||||
│ ├── links.json
|
||||
│ ├── meta-tags.json
|
||||
│ ├── motivation.json
|
||||
│ ├── translations.json
|
||||
│ └── trending.json
|
||||
│ └── translations.json
|
||||
├── locales.test.js
|
||||
├── schema-validation.js
|
||||
└── validate-keys.ts
|
||||
```
|
||||
|
||||
Some of these files are translated on our translation platform (Crowdin), some are not.
|
||||
Some of these files are translated on our translation platform (Crowdin), some are translated or created via PR's on GitHub.
|
||||
|
||||
**Files translated on our translation platform:**
|
||||
|
||||
@@ -73,28 +69,27 @@ Some of these files are translated on our translation platform (Crowdin), some a
|
||||
|
||||
- The `motivation.json` files are not required to have the same quotes, compliments, or array length. Just the same JSON structure.
|
||||
|
||||
- The `trending.json` file contains the titles and links for the trending news articles in the website's footer.
|
||||
|
||||
- The `meta-tags.json` file contains the information for our website's meta tag information.
|
||||
|
||||
Changes to these files are typically done by the staff team. If you see something out of the ordinary we recommend you reach us in the [contributors chat room](https://discord.gg/PRyKn3Vbay).
|
||||
|
||||
## Testing the client app in a world language
|
||||
|
||||
You can test the client app in any language available in the [list of languages here](https://github.com/freeCodeCamp/freeCodeCamp/blob/main/config/i18n/all-langs.ts).
|
||||
You can test the client app in any language available in the [list of `availableLangs` here](https://github.com/freeCodeCamp/freeCodeCamp/blob/main/config/i18n.ts).
|
||||
|
||||
```js
|
||||
export const availableLangs = {
|
||||
export const availableLangs = {
|
||||
client: [
|
||||
'english',
|
||||
'espanol',
|
||||
'chinese',
|
||||
'chinese-traditional',
|
||||
'italian',
|
||||
'portuguese',
|
||||
'ukrainian',
|
||||
'japanese',
|
||||
'german'
|
||||
Languages.English,
|
||||
Languages.Espanol,
|
||||
Languages.Chinese,
|
||||
Languages.ChineseTrandational,
|
||||
Languages.Italian,
|
||||
Languages.Portuguese,
|
||||
Languages.Ukrainian,
|
||||
Languages.Japanese,
|
||||
Languages.German,
|
||||
Languages.Arabic
|
||||
],
|
||||
...
|
||||
};
|
||||
@@ -102,11 +97,11 @@ You can test the client app in any language available in the [list of languages
|
||||
|
||||
If you are testing a new language, create a folder with the language name as the title next to the other languages and copy the JSON files from another language into your new folder.
|
||||
|
||||
Add the language to the `client` array as seen above in the [`config/i18n/all-langs.ts`](https://github.com/freeCodeCamp/freeCodeCamp/blob/main/config/i18n/all-langs.ts) file.
|
||||
Add the new language to the `Languages` enum and the `client` array at the top of the [`config/i18n.ts`](https://github.com/freeCodeCamp/freeCodeCamp/blob/main/config/i18n.ts) file.
|
||||
|
||||
Next, follow the instructions in the comments in the same file to add/update the rest of the variables as needed.
|
||||
|
||||
Finally, set the `CLIENT_LOCALE` variable in your `.env` file to the locale you want to build and you're ready.
|
||||
Finally, set the `CLIENT_LOCALE` variable in your `.env` file to the string of the locale you want to build from the `Languages` enum in the above file.
|
||||
|
||||
## How to Structure Components
|
||||
|
||||
|
||||
@@ -51,8 +51,8 @@ There are a few steps to take in order to allow the codebase to build in your de
|
||||
|
||||
First, visit the `config/i18n.ts` file to add the language to the list of available languages and configure the values. There are several objects here.
|
||||
|
||||
- `availableLangs`: For both the `client` and `curriculum` arrays, add the text name of the language. This is the value that will be used in the `.env` file later.
|
||||
- `auditedCerts`: Add the text name of the language as the _key_, and add an array of `SuperBlocks.{cert}` variables as the _value_. This tells the client which certifications are fully translated.
|
||||
- `Languages`: Add the new language to `Languages` enum, similar to the others. The string value here will be used in the `.env` file to set a build language later.
|
||||
- `availableLangs`: Add the new property from the `Languages` enum to both the `client` and `curriculum` arrays.
|
||||
- `i18nextCodes`: These are the ISO language codes for each language. You will need to add the appropriate ISO code for the language you are enabling. These do need to be unique for each language.
|
||||
- `LangNames`: These are the display names for the language selector in the navigation menu.
|
||||
- `LangCodes`: These are the language codes used for formatting dates and numbers. These should be Unicode CLDR codes instead of ISO codes.
|
||||
@@ -62,78 +62,53 @@ First, visit the `config/i18n.ts` file to add the language to the list of availa
|
||||
As an example, if you wanted to enable Dothraki as a language, your `i18n.ts` objects should look like this:
|
||||
|
||||
```js
|
||||
export const availableLangs = {
|
||||
client: ['english', 'espanol', 'chinese', 'chinese-traditional', 'dothraki'],
|
||||
curriculum: [
|
||||
'english',
|
||||
'espanol',
|
||||
'chinese',
|
||||
'chinese-traditional',
|
||||
'dothraki'
|
||||
]
|
||||
};
|
||||
export enum Languages {
|
||||
English = 'english',
|
||||
Espanol = 'espanol',
|
||||
Chinese = 'chinese',
|
||||
ChineseTrandational = 'chinese-traditional',
|
||||
Dothraki = 'dothraki'
|
||||
}
|
||||
|
||||
export const auditedCerts = {
|
||||
espanol: [
|
||||
SuperBlocks.RespWebDesign,
|
||||
SuperBlocks.JsAlgoDataStruct,
|
||||
SuperBlocks.FrontEndDevLibs,
|
||||
SuperBlocks.DataVis,
|
||||
SuperBlocks.BackEndDevApis
|
||||
export const availableLangs = {
|
||||
client: [
|
||||
Languages.English,
|
||||
Languages.Espanol,
|
||||
Languages.Chinese,
|
||||
Languages.ChineseTrandational,
|
||||
Languages.Dothraki
|
||||
],
|
||||
chinese: [
|
||||
SuperBlocks.RespWebDesign,
|
||||
SuperBlocks.JsAlgoDataStruct,
|
||||
SuperBlocks.FrontEndDevLibs,
|
||||
SuperBlocks.DataVis,
|
||||
SuperBlocks.BackEndDevApis,
|
||||
SuperBlocks.QualityAssurance,
|
||||
SuperBlocks.SciCompPy,
|
||||
SuperBlocks.DataAnalysisPy,
|
||||
SuperBlocks.InfoSec,
|
||||
SuperBlocks.MachineLearningPy
|
||||
],
|
||||
'chinese-traditional': [
|
||||
SuperBlocks.RespWebDesign,
|
||||
SuperBlocks.JsAlgoDataStruct,
|
||||
SuperBlocks.FrontEndDevLibs,
|
||||
SuperBlocks.DataVis,
|
||||
SuperBlocks.BackEndDevApis,
|
||||
SuperBlocks.QualityAssurance,
|
||||
SuperBlocks.SciCompPy,
|
||||
SuperBlocks.DataAnalysisPy,
|
||||
SuperBlocks.InfoSec,
|
||||
SuperBlocks.MachineLearningPy
|
||||
],
|
||||
dothraki: [
|
||||
SuperBlocks.RespWebDesign,
|
||||
SuperBlocks.JsAlgoDataStruct,
|
||||
SuperBlocks.FrontEndDevLibs
|
||||
curriculum: [
|
||||
Languages.English,
|
||||
Languages.Espanol,
|
||||
Languages.Chinese,
|
||||
Languages.ChineseTrandational,
|
||||
Languages.Dothraki
|
||||
]
|
||||
};
|
||||
|
||||
export const i18nextCodes = {
|
||||
english: 'en',
|
||||
espanol: 'es',
|
||||
chinese: 'zh',
|
||||
'chinese-traditional': 'zh-Hant',
|
||||
dothraki: 'mis'
|
||||
[Languages.English]: 'en',
|
||||
[Languages.Espanol]: 'es',
|
||||
[Languages.Chinese]: 'zh',
|
||||
[Languages.ChineseTrandational]: 'zh-Hant',
|
||||
[Languages.Dothraki]: 'mis'
|
||||
};
|
||||
|
||||
export enum LangNames = {
|
||||
english: 'English',
|
||||
espanol: 'Español',
|
||||
chinese: '中文（简体字）',
|
||||
'chinese-traditional': '中文（繁體字）',
|
||||
dothraki: 'Dothraki'
|
||||
[Languages.English]: 'English',
|
||||
[Languages.Espanol]: 'Español',
|
||||
[Languages.Chinese]: '中文（简体字）',
|
||||
[Languages.ChineseTrandational]: '中文（繁體字）',
|
||||
[Languages.Dothraki]: 'Dothraki'
|
||||
};
|
||||
|
||||
export enum LangCodes = {
|
||||
english: 'en-US',
|
||||
espanol: 'es-419',
|
||||
chinese: 'zh',
|
||||
'chinese-traditional': 'zh-Hant',
|
||||
dothraki: 'mis'
|
||||
[Languages.English]: 'en-US',
|
||||
[Languages.Espanol]: 'es-419',
|
||||
[Languages.Chinese]: 'zh',
|
||||
[Languages.ChineseTrandational]: 'zh-Hant',
|
||||
[Languages.Dothraki]: 'mis'
|
||||
};
|
||||
|
||||
export const hiddenLangs = ['dothraki'];
|
||||
@@ -143,6 +118,71 @@ export const rtlLangs = [''];
|
||||
|
||||
> [!NOTE] When a language has been set up in the deployment pipeline AND has a public `/news` instance live, it can be removed from the `hiddenLangs` array and be made available to the public.
|
||||
|
||||
### Configure the Language Superblock Order
|
||||
|
||||
In the [config/superblock-order.ts](https://github.com/freeCodeCamp/freeCodeCamp/blob/main/config/superblock-order.ts) file, you need to set the order and state of all the superblocks for the new language in the `superBlockOrder` object. Copy one of the language keys and all its values, paste it to the bottom of the object (or wherever), and change the key to your new language from the `Languages` enum.
|
||||
|
||||
```js
|
||||
export const superBlockOrder: SuperBlockOrder = {
|
||||
...
|
||||
[Languages.Dothraki]: {
|
||||
[CurriculumMaps.Landing]: [
|
||||
SuperBlocks.RespWebDesignNew,
|
||||
SuperBlocks.JsAlgoDataStruct,
|
||||
SuperBlocks.FrontEndDevLibs,
|
||||
SuperBlocks.DataVis,
|
||||
SuperBlocks.RelationalDb,
|
||||
SuperBlocks.BackEndDevApis,
|
||||
SuperBlocks.QualityAssurance,
|
||||
SuperBlocks.SciCompPy,
|
||||
SuperBlocks.DataAnalysisPy,
|
||||
SuperBlocks.InfoSec,
|
||||
SuperBlocks.MachineLearningPy
|
||||
],
|
||||
[CurriculumMaps.Learn]: {
|
||||
[TranslationStates.Audited]: {
|
||||
[SuperBlockStates.Current]: [
|
||||
SuperBlocks.RespWebDesignNew,
|
||||
SuperBlocks.JsAlgoDataStruct,
|
||||
SuperBlocks.FrontEndDevLibs,
|
||||
SuperBlocks.DataVis,
|
||||
SuperBlocks.RelationalDb,
|
||||
SuperBlocks.BackEndDevApis,
|
||||
SuperBlocks.QualityAssurance,
|
||||
SuperBlocks.SciCompPy,
|
||||
SuperBlocks.DataAnalysisPy,
|
||||
SuperBlocks.InfoSec,
|
||||
SuperBlocks.MachineLearningPy,
|
||||
SuperBlocks.CodingInterviewPrep
|
||||
],
|
||||
[SuperBlockStates.New]: [],
|
||||
[SuperBlockStates.Upcoming]: [SuperBlocks.JsAlgoDataStructNew],
|
||||
[SuperBlockStates.Legacy]: [SuperBlocks.RespWebDesign]
|
||||
},
|
||||
[TranslationStates.NotAudited]: {
|
||||
[SuperBlockStates.Current]: [],
|
||||
[SuperBlockStates.New]: [],
|
||||
[SuperBlockStates.Upcoming]: [],
|
||||
[SuperBlockStates.Legacy]: []
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
The order of the superblocks in this object is how they appear on the "Landing" page and "Learn" maps. Follow the comments in that file so you know how you are allowed to order the superblocks, then move them to their proper places for the new language.
|
||||
|
||||
> [!ATTENTION] Do not change the order of any of the keys in the object, just move the superblocks to the different arrays
|
||||
|
||||
The `CurriculumMaps.Landing` array should contain exactly one superblock for all our current certifications, and the `CurriculumMaps.Learn` object should have all existing superblocks in it. Translated superblocks go in `TranslationStates.Audited` and non-translated superblocks go in `TranslationStates.NotAudited`. Each of those two objects has four different states a superblock can be in.
|
||||
|
||||
- `SuperBlockStates.Current`: Means that the superblock is current, `(New) Responsive Web Design` for example.
|
||||
- `SuperBlockStates.New`: These only show up when `SHOW_NEW_CURRICULUM` is set to `true` in your `.env` file. It is for displaying new superblocks on a specific build. For example, when we released the new RWD, we only showed in on English to start.
|
||||
- `SuperBlockStates.Upcoming`: These only show up when `SHOW_UPCOMING_CHANGES` is set to `true` in your `.env` file. It is to show superblocks locally while they are in development. Or, if you just need to hide a superblock from the map for some other reason.
|
||||
- `SuperBlockStates.Legacy`: A superblock is moved here when a newer version of that superblock has been fully translated and replaced it.
|
||||
|
||||
### Configure Search
|
||||
|
||||
Next, open the `client/src/utils/algolia-locale-setup.ts` file. This data is used for the search bar that loads `/news` articles. While it is unlikely that you are going to test this functionality, missing the data for your language can lead to errors when attempting to build the codebase locally.
|
||||
|
||||
Add an object for your language to the `algoliaIndices` object. You should use the the same values as the `english` object for local testing, replacing the `english` key with your language's `availableLangs` value.
|
||||
@@ -176,30 +216,6 @@ const algoliaIndices = {
|
||||
};
|
||||
```
|
||||
|
||||
### Releasing a Superblock
|
||||
|
||||
After a superblock has been fully translated into a language, there are two steps to release it. First add the superblock enum to that language's `auditedCerts` array. So, if you want to release the new Responsive Web Design superblock for Dothraki, the array should look like this:
|
||||
|
||||
```ts
|
||||
export const auditedCerts = {
|
||||
// other languages
|
||||
dothraki: [
|
||||
SuperBlocks.RespWebDesignNew, // the newly translated superblock
|
||||
SuperBlocks.RespWebDesign,
|
||||
SuperBlocks.JsAlgoDataStruct,
|
||||
SuperBlocks.FrontEndDevLibs
|
||||
]
|
||||
};
|
||||
```
|
||||
|
||||
Finally, if the superblock is in a "new" state (that is, replacing a legacy superblock), the `languagesWithAuditedBetaReleases` array should be updated to include the new language like this:
|
||||
|
||||
```ts
|
||||
export const languagesWithAuditedBetaReleases: ['english', 'dothraki'];
|
||||
```
|
||||
|
||||
This will move the new superblock to the correct place in the curriculum map on `/learn`.
|
||||
|
||||
## Enabling Localized Videos
|
||||
|
||||
For the video challenges, you need to change a few things. First add the new locale to the GraphQL query in the `client/src/templates/Challenges/video/Show.tsx` file. For example, adding Dothraki to the query:
|
||||
|
||||
@@ -80,7 +80,7 @@ Some community members also develop on Windows 10 natively with Git for Windows
|
||||
|
||||
| Prerequisite | Version | Notes |
|
||||
| --------------------------------------------------------------------------------------------- | ------- | ------------------------------------------------------------------------------------------- |
|
||||
| [Node.js](http://nodejs.org) | `16.x` | We use the "Active LTS" version, See [LTS Schedule](https://nodejs.org/en/about/releases/). |
|
||||
| [Node.js](http://nodejs.org) | `18.x` | We use the "Active LTS" version, See [LTS Schedule](https://nodejs.org/en/about/releases/). |
|
||||
| npm (comes bundled with Node) | `8.x` | We use the version bundled with Node.js Active LTS. |
|
||||
| [MongoDB Community Server](https://docs.mongodb.com/manual/administration/install-community/) | `4.2.x` | - |
|
||||
|
||||
|
||||
@@ -17,8 +17,8 @@ Let's understand how the i18n frameworks and tooling work.
|
||||
Most of files for translating the platform are located in the [`client/i18n`](https://github.com/freeCodeCamp/freeCodeCamp/tree/main/client/i18n) folder. Each language has a directory within that containing JSON files with the translations.
|
||||
|
||||
```console
|
||||
config/i18n
|
||||
└── all-langs.ts
|
||||
config
|
||||
└── i18n.ts
|
||||
...
|
||||
client/i18n
|
||||
├── configForTests.js
|
||||
@@ -29,37 +29,33 @@ Most of files for translating the platform are located in the [`client/i18n`](ht
|
||||
│ │ ├── links.json
|
||||
│ │ ├── meta-tags.json
|
||||
│ │ ├── motivation.json
|
||||
│ │ ├── translations.json
|
||||
│ │ └── trending.json
|
||||
│ │ └── translations.json
|
||||
... ...
|
||||
│ ├── dothraki
|
||||
│ │ ├── intro.json
|
||||
│ │ ├── links.json
|
||||
│ │ ├── meta-tags.json
|
||||
│ │ ├── motivation.json
|
||||
│ │ ├── translations.json
|
||||
│ │ └── trending.json
|
||||
│ │ └── translations.json
|
||||
... ...
|
||||
│ ├── english
|
||||
│ │ ├── intro.json
|
||||
│ │ ├── links.json
|
||||
│ │ ├── meta-tags.json
|
||||
│ │ ├── motivation.json
|
||||
│ │ ├── translations.json
|
||||
│ │ └── trending.json
|
||||
│ │ └── translations.json
|
||||
│ └── espanol
|
||||
│ ├── intro.json
|
||||
│ ├── links.json
|
||||
│ ├── meta-tags.json
|
||||
│ ├── motivation.json
|
||||
│ ├── translations.json
|
||||
│ └── trending.json
|
||||
│ └── translations.json
|
||||
├── locales.test.js
|
||||
├── schema-validation.js
|
||||
└── validate-keys.ts
|
||||
```
|
||||
|
||||
Some of these files are translated on our translation platform (Crowdin), some are not.
|
||||
Some of these files are translated on our translation platform (Crowdin), some are translated or created via PR's on GitHub.
|
||||
|
||||
**Files translated on our translation platform:**
|
||||
|
||||
@@ -73,28 +69,27 @@ Some of these files are translated on our translation platform (Crowdin), some a
|
||||
|
||||
- The `motivation.json` files are not required to have the same quotes, compliments, or array length. Just the same JSON structure.
|
||||
|
||||
- The `trending.json` file contains the titles and links for the trending news articles in the website's footer.
|
||||
|
||||
- The `meta-tags.json` file contains the information for our website's meta tag information.
|
||||
|
||||
Changes to these files are typically done by the staff team. If you see something out of the ordinary we recommend you reach us in the [contributors chat room](https://discord.gg/PRyKn3Vbay).
|
||||
|
||||
## Testing the client app in a world language
|
||||
|
||||
You can test the client app in any language available in the [list of languages here](https://github.com/freeCodeCamp/freeCodeCamp/blob/main/config/i18n/all-langs.ts).
|
||||
You can test the client app in any language available in the [list of `availableLangs` here](https://github.com/freeCodeCamp/freeCodeCamp/blob/main/config/i18n.ts).
|
||||
|
||||
```js
|
||||
export const availableLangs = {
|
||||
export const availableLangs = {
|
||||
client: [
|
||||
'english',
|
||||
'espanol',
|
||||
'chinese',
|
||||
'chinese-traditional',
|
||||
'italian',
|
||||
'portuguese',
|
||||
'ukrainian',
|
||||
'japanese',
|
||||
'german'
|
||||
Languages.English,
|
||||
Languages.Espanol,
|
||||
Languages.Chinese,
|
||||
Languages.ChineseTrandational,
|
||||
Languages.Italian,
|
||||
Languages.Portuguese,
|
||||
Languages.Ukrainian,
|
||||
Languages.Japanese,
|
||||
Languages.German,
|
||||
Languages.Arabic
|
||||
],
|
||||
...
|
||||
};
|
||||
@@ -102,11 +97,11 @@ You can test the client app in any language available in the [list of languages
|
||||
|
||||
If you are testing a new language, create a folder with the language name as the title next to the other languages and copy the JSON files from another language into your new folder.
|
||||
|
||||
Add the language to the `client` array as seen above in the [`config/i18n/all-langs.ts`](https://github.com/freeCodeCamp/freeCodeCamp/blob/main/config/i18n/all-langs.ts) file.
|
||||
Add the new language to the `Languages` enum and the `client` array at the top of the [`config/i18n.ts`](https://github.com/freeCodeCamp/freeCodeCamp/blob/main/config/i18n.ts) file.
|
||||
|
||||
Next, follow the instructions in the comments in the same file to add/update the rest of the variables as needed.
|
||||
|
||||
Finally, set the `CLIENT_LOCALE` variable in your `.env` file to the locale you want to build and you're ready.
|
||||
Finally, set the `CLIENT_LOCALE` variable in your `.env` file to the string of the locale you want to build from the `Languages` enum in the above file.
|
||||
|
||||
## How to Structure Components
|
||||
|
||||
|
||||
@@ -51,8 +51,8 @@ Hay algunos pasos a seguir para permitirle a la base de código compilarse a tu
|
||||
|
||||
First, visit the `config/i18n.ts` file to add the language to the list of available languages and configure the values. Aquí hay varios objetos.
|
||||
|
||||
- `availableLangs`: Tanto para el array `client` y `curriculum`, añade el nombre del idioma. Este es el valor que será utilizado en el archivo `.env` después.
|
||||
- `auditedCerts`: Añade el nombre del idioma como _key_ y añade un array de variables de `SuperBlocks.{cert}` como _value_. Esto le dice al cliente que certificaciones están traducidas completamente.
|
||||
- `Languages`: Add the new language to `Languages` enum, similar to the others. The string value here will be used in the `.env` file to set a build language later.
|
||||
- `availableLangs`: Add the new property from the `Languages` enum to both the `client` and `curriculum` arrays.
|
||||
- `i18nextCodes`: Estos son los códigos de idioma ISO para cada lenguaje. Necesitarás añadir el código ISO correspondiente para el idioma que estás activando. Estos deben ser únicos para cada lenguaje.
|
||||
- `LangNames`: Estos son los nombres mostrados para el selector de idiomas en el menú de navegación.
|
||||
- `LangCodes`: Estos son los códigos de idiomas usados para formatear fechas y números. Estos deben ser códigos Unicode CLDR en vez de los códigos ISO.
|
||||
@@ -62,78 +62,53 @@ First, visit the `config/i18n.ts` file to add the language to the list of availa
|
||||
As an example, if you wanted to enable Dothraki as a language, your `i18n.ts` objects should look like this:
|
||||
|
||||
```js
|
||||
export const availableLangs = {
|
||||
client: ['english', 'espanol', 'chinese', 'chinese-traditional', 'dothraki'],
|
||||
curriculum: [
|
||||
'english',
|
||||
'espanol',
|
||||
'chinese',
|
||||
'chinese-traditional',
|
||||
'dothraki'
|
||||
]
|
||||
};
|
||||
export enum Languages {
|
||||
English = 'english',
|
||||
Espanol = 'espanol',
|
||||
Chinese = 'chinese',
|
||||
ChineseTrandational = 'chinese-traditional',
|
||||
Dothraki = 'dothraki'
|
||||
}
|
||||
|
||||
export const auditedCerts = {
|
||||
espanol: [
|
||||
SuperBlocks.RespWebDesign,
|
||||
SuperBlocks.JsAlgoDataStruct,
|
||||
SuperBlocks.FrontEndDevLibs,
|
||||
SuperBlocks.DataVis,
|
||||
SuperBlocks.BackEndDevApis
|
||||
export const availableLangs = {
|
||||
client: [
|
||||
Languages.English,
|
||||
Languages.Espanol,
|
||||
Languages.Chinese,
|
||||
Languages.ChineseTrandational,
|
||||
Languages.Dothraki
|
||||
],
|
||||
chinese: [
|
||||
SuperBlocks.RespWebDesign,
|
||||
SuperBlocks.JsAlgoDataStruct,
|
||||
SuperBlocks.FrontEndDevLibs,
|
||||
SuperBlocks.DataVis,
|
||||
SuperBlocks.BackEndDevApis,
|
||||
SuperBlocks.QualityAssurance,
|
||||
SuperBlocks.SciCompPy,
|
||||
SuperBlocks.DataAnalysisPy,
|
||||
SuperBlocks.InfoSec,
|
||||
SuperBlocks.MachineLearningPy
|
||||
],
|
||||
'chinese-traditional': [
|
||||
SuperBlocks.RespWebDesign,
|
||||
SuperBlocks.JsAlgoDataStruct,
|
||||
SuperBlocks.FrontEndDevLibs,
|
||||
SuperBlocks.DataVis,
|
||||
SuperBlocks.BackEndDevApis,
|
||||
SuperBlocks.QualityAssurance,
|
||||
SuperBlocks.SciCompPy,
|
||||
SuperBlocks.DataAnalysisPy,
|
||||
SuperBlocks.InfoSec,
|
||||
SuperBlocks.MachineLearningPy
|
||||
],
|
||||
dothraki: [
|
||||
SuperBlocks.RespWebDesign,
|
||||
SuperBlocks.JsAlgoDataStruct,
|
||||
SuperBlocks.FrontEndDevLibs
|
||||
curriculum: [
|
||||
Languages.English,
|
||||
Languages.Espanol,
|
||||
Languages.Chinese,
|
||||
Languages.ChineseTrandational,
|
||||
Languages.Dothraki
|
||||
]
|
||||
};
|
||||
|
||||
export const i18nextCodes = {
|
||||
english: 'en',
|
||||
espanol: 'es',
|
||||
chinese: 'zh',
|
||||
'chinese-traditional': 'zh-Hant',
|
||||
dothraki: 'mis'
|
||||
[Languages.English]: 'en',
|
||||
[Languages.Espanol]: 'es',
|
||||
[Languages.Chinese]: 'zh',
|
||||
[Languages.ChineseTrandational]: 'zh-Hant',
|
||||
[Languages.Dothraki]: 'mis'
|
||||
};
|
||||
|
||||
export enum LangNames = {
|
||||
english: 'English',
|
||||
espanol: 'Español',
|
||||
chinese: '中文（简体字）',
|
||||
'chinese-traditional': '中文（繁體字）',
|
||||
dothraki: 'Dothraki'
|
||||
[Languages.English]: 'English',
|
||||
[Languages.Espanol]: 'Español',
|
||||
[Languages.Chinese]: '中文（简体字）',
|
||||
[Languages.ChineseTrandational]: '中文（繁體字）',
|
||||
[Languages.Dothraki]: 'Dothraki'
|
||||
};
|
||||
|
||||
export enum LangCodes = {
|
||||
english: 'en-US',
|
||||
espanol: 'es-419',
|
||||
chinese: 'zh',
|
||||
'chinese-traditional': 'zh-Hant',
|
||||
dothraki: 'mis'
|
||||
[Languages.English]: 'en-US',
|
||||
[Languages.Espanol]: 'es-419',
|
||||
[Languages.Chinese]: 'zh',
|
||||
[Languages.ChineseTrandational]: 'zh-Hant',
|
||||
[Languages.Dothraki]: 'mis'
|
||||
};
|
||||
|
||||
export const hiddenLangs = ['dothraki'];
|
||||
@@ -143,6 +118,71 @@ export const rtlLangs = [''];
|
||||
|
||||
> [!NOTE] Cuando un lenguage ha sido configurado en el pipeline de despliegue Y se ha publicado como `/news`, puede ser quitado del arreglo `hiddenLangs` y puede ser disponible para el público.
|
||||
|
||||
### Configure the Language Superblock Order
|
||||
|
||||
In the [config/superblock-order.ts](https://github.com/freeCodeCamp/freeCodeCamp/blob/main/config/superblock-order.ts) file, you need to set the order and state of all the superblocks for the new language in the `superBlockOrder` object. Copy one of the language keys and all its values, paste it to the bottom of the object (or wherever), and change the key to your new language from the `Languages` enum.
|
||||
|
||||
```js
|
||||
export const superBlockOrder: SuperBlockOrder = {
|
||||
...
|
||||
[Languages.Dothraki]: {
|
||||
[CurriculumMaps.Landing]: [
|
||||
SuperBlocks.RespWebDesignNew,
|
||||
SuperBlocks.JsAlgoDataStruct,
|
||||
SuperBlocks.FrontEndDevLibs,
|
||||
SuperBlocks.DataVis,
|
||||
SuperBlocks.RelationalDb,
|
||||
SuperBlocks.BackEndDevApis,
|
||||
SuperBlocks.QualityAssurance,
|
||||
SuperBlocks.SciCompPy,
|
||||
SuperBlocks.DataAnalysisPy,
|
||||
SuperBlocks.InfoSec,
|
||||
SuperBlocks.MachineLearningPy
|
||||
],
|
||||
[CurriculumMaps.Learn]: {
|
||||
[TranslationStates.Audited]: {
|
||||
[SuperBlockStates.Current]: [
|
||||
SuperBlocks.RespWebDesignNew,
|
||||
SuperBlocks.JsAlgoDataStruct,
|
||||
SuperBlocks.FrontEndDevLibs,
|
||||
SuperBlocks.DataVis,
|
||||
SuperBlocks.RelationalDb,
|
||||
SuperBlocks.BackEndDevApis,
|
||||
SuperBlocks.QualityAssurance,
|
||||
SuperBlocks.SciCompPy,
|
||||
SuperBlocks.DataAnalysisPy,
|
||||
SuperBlocks.InfoSec,
|
||||
SuperBlocks.MachineLearningPy,
|
||||
SuperBlocks.CodingInterviewPrep
|
||||
],
|
||||
[SuperBlockStates.New]: [],
|
||||
[SuperBlockStates.Upcoming]: [SuperBlocks.JsAlgoDataStructNew],
|
||||
[SuperBlockStates.Legacy]: [SuperBlocks.RespWebDesign]
|
||||
},
|
||||
[TranslationStates.NotAudited]: {
|
||||
[SuperBlockStates.Current]: [],
|
||||
[SuperBlockStates.New]: [],
|
||||
[SuperBlockStates.Upcoming]: [],
|
||||
[SuperBlockStates.Legacy]: []
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
The order of the superblocks in this object is how they appear on the "Landing" page and "Learn" maps. Follow the comments in that file so you know how you are allowed to order the superblocks, then move them to their proper places for the new language.
|
||||
|
||||
> [!ATTENTION] Do not change the order of any of the keys in the object, just move the superblocks to the different arrays
|
||||
|
||||
The `CurriculumMaps.Landing` array should contain exactly one superblock for all our current certifications, and the `CurriculumMaps.Learn` object should have all existing superblocks in it. Translated superblocks go in `TranslationStates.Audited` and non-translated superblocks go in `TranslationStates.NotAudited`. Each of those two objects has four different states a superblock can be in.
|
||||
|
||||
- `SuperBlockStates.Current`: Means that the superblock is current, `(New) Responsive Web Design` for example.
|
||||
- `SuperBlockStates.New`: These only show up when `SHOW_NEW_CURRICULUM` is set to `true` in your `.env` file. It is for displaying new superblocks on a specific build. For example, when we released the new RWD, we only showed in on English to start.
|
||||
- `SuperBlockStates.Upcoming`: These only show up when `SHOW_UPCOMING_CHANGES` is set to `true` in your `.env` file. It is to show superblocks locally while they are in development. Or, if you just need to hide a superblock from the map for some other reason.
|
||||
- `SuperBlockStates.Legacy`: A superblock is moved here when a newer version of that superblock has been fully translated and replaced it.
|
||||
|
||||
### Configure Search
|
||||
|
||||
A continuación, abre el archivo: `client/src/utils/algolia-locale-setup.ts`. Estos datos son utilizados por la barra de búsqueda que carga artículos de `/news`. Si bien es poco probable que vayas a probar esta funcionalidad, lea falta de datos para tu lenguaje puede llevarle a errores al intentar construir el código base localmente.
|
||||
|
||||
Agrega un objeto para al objeto `algoliaIndices`. Deberñias usar los mismos valores del objeto `english` para pruebas locales, remplazando la clave `english` con el valor `avalaibleLangs` para tu idioma.
|
||||
@@ -176,30 +216,6 @@ const algoliaIndices = {
|
||||
};
|
||||
```
|
||||
|
||||
### Liberando un Superblock
|
||||
|
||||
Después de que un superbloque haya sido completamente traducido a un idioma, hay dos pasos para hacer si queremos liberarlo. Primero, añada el enum de superbloque al arreglo `auditedCerts` de ese idioma. Por lo tanto, si quisieras añadir el nuevo superbloque "Responsive Web Design" para Dothraki, el arreglo debería verse así:
|
||||
|
||||
```ts
|
||||
export const auditedCerts = {
|
||||
// otros lenguajes
|
||||
dothraki: [
|
||||
SuperBlocks.RespWebDesignNew, // el superbloque recién traducido superblock
|
||||
SuperBlocks.RespWebDesign,
|
||||
SuperBlocks.JsAlgoDataStruct,
|
||||
SuperBlocks.FrontEndDevLibs
|
||||
]
|
||||
};
|
||||
```
|
||||
|
||||
Finalmente, si el superbloque está en un estado "nuevo" (es decir, reemplazando un superbloque heredado), el arreglo `languagesWitAuditedBetaReleases` deberia ser actualizado para incluir el nuevo lenguaje de la siguiente manera:
|
||||
|
||||
```ts
|
||||
export const languagesWithAuditedBetaReleases: ['english', 'dothraki'];
|
||||
```
|
||||
|
||||
Esto moverà el nuevo superblock al lugar correcto ubicar en el mapa curricular en `/learn`.
|
||||
|
||||
## Habilitar Videos Localizados
|
||||
|
||||
Para los desafìos de video, debe cambiar algunas cosas. Primero agregue la nueva configuración regional a la consulta de GraphQL en el archivo `client/src/templates/Challenges/video/Show.tsx`. Por ejemplo, agregando a Dothraki para la consulta:
|
||||
|
||||
@@ -80,7 +80,7 @@ Some community members also develop on Windows 10 natively with Git for Windows
|
||||
|
||||
| Prerrequisito | Versión | Notas |
|
||||
| ----------------------------------------------------------------------------------------------------- | ------- | --------------------------------------------------------------------------------------------------- |
|
||||
| [Node.js](http://nodejs.org) | `16.x` | Utilizamos la versión "Activos LTS", ejemplo[ LTS Schedule](https://nodejs.org/en/about/releases/). |
|
||||
| [Node.js](http://nodejs.org) | `18.x` | Utilizamos la versión "Activos LTS", ejemplo[ LTS Schedule](https://nodejs.org/en/about/releases/). |
|
||||
| npm (viene empaquetado con Node) | `8.x` | Utilizamos la versión empaquetada con Node.js Active LTS. |
|
||||
| [Servidor de la comunidad MongoDB](https://docs.mongodb.com/manual/administration/install-community/) | `4.2.x` | - |
|
||||
|
||||
|
||||
@@ -17,8 +17,8 @@ Veamos cómo funcionan los marcos de trabajo y las herramientas de i18n.
|
||||
La mayoría de los archivos para traducir la plataforma se encuentran en la carpeta [`client/i18n`](https://github.com/freeCodeCamp/freeCodeCamp/tree/main/client/i18n). Cada idioma tiene una carpeta dentro que contiene archivos JSON con las traducciones.
|
||||
|
||||
```console
|
||||
config/i18n
|
||||
└── all-langs.ts
|
||||
config
|
||||
└── i18n.ts
|
||||
...
|
||||
client/i18n
|
||||
├── configForTests.js
|
||||
@@ -29,37 +29,33 @@ La mayoría de los archivos para traducir la plataforma se encuentran en la carp
|
||||
│ │ ├── links.json
|
||||
│ │ ├── meta-tags.json
|
||||
│ │ ├── motivation.json
|
||||
│ │ ├── translations.json
|
||||
│ │ └── trending.json
|
||||
│ │ └── translations.json
|
||||
... ...
|
||||
│ ├── dothraki
|
||||
│ │ ├── intro.json
|
||||
│ │ ├── links.json
|
||||
│ │ ├── meta-tags.json
|
||||
│ │ ├── motivation.json
|
||||
│ │ ├── translations.json
|
||||
│ │ └── trending.json
|
||||
│ │ └── translations.json
|
||||
... ...
|
||||
│ ├── english
|
||||
│ │ ├── intro.json
|
||||
│ │ ├── links.json
|
||||
│ │ ├── meta-tags.json
|
||||
│ │ ├── motivation.json
|
||||
│ │ ├── translations.json
|
||||
│ │ └── trending.json
|
||||
│ │ └── translations.json
|
||||
│ └── espanol
|
||||
│ ├── intro.json
|
||||
│ ├── links.json
|
||||
│ ├── meta-tags.json
|
||||
│ ├── motivation.json
|
||||
│ ├── translations.json
|
||||
│ └── trending.json
|
||||
│ └── translations.json
|
||||
├── locales.test.js
|
||||
├── schema-validation.js
|
||||
└── validate-keys.ts
|
||||
```
|
||||
|
||||
Algunos de estos archivos son traducidos en nuestra plataforma de traducción (Crowdin), otros no lo son.
|
||||
Some of these files are translated on our translation platform (Crowdin), some are translated or created via PR's on GitHub.
|
||||
|
||||
**Archivos traducidos en nuestra plataforma de traducción:**
|
||||
|
||||
@@ -73,28 +69,27 @@ Algunos de estos archivos son traducidos en nuestra plataforma de traducción (C
|
||||
|
||||
- Los archivos `motivation.json` no requieren que tengan las mismas comillas, complementos o tamaños u orden. Simplemente la misma estructura JSON.
|
||||
|
||||
- El archivo `trending.json` contiene los títulos y enlaces para los artículos noticiosos en tendencia dentro del footer del sitio web.
|
||||
- The `meta-tags.json` file contains the information for our website's meta tag information.
|
||||
|
||||
- El archivo`meta-tags.json` contiene la información para nuestra informacion de la Meta etiqueta del sitio web.
|
||||
|
||||
Los cambios en estos archivos son usualmente realizados por nuestro personal. Si ves algo raro o fuera de lo normal, deberías comunicarte con nosotros en el [chat de colaboradores](https://discord.gg/PRyKn3Vbay).
|
||||
Changes to these files are typically done by the staff team. If you see something out of the ordinary we recommend you reach us in the [contributors chat room](https://discord.gg/PRyKn3Vbay).
|
||||
|
||||
## Probando la app cliente en un idioma mundial
|
||||
|
||||
You can test the client app in any language available in the [list of languages here](https://github.com/freeCodeCamp/freeCodeCamp/blob/main/config/i18n/all-langs.ts).
|
||||
You can test the client app in any language available in the [list of `availableLangs` here](https://github.com/freeCodeCamp/freeCodeCamp/blob/main/config/i18n.ts).
|
||||
|
||||
```js
|
||||
export const availableLangs = {
|
||||
export const availableLangs = {
|
||||
client: [
|
||||
'english',
|
||||
'espanol',
|
||||
'chinese',
|
||||
'chinese-traditional',
|
||||
'italian',
|
||||
'portuguese',
|
||||
'ukrainian',
|
||||
'japanese',
|
||||
'german'
|
||||
Languages.English,
|
||||
Languages.Espanol,
|
||||
Languages.Chinese,
|
||||
Languages.ChineseTrandational,
|
||||
Languages.Italian,
|
||||
Languages.Portuguese,
|
||||
Languages.Ukrainian,
|
||||
Languages.Japanese,
|
||||
Languages.German,
|
||||
Languages.Arabic
|
||||
],
|
||||
...
|
||||
};
|
||||
@@ -102,11 +97,11 @@ You can test the client app in any language available in the [list of languages
|
||||
|
||||
Si estas probando un nuevo idioma, crea una carpeta con el nombre del idioma como titulo junto al otro idioma y copia los archivos JSON desde el otro idioma dentro de la nueva carpeta.
|
||||
|
||||
Add the language to the `client` array as seen above in the [`config/i18n/all-langs.ts`](https://github.com/freeCodeCamp/freeCodeCamp/blob/main/config/i18n/all-langs.ts) file.
|
||||
Add the new language to the `Languages` enum and the `client` array at the top of the [`config/i18n.ts`](https://github.com/freeCodeCamp/freeCodeCamp/blob/main/config/i18n.ts) file.
|
||||
|
||||
A continuación, sigue las instrucciones en los comentarios en el mismo archivo para agregar/actualizar el resto de las variables tanto como se necesite.
|
||||
|
||||
Finalmente, establece la variable `CLIENT_LOCALE` en tu archivo `.env` en la configuración regional que quieres crear y estás listo.
|
||||
Finally, set the `CLIENT_LOCALE` variable in your `.env` file to the string of the locale you want to build from the `Languages` enum in the above file.
|
||||
|
||||
## Como estructurar los componentes
|
||||
|
||||
|
||||
@@ -51,8 +51,8 @@ Es gibt ein paar Schritte, die du unternehmen musst, damit die Codebasis in dein
|
||||
|
||||
First, visit the `config/i18n.ts` file to add the language to the list of available languages and configure the values. Hier gibt es mehrere Objekte.
|
||||
|
||||
- `availableLangs`: Füge sowohl für den `client` als auch für das `curriculum`-Array den Textnamen der Sprache hinzu. Dies ist der Wert, der später in der `.env`-Datei verwendet wird.
|
||||
- `auditedCerts`: Füge den Textnamen der Sprache als _Schlüssel_ und ein Array mit `SuperBlocks.{cert}`-Variablen als _Wert_ hinzu. Dies teilt dem Client mit, welche Zertifikate vollständig übersetzt sind.
|
||||
- `Languages`: Add the new language to `Languages` enum, similar to the others. The string value here will be used in the `.env` file to set a build language later.
|
||||
- `availableLangs`: Add the new property from the `Languages` enum to both the `client` and `curriculum` arrays.
|
||||
- `i18nextCodes`: Dies sind die ISO-Sprachcodes für jede Sprache. Du musst den entsprechenden ISO-Code für die Sprache hinzufügen, die du aktivieren möchtest. Diese müssen für jede Sprache einzigartig sein.
|
||||
- `LangNames`: Dies sind die Anzeigenamen für die Sprachauswahl im Navigationsmenü.
|
||||
- `LangCodes`: Dies sind die Sprachcodes, die für die Formatierung von Datumsangaben und Zahlen verwendet werden. Dies sollten Unicode CLDR-Codes statt ISO-Codes sein.
|
||||
@@ -62,78 +62,53 @@ First, visit the `config/i18n.ts` file to add the language to the list of availa
|
||||
As an example, if you wanted to enable Dothraki as a language, your `i18n.ts` objects should look like this:
|
||||
|
||||
```js
|
||||
export const availableLangs = {
|
||||
client: ['english', 'espanol', 'chinese', 'chinese-traditional', 'dothraki'],
|
||||
curriculum: [
|
||||
'english',
|
||||
'espanol',
|
||||
'chinese',
|
||||
'chinese-traditional',
|
||||
'dothraki'
|
||||
]
|
||||
};
|
||||
export enum Languages {
|
||||
English = 'english',
|
||||
Espanol = 'espanol',
|
||||
Chinese = 'chinese',
|
||||
ChineseTrandational = 'chinese-traditional',
|
||||
Dothraki = 'dothraki'
|
||||
}
|
||||
|
||||
export const auditedCerts = {
|
||||
espanol: [
|
||||
SuperBlocks.RespWebDesign,
|
||||
SuperBlocks.JsAlgoDataStruct,
|
||||
SuperBlocks.FrontEndDevLibs,
|
||||
SuperBlocks.DataVis,
|
||||
SuperBlocks.BackEndDevApis
|
||||
export const availableLangs = {
|
||||
client: [
|
||||
Languages.English,
|
||||
Languages.Espanol,
|
||||
Languages.Chinese,
|
||||
Languages.ChineseTrandational,
|
||||
Languages.Dothraki
|
||||
],
|
||||
chinese: [
|
||||
SuperBlocks.RespWebDesign,
|
||||
SuperBlocks.JsAlgoDataStruct,
|
||||
SuperBlocks.FrontEndDevLibs,
|
||||
SuperBlocks.DataVis,
|
||||
SuperBlocks.BackEndDevApis,
|
||||
SuperBlocks.QualityAssurance,
|
||||
SuperBlocks.SciCompPy,
|
||||
SuperBlocks.DataAnalysisPy,
|
||||
SuperBlocks.InfoSec,
|
||||
SuperBlocks.MachineLearningPy
|
||||
],
|
||||
'chinese-traditional': [
|
||||
SuperBlocks.RespWebDesign,
|
||||
SuperBlocks.JsAlgoDataStruct,
|
||||
SuperBlocks.FrontEndDevLibs,
|
||||
SuperBlocks.DataVis,
|
||||
SuperBlocks.BackEndDevApis,
|
||||
SuperBlocks.QualityAssurance,
|
||||
SuperBlocks.SciCompPy,
|
||||
SuperBlocks.DataAnalysisPy,
|
||||
SuperBlocks.InfoSec,
|
||||
SuperBlocks.MachineLearningPy
|
||||
],
|
||||
dothraki: [
|
||||
SuperBlocks.RespWebDesign,
|
||||
SuperBlocks.JsAlgoDataStruct,
|
||||
SuperBlocks.FrontEndDevLibs
|
||||
curriculum: [
|
||||
Languages.English,
|
||||
Languages.Espanol,
|
||||
Languages.Chinese,
|
||||
Languages.ChineseTrandational,
|
||||
Languages.Dothraki
|
||||
]
|
||||
};
|
||||
|
||||
export const i18nextCodes = {
|
||||
english: 'en',
|
||||
espanol: 'es',
|
||||
chinese: 'zh',
|
||||
'chinese-traditional': 'zh-Hant',
|
||||
dothraki: 'mis'
|
||||
[Languages.English]: 'en',
|
||||
[Languages.Espanol]: 'es',
|
||||
[Languages.Chinese]: 'zh',
|
||||
[Languages.ChineseTrandational]: 'zh-Hant',
|
||||
[Languages.Dothraki]: 'mis'
|
||||
};
|
||||
|
||||
export enum LangNames = {
|
||||
english: 'English',
|
||||
espanol: 'Español',
|
||||
chinese: '中文（简体字）',
|
||||
'chinese-traditional': '中文（繁體字）',
|
||||
dothraki: 'Dothraki'
|
||||
[Languages.English]: 'English',
|
||||
[Languages.Espanol]: 'Español',
|
||||
[Languages.Chinese]: '中文（简体字）',
|
||||
[Languages.ChineseTrandational]: '中文（繁體字）',
|
||||
[Languages.Dothraki]: 'Dothraki'
|
||||
};
|
||||
|
||||
export enum LangCodes = {
|
||||
english: 'en-US',
|
||||
espanol: 'es-419',
|
||||
chinese: 'zh',
|
||||
'chinese-traditional': 'zh-Hant',
|
||||
dothraki: 'mis'
|
||||
[Languages.English]: 'en-US',
|
||||
[Languages.Espanol]: 'es-419',
|
||||
[Languages.Chinese]: 'zh',
|
||||
[Languages.ChineseTrandational]: 'zh-Hant',
|
||||
[Languages.Dothraki]: 'mis'
|
||||
};
|
||||
|
||||
export const hiddenLangs = ['dothraki'];
|
||||
@@ -143,6 +118,71 @@ export const rtlLangs = [''];
|
||||
|
||||
> [!NOTE] Wenn eine Sprache in der Deployment-Pipeline eingerichtet wurde UND eine öffentliche `/news`-Instanz live ist, kann sie aus dem `hiddenLangs`-Array entfernt und der Öffentlichkeit zugänglich gemacht werden.
|
||||
|
||||
### Configure the Language Superblock Order
|
||||
|
||||
In the [config/superblock-order.ts](https://github.com/freeCodeCamp/freeCodeCamp/blob/main/config/superblock-order.ts) file, you need to set the order and state of all the superblocks for the new language in the `superBlockOrder` object. Copy one of the language keys and all its values, paste it to the bottom of the object (or wherever), and change the key to your new language from the `Languages` enum.
|
||||
|
||||
```js
|
||||
export const superBlockOrder: SuperBlockOrder = {
|
||||
...
|
||||
[Languages.Dothraki]: {
|
||||
[CurriculumMaps.Landing]: [
|
||||
SuperBlocks.RespWebDesignNew,
|
||||
SuperBlocks.JsAlgoDataStruct,
|
||||
SuperBlocks.FrontEndDevLibs,
|
||||
SuperBlocks.DataVis,
|
||||
SuperBlocks.RelationalDb,
|
||||
SuperBlocks.BackEndDevApis,
|
||||
SuperBlocks.QualityAssurance,
|
||||
SuperBlocks.SciCompPy,
|
||||
SuperBlocks.DataAnalysisPy,
|
||||
SuperBlocks.InfoSec,
|
||||
SuperBlocks.MachineLearningPy
|
||||
],
|
||||
[CurriculumMaps.Learn]: {
|
||||
[TranslationStates.Audited]: {
|
||||
[SuperBlockStates.Current]: [
|
||||
SuperBlocks.RespWebDesignNew,
|
||||
SuperBlocks.JsAlgoDataStruct,
|
||||
SuperBlocks.FrontEndDevLibs,
|
||||
SuperBlocks.DataVis,
|
||||
SuperBlocks.RelationalDb,
|
||||
SuperBlocks.BackEndDevApis,
|
||||
SuperBlocks.QualityAssurance,
|
||||
SuperBlocks.SciCompPy,
|
||||
SuperBlocks.DataAnalysisPy,
|
||||
SuperBlocks.InfoSec,
|
||||
SuperBlocks.MachineLearningPy,
|
||||
SuperBlocks.CodingInterviewPrep
|
||||
],
|
||||
[SuperBlockStates.New]: [],
|
||||
[SuperBlockStates.Upcoming]: [SuperBlocks.JsAlgoDataStructNew],
|
||||
[SuperBlockStates.Legacy]: [SuperBlocks.RespWebDesign]
|
||||
},
|
||||
[TranslationStates.NotAudited]: {
|
||||
[SuperBlockStates.Current]: [],
|
||||
[SuperBlockStates.New]: [],
|
||||
[SuperBlockStates.Upcoming]: [],
|
||||
[SuperBlockStates.Legacy]: []
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
The order of the superblocks in this object is how they appear on the "Landing" page and "Learn" maps. Follow the comments in that file so you know how you are allowed to order the superblocks, then move them to their proper places for the new language.
|
||||
|
||||
> [!ATTENTION] Do not change the order of any of the keys in the object, just move the superblocks to the different arrays
|
||||
|
||||
The `CurriculumMaps.Landing` array should contain exactly one superblock for all our current certifications, and the `CurriculumMaps.Learn` object should have all existing superblocks in it. Translated superblocks go in `TranslationStates.Audited` and non-translated superblocks go in `TranslationStates.NotAudited`. Each of those two objects has four different states a superblock can be in.
|
||||
|
||||
- `SuperBlockStates.Current`: Means that the superblock is current, `(New) Responsive Web Design` for example.
|
||||
- `SuperBlockStates.New`: These only show up when `SHOW_NEW_CURRICULUM` is set to `true` in your `.env` file. It is for displaying new superblocks on a specific build. For example, when we released the new RWD, we only showed in on English to start.
|
||||
- `SuperBlockStates.Upcoming`: These only show up when `SHOW_UPCOMING_CHANGES` is set to `true` in your `.env` file. It is to show superblocks locally while they are in development. Or, if you just need to hide a superblock from the map for some other reason.
|
||||
- `SuperBlockStates.Legacy`: A superblock is moved here when a newer version of that superblock has been fully translated and replaced it.
|
||||
|
||||
### Configure Search
|
||||
|
||||
Als nächstes öffnest du die Datei `client/src/utils/algolia-locale-setup.ts`. Diese Daten werden für die Suchleiste verwendet, die `/news `-Artikel lädt. Es ist zwar unwahrscheinlich, dass du diese Funktion testen wirst, aber das Fehlen der Daten für deine Sprache kann zu Fehlern führen, wenn du versuchst, die Codebasis lokal zu erstellen.
|
||||
|
||||
Füge ein Objekt für deine Sprache zum `algoliaIndices`-Objekt hinzu. Du solltest die gleichen Werte wie das `english`-Objekt für lokale Tests verwenden, indem du den `english`-Schlüssel durch den `availableLangs`-Wert deiner Sprache ersetzt.
|
||||
@@ -176,30 +216,6 @@ const algoliaIndices = {
|
||||
};
|
||||
```
|
||||
|
||||
### Freigabe eines Superblocks
|
||||
|
||||
Nachdem ein Superblock vollständig in eine Sprache übersetzt worden ist, gibt es zwei Schritte, um ihn freizugeben. Füge zunächst den Superblock enum zum Array `auditedCerts` dieser Sprache hinzu. Wenn du also den neuen Responsive Web Design-Superblock für Dothraki freigeben willst, sollte das Array wie folgt aussehen:
|
||||
|
||||
```ts
|
||||
export const auditedCerts = {
|
||||
// other languages
|
||||
dothraki: [
|
||||
SuperBlocks.RespWebDesignNew, // the newly translated superblock
|
||||
SuperBlocks.RespWebDesign,
|
||||
SuperBlocks.JsAlgoDataStruct,
|
||||
SuperBlocks.FrontEndDevLibs
|
||||
]
|
||||
};
|
||||
```
|
||||
|
||||
Wenn sich der Superblock in einem "neuen" Zustand befindet (d. h. einen alten Superblock ersetzt), sollte das Array `languagesWithAuditedBetaReleases` wie folgt aktualisiert werden, um die neue Sprache aufzunehmen:
|
||||
|
||||
```ts
|
||||
export const languagesWithAuditedBetaReleases: ['english', 'dothraki'];
|
||||
```
|
||||
|
||||
Dadurch wird der neue Superblock an die richtige Stelle in der Lehrplanübersicht auf `/learn` verschoben.
|
||||
|
||||
## Aktivieren von lokalisierten Videos
|
||||
|
||||
Für die Videoaufgaben musst du ein paar Dinge ändern. Füge zunächst das neue Gebietsschema zur GraphQL-Abfrage in der Datei `client/src/templates/Challenges/video/Show.tsx` ein. Zum Beispiel, indem man Dothraki zur Abfrage hinzufügt:
|
||||
|
||||
@@ -80,7 +80,7 @@ Some community members also develop on Windows 10 natively with Git for Windows
|
||||
|
||||
| Voraussetzung | Version | Notizen |
|
||||
| --------------------------------------------------------------------------------------------- | ------- | ---------------------------------------------------------------------------------------------------- |
|
||||
| [Node.js](http://nodejs.org) | `16.x` | Wir verwenden die "Active LTS"-Version, siehe [LTS Schedule](https://nodejs.org/en/about/releases/). |
|
||||
| [Node.js](http://nodejs.org) | `18.x` | Wir verwenden die "Active LTS"-Version, siehe [LTS Schedule](https://nodejs.org/en/about/releases/). |
|
||||
| npm (wird mit Node mitgeliefert) | `8.x` | Wir verwenden die Version, die mit Node.js Active LTS ausgeliefert wird. |
|
||||
| [MongoDB Community-Server](https://docs.mongodb.com/manual/administration/install-community/) | `4.2.x` | - |
|
||||
|
||||
|
||||
@@ -17,8 +17,8 @@ Wir wollen verstehen, wie die i18n-Frameworks und -Werkzeuge funktionieren.
|
||||
Die meisten Dateien für die Übersetzung der Plattform befinden sich im Ordner [`client/i18n`](https://github.com/freeCodeCamp/freeCodeCamp/tree/main/client/i18n). Für jede Sprache gibt es ein Verzeichnis, das JSON-Dateien mit den Übersetzungen enthält.
|
||||
|
||||
```console
|
||||
config/i18n
|
||||
└── all-langs.ts
|
||||
config
|
||||
└── i18n.ts
|
||||
...
|
||||
client/i18n
|
||||
├── configForTests.js
|
||||
@@ -29,37 +29,33 @@ Die meisten Dateien für die Übersetzung der Plattform befinden sich im Ordner
|
||||
│ │ ├── links.json
|
||||
│ │ ├── meta-tags.json
|
||||
│ │ ├── motivation.json
|
||||
│ │ ├── translations.json
|
||||
│ │ └── trending.json
|
||||
│ │ └── translations.json
|
||||
... ...
|
||||
│ ├── dothraki
|
||||
│ │ ├── intro.json
|
||||
│ │ ├── links.json
|
||||
│ │ ├── meta-tags.json
|
||||
│ │ ├── motivation.json
|
||||
│ │ ├── translations.json
|
||||
│ │ └── trending.json
|
||||
│ │ └── translations.json
|
||||
... ...
|
||||
│ ├── english
|
||||
│ │ ├── intro.json
|
||||
│ │ ├── links.json
|
||||
│ │ ├── meta-tags.json
|
||||
│ │ ├── motivation.json
|
||||
│ │ ├── translations.json
|
||||
│ │ └── trending.json
|
||||
│ │ └── translations.json
|
||||
│ └── espanol
|
||||
│ ├── intro.json
|
||||
│ ├── links.json
|
||||
│ ├── meta-tags.json
|
||||
│ ├── motivation.json
|
||||
│ ├── translations.json
|
||||
│ └── trending.json
|
||||
│ └── translations.json
|
||||
├── locales.test.js
|
||||
├── schema-validation.js
|
||||
└── validate-keys.ts
|
||||
```
|
||||
|
||||
Einige dieser Dateien werden auf unserer Übersetzungsplattform (Crowdin) übersetzt, andere nicht.
|
||||
Some of these files are translated on our translation platform (Crowdin), some are translated or created via PR's on GitHub.
|
||||
|
||||
**Dateien, die auf unserer Übersetzungsplattform übersetzt wurden:**
|
||||
|
||||
@@ -73,28 +69,27 @@ Einige dieser Dateien werden auf unserer Übersetzungsplattform (Crowdin) übers
|
||||
|
||||
- Die `motivation.json` Dateien müssen nicht die gleichen Zitate, Komplimente oder Array-Längen haben. Nur die gleiche JSON-Struktur.
|
||||
|
||||
- Die Datei `trending.json` enthält die Titel und Links für die angesagtesten Nachrichtenartikel in der Fußzeile der Website.
|
||||
- The `meta-tags.json` file contains the information for our website's meta tag information.
|
||||
|
||||
- Die Datei `meta-tags.json` enthält die Informationen für die Meta-Tag-Informationen unserer Website.
|
||||
|
||||
Änderungen an diesen Dateien werden normalerweise von dem Mitarbeiterteam vorgenommen. Wenn dir etwas Ungewöhnliches auffällt, empfehlen wir dir, uns im [Contributors Chat Room](https://discord.gg/PRyKn3Vbay) zu kontaktieren.
|
||||
Changes to these files are typically done by the staff team. If you see something out of the ordinary we recommend you reach us in the [contributors chat room](https://discord.gg/PRyKn3Vbay).
|
||||
|
||||
## Das Testen der Client-App in einer Weltsprache
|
||||
|
||||
Du kannst die Client-App in jeder Sprache testen, die in der [Liste der Sprachen](https://github.com/freeCodeCamp/freeCodeCamp/blob/main/config/i18n/all-langs.ts) verfügbar ist.
|
||||
You can test the client app in any language available in the [list of `availableLangs` here](https://github.com/freeCodeCamp/freeCodeCamp/blob/main/config/i18n.ts).
|
||||
|
||||
```js
|
||||
export const availableLangs = {
|
||||
export const availableLangs = {
|
||||
client: [
|
||||
'english',
|
||||
'espanol',
|
||||
'chinese',
|
||||
'chinese-traditional',
|
||||
'italian',
|
||||
'portuguese',
|
||||
'ukrainian',
|
||||
'japanese',
|
||||
'german'
|
||||
Languages.English,
|
||||
Languages.Espanol,
|
||||
Languages.Chinese,
|
||||
Languages.ChineseTrandational,
|
||||
Languages.Italian,
|
||||
Languages.Portuguese,
|
||||
Languages.Ukrainian,
|
||||
Languages.Japanese,
|
||||
Languages.German,
|
||||
Languages.Arabic
|
||||
],
|
||||
...
|
||||
};
|
||||
@@ -102,11 +97,11 @@ Du kannst die Client-App in jeder Sprache testen, die in der [Liste der Sprachen
|
||||
|
||||
Wenn du eine neue Sprache testest, erstelle einen Ordner mit dem Namen der Sprache als Titel neben den anderen Sprachen und kopiere die JSON-Dateien aus einer anderen Sprache in deinen neuen Ordner.
|
||||
|
||||
Füge die Sprache zum `client`-Array hinzu, wie oben in der [`config/i18n/all-langs.ts`](https://github.com/freeCodeCamp/freeCodeCamp/blob/main/config/i18n/all-langs.ts) Datei zu sehen.
|
||||
Add the new language to the `Languages` enum and the `client` array at the top of the [`config/i18n.ts`](https://github.com/freeCodeCamp/freeCodeCamp/blob/main/config/i18n.ts) file.
|
||||
|
||||
Befolge dann die Anweisungen in den Kommentaren in derselben Datei, um die restlichen Variablen nach Bedarf hinzuzufügen/zu aktualisieren.
|
||||
|
||||
Zum Schluss stellst du die Variable `CLIENT_LOCALE` in deiner `.env`-Datei auf die Sprache ein, die du verwenden willst, und schon bist du fertig.
|
||||
Finally, set the `CLIENT_LOCALE` variable in your `.env` file to the string of the locale you want to build from the `Languages` enum in the above file.
|
||||
|
||||
## Wie du Komponenten strukturierst
|
||||
|
||||
|
||||
@@ -51,8 +51,8 @@ Ci sono alcuni step da svolgere per consentire il build del codebase nella lingu
|
||||
|
||||
Per prima cosa, visita il file `config/i18n.ts` per aggiungere la lingua alla lista delle lingue disponibili e configurare i valori. Qui ci sono diversi oggetti.
|
||||
|
||||
- `availableLangs`: per entrambi gli array `client` e `curriculum`, aggiungi il testo del nome della lingua. Questo è il valore che sarà usato nel file `.env` più tardi.
|
||||
- `auditedCerts`: Aggiungi il nome della lingua come _chiave_ e aggiungi un array di variabili `SuperBlocks.{cert}` come _valore_. Questo dice al client quali certificazioni sono completamente tradotte.
|
||||
- `Languages`: Add the new language to `Languages` enum, similar to the others. The string value here will be used in the `.env` file to set a build language later.
|
||||
- `availableLangs`: Add the new property from the `Languages` enum to both the `client` and `curriculum` arrays.
|
||||
- `i18nextCodes`: Questi sono i codici ISO per le varie lingue. Dovrai aggiungere il codice ISO appropriato per la lingua che stai attivando. Devono essere unici per ogni lingua.
|
||||
- `LangNames`: Questi sono i nomi delle lingue visualizzati nel menu di navigazione.
|
||||
- `LangCodes`: Questi sono i codici delle lingue usati per formattare date e numeri. Questi devono essere codici Unicode CLDR invece di codici ISO.
|
||||
@@ -62,78 +62,53 @@ Per prima cosa, visita il file `config/i18n.ts` per aggiungere la lingua alla li
|
||||
Per esempio, se vuoi attivare la lingua Dothraki, il tuo oggetto `i18n.ts` dovrebbe essere come segue:
|
||||
|
||||
```js
|
||||
export const availableLangs = {
|
||||
client: ['english', 'espanol', 'chinese', 'chinese-traditional', 'dothraki'],
|
||||
curriculum: [
|
||||
'english',
|
||||
'espanol',
|
||||
'chinese',
|
||||
'chinese-traditional',
|
||||
'dothraki'
|
||||
]
|
||||
};
|
||||
export enum Languages {
|
||||
English = 'english',
|
||||
Espanol = 'espanol',
|
||||
Chinese = 'chinese',
|
||||
ChineseTrandational = 'chinese-traditional',
|
||||
Dothraki = 'dothraki'
|
||||
}
|
||||
|
||||
export const auditedCerts = {
|
||||
espanol: [
|
||||
SuperBlocks.RespWebDesign,
|
||||
SuperBlocks.JsAlgoDataStruct,
|
||||
SuperBlocks.FrontEndDevLibs,
|
||||
SuperBlocks.DataVis,
|
||||
SuperBlocks.BackEndDevApis
|
||||
export const availableLangs = {
|
||||
client: [
|
||||
Languages.English,
|
||||
Languages.Espanol,
|
||||
Languages.Chinese,
|
||||
Languages.ChineseTrandational,
|
||||
Languages.Dothraki
|
||||
],
|
||||
chinese: [
|
||||
SuperBlocks.RespWebDesign,
|
||||
SuperBlocks.JsAlgoDataStruct,
|
||||
SuperBlocks.FrontEndDevLibs,
|
||||
SuperBlocks.DataVis,
|
||||
SuperBlocks.BackEndDevApis,
|
||||
SuperBlocks.QualityAssurance,
|
||||
SuperBlocks.SciCompPy,
|
||||
SuperBlocks.DataAnalysisPy,
|
||||
SuperBlocks.InfoSec,
|
||||
SuperBlocks.MachineLearningPy
|
||||
],
|
||||
'chinese-traditional': [
|
||||
SuperBlocks.RespWebDesign,
|
||||
SuperBlocks.JsAlgoDataStruct,
|
||||
SuperBlocks.FrontEndDevLibs,
|
||||
SuperBlocks.DataVis,
|
||||
SuperBlocks.BackEndDevApis,
|
||||
SuperBlocks.QualityAssurance,
|
||||
SuperBlocks.SciCompPy,
|
||||
SuperBlocks.DataAnalysisPy,
|
||||
SuperBlocks.InfoSec,
|
||||
SuperBlocks.MachineLearningPy
|
||||
],
|
||||
dothraki: [
|
||||
SuperBlocks.RespWebDesign,
|
||||
SuperBlocks.JsAlgoDataStruct,
|
||||
SuperBlocks.FrontEndDevLibs
|
||||
curriculum: [
|
||||
Languages.English,
|
||||
Languages.Espanol,
|
||||
Languages.Chinese,
|
||||
Languages.ChineseTrandational,
|
||||
Languages.Dothraki
|
||||
]
|
||||
};
|
||||
|
||||
export const i18nextCodes = {
|
||||
english: 'en',
|
||||
espanol: 'es',
|
||||
chinese: 'zh',
|
||||
'chinese-traditional': 'zh-Hant',
|
||||
dothraki: 'mis'
|
||||
[Languages.English]: 'en',
|
||||
[Languages.Espanol]: 'es',
|
||||
[Languages.Chinese]: 'zh',
|
||||
[Languages.ChineseTrandational]: 'zh-Hant',
|
||||
[Languages.Dothraki]: 'mis'
|
||||
};
|
||||
|
||||
export enum LangNames = {
|
||||
english: 'English',
|
||||
espanol: 'Español',
|
||||
chinese: '中文（简体字）',
|
||||
'chinese-traditional': '中文（繁體字）',
|
||||
dothraki: 'Dothraki'
|
||||
[Languages.English]: 'English',
|
||||
[Languages.Espanol]: 'Español',
|
||||
[Languages.Chinese]: '中文（简体字）',
|
||||
[Languages.ChineseTrandational]: '中文（繁體字）',
|
||||
[Languages.Dothraki]: 'Dothraki'
|
||||
};
|
||||
|
||||
export enum LangCodes = {
|
||||
english: 'en-US',
|
||||
espanol: 'es-419',
|
||||
chinese: 'zh',
|
||||
'chinese-traditional': 'zh-Hant',
|
||||
dothraki: 'mis'
|
||||
[Languages.English]: 'en-US',
|
||||
[Languages.Espanol]: 'es-419',
|
||||
[Languages.Chinese]: 'zh',
|
||||
[Languages.ChineseTrandational]: 'zh-Hant',
|
||||
[Languages.Dothraki]: 'mis'
|
||||
};
|
||||
|
||||
export const hiddenLangs = ['dothraki'];
|
||||
@@ -143,6 +118,71 @@ export const rtlLangs = [''];
|
||||
|
||||
> [!NOTE] Quando è stato impostato il deployment per una lingua che ha già una sezione `/news` live, può essere rimossa dall'array `hiddenLangs` e resa disponibile al pubblico.
|
||||
|
||||
### Configure the Language Superblock Order
|
||||
|
||||
In the [config/superblock-order.ts](https://github.com/freeCodeCamp/freeCodeCamp/blob/main/config/superblock-order.ts) file, you need to set the order and state of all the superblocks for the new language in the `superBlockOrder` object. Copy one of the language keys and all its values, paste it to the bottom of the object (or wherever), and change the key to your new language from the `Languages` enum.
|
||||
|
||||
```js
|
||||
export const superBlockOrder: SuperBlockOrder = {
|
||||
...
|
||||
[Languages.Dothraki]: {
|
||||
[CurriculumMaps.Landing]: [
|
||||
SuperBlocks.RespWebDesignNew,
|
||||
SuperBlocks.JsAlgoDataStruct,
|
||||
SuperBlocks.FrontEndDevLibs,
|
||||
SuperBlocks.DataVis,
|
||||
SuperBlocks.RelationalDb,
|
||||
SuperBlocks.BackEndDevApis,
|
||||
SuperBlocks.QualityAssurance,
|
||||
SuperBlocks.SciCompPy,
|
||||
SuperBlocks.DataAnalysisPy,
|
||||
SuperBlocks.InfoSec,
|
||||
SuperBlocks.MachineLearningPy
|
||||
],
|
||||
[CurriculumMaps.Learn]: {
|
||||
[TranslationStates.Audited]: {
|
||||
[SuperBlockStates.Current]: [
|
||||
SuperBlocks.RespWebDesignNew,
|
||||
SuperBlocks.JsAlgoDataStruct,
|
||||
SuperBlocks.FrontEndDevLibs,
|
||||
SuperBlocks.DataVis,
|
||||
SuperBlocks.RelationalDb,
|
||||
SuperBlocks.BackEndDevApis,
|
||||
SuperBlocks.QualityAssurance,
|
||||
SuperBlocks.SciCompPy,
|
||||
SuperBlocks.DataAnalysisPy,
|
||||
SuperBlocks.InfoSec,
|
||||
SuperBlocks.MachineLearningPy,
|
||||
SuperBlocks.CodingInterviewPrep
|
||||
],
|
||||
[SuperBlockStates.New]: [],
|
||||
[SuperBlockStates.Upcoming]: [SuperBlocks.JsAlgoDataStructNew],
|
||||
[SuperBlockStates.Legacy]: [SuperBlocks.RespWebDesign]
|
||||
},
|
||||
[TranslationStates.NotAudited]: {
|
||||
[SuperBlockStates.Current]: [],
|
||||
[SuperBlockStates.New]: [],
|
||||
[SuperBlockStates.Upcoming]: [],
|
||||
[SuperBlockStates.Legacy]: []
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
The order of the superblocks in this object is how they appear on the "Landing" page and "Learn" maps. Follow the comments in that file so you know how you are allowed to order the superblocks, then move them to their proper places for the new language.
|
||||
|
||||
> [!ATTENTION] Do not change the order of any of the keys in the object, just move the superblocks to the different arrays
|
||||
|
||||
The `CurriculumMaps.Landing` array should contain exactly one superblock for all our current certifications, and the `CurriculumMaps.Learn` object should have all existing superblocks in it. Translated superblocks go in `TranslationStates.Audited` and non-translated superblocks go in `TranslationStates.NotAudited`. Each of those two objects has four different states a superblock can be in.
|
||||
|
||||
- `SuperBlockStates.Current`: Means that the superblock is current, `(New) Responsive Web Design` for example.
|
||||
- `SuperBlockStates.New`: These only show up when `SHOW_NEW_CURRICULUM` is set to `true` in your `.env` file. It is for displaying new superblocks on a specific build. For example, when we released the new RWD, we only showed in on English to start.
|
||||
- `SuperBlockStates.Upcoming`: These only show up when `SHOW_UPCOMING_CHANGES` is set to `true` in your `.env` file. It is to show superblocks locally while they are in development. Or, if you just need to hide a superblock from the map for some other reason.
|
||||
- `SuperBlockStates.Legacy`: A superblock is moved here when a newer version of that superblock has been fully translated and replaced it.
|
||||
|
||||
### Configure Search
|
||||
|
||||
Poi, apri il file `client/src/utils/algolia-locale-setup.ts`. Questi dati sono usati dalla barra di ricerca che carica gli articoli in `/news`. Anche se è poco probabile che tu stia testando questa funzione, se questi dati mancano per la tua lingua possono esserci degli errori nel costruire il codebase localmente.
|
||||
|
||||
Aggiungi un oggetto per la tua lingua all'oggetto `algoliaIndices`. Dovresti usare gli stessi valori dell'oggetto `english` per testare in locale, sostituendo la chiave `english` con il valore della tua lingua in `availableLangs`.
|
||||
@@ -176,29 +216,6 @@ const algoliaIndices = {
|
||||
};
|
||||
```
|
||||
|
||||
### Rilasciare un superblocco
|
||||
|
||||
Dopo che un superblocco è stato completamente tradotto in una lingua, ci sono due step per rilasciarlo. Come prima cosa aggiungi il superblocco enum all'array `auditedCerts` di quella lingua. Quindi, se vuoi rilasciare il nuovo superblocco Web Design Responsivo per Dothraki, l'array dovrebbe essere così:
|
||||
|
||||
```ts
|
||||
export const auditedCerts = {
|
||||
// other languages
|
||||
dothraki: [
|
||||
SuperBlocks.RespWebDesignNew, // the newly translated superblock
|
||||
SuperBlocks.RespWebDesign,
|
||||
SuperBlocks.JsAlgoDataStruct,
|
||||
SuperBlocks.FrontEndDevLibs
|
||||
]
|
||||
```
|
||||
|
||||
Infine, se il superblocco è nello stato "nuovo" (cioè sostituisce un superblocco legacy), l'array `languagesWithAuditedBetaReleases` dovrebbe essere aggiornato per includere la nuova lingua in questo modo:
|
||||
|
||||
```ts
|
||||
export const languagesWithAuditedBetaReleases: ['english', 'dothraki'];
|
||||
```
|
||||
|
||||
Questo sposterà il nuovo superblocco nel posto corretto nella mappa del curriculum su `/learn`.
|
||||
|
||||
## Attivare video localizzati
|
||||
|
||||
Per le sfide video, devi cambiare alcune cose. Come prima cosa aggiungi la nuova lingua alla query per GraphQL nel file `client/src/templates/Challenges/video/Show.tsx`. Per esempio, in questo modo aggiungeresti Dothraki alla query:
|
||||
|
||||
@@ -80,7 +80,7 @@ Alcuni membri della comunità sviluppano anche su Windows 10 nativamente con Git
|
||||
|
||||
| Prerequisito | Versione | Note |
|
||||
| --------------------------------------------------------------------------------------------- | -------- | -------------------------------------------------------------------------------------------- |
|
||||
| [Node.js](http://nodejs.org) | `16.x` | Usiamo la versione "Active LTS", Vedi [LTS Schedule](https://nodejs.org/en/about/releases/). |
|
||||
| [Node.js](http://nodejs.org) | `18.x` | Usiamo la versione "Active LTS", Vedi [LTS Schedule](https://nodejs.org/en/about/releases/). |
|
||||
| npm (viene fornito in bundle con node) | `8.x` | Usiamo la versione in bundle con Node.js Active LTS. |
|
||||
| [Server Community MongoDB](https://docs.mongodb.com/manual/administration/install-community/) | `4.2.x` | - |
|
||||
|
||||
|
||||
@@ -17,49 +17,45 @@ Andiamo a vedere come funzionano il framework e gli strumenti.
|
||||
La maggior parte dei file per tradurre la piattaforma si trovano nella cartella [`client/i18n`](https://github.com/freeCodeCamp/freeCodeCamp/tree/main/client/i18n). Ogni lingua ha una directory al suo interno che contiene file JSON con le traduzioni.
|
||||
|
||||
```console
|
||||
config/i18n
|
||||
└── all-langs.ts
|
||||
config
|
||||
└── i18n.ts
|
||||
...
|
||||
client/i18n
|
||||
client/i18n
|
||||
├── configForTests.js
|
||||
├── config.js
|
||||
├── locales
|
||||
│ ├── chinese
|
||||
│ │ ├── intro.json
|
||||
│ │ ├── links.json
|
||||
│ │ ├── meta-tags.json
|
||||
│ │ ├── motivation.json
|
||||
│ │ ├── translations.json
|
||||
│ │ └── trending.json
|
||||
│ ├── chinese
|
||||
│ │ ├── intro.json
|
||||
│ │ ├── links.json
|
||||
│ │ ├── meta-tags.json
|
||||
│ │ ├── motivation.json
|
||||
│ │ └── translations.json
|
||||
... ...
|
||||
│ ├── dothraki
|
||||
│ │ ├── intro.json
|
||||
│ │ ├── links.json
|
||||
│ │ ├── meta-tags.json
|
||||
│ │ ├── motivation.json
|
||||
│ │ ├── translations.json
|
||||
│ │ └── trending.json
|
||||
│ ├── dothraki
|
||||
│ │ ├── intro.json
|
||||
│ │ ├── links.json
|
||||
│ │ ├── meta-tags.json
|
||||
│ │ ├── motivation.json
|
||||
│ │ └── translations.json
|
||||
... ...
|
||||
│ ├── english
|
||||
│ │ ├── intro.json
|
||||
│ │ ├── links.json
|
||||
│ │ ├── meta-tags.json
|
||||
│ │ ├── motivation.json
|
||||
│ │ ├── translations.json
|
||||
│ │ └── trending.json
|
||||
│ └── espanol
|
||||
│ ├── intro.json
|
||||
│ ├── links.json
|
||||
│ ├── meta-tags.json
|
||||
│ ├── motivation.json
|
||||
│ ├── translations.json
|
||||
│ └── trending.json
|
||||
│ ├── english
|
||||
│ │ ├── intro.json
|
||||
│ │ ├── links.json
|
||||
│ │ ├── meta-tags.json
|
||||
│ │ ├── motivation.json
|
||||
│ │ └── translations.json
|
||||
│ └── espanol
|
||||
│ ├── intro.json
|
||||
│ ├── links.json
|
||||
│ ├── meta-tags.json
|
||||
│ ├── motivation.json
|
||||
│ └── translations.json
|
||||
├── locales.test.js
|
||||
├── schema-validation.js
|
||||
└── validate-keys.ts
|
||||
```
|
||||
|
||||
Alcuni di questi file sono tradotti sulla nostra piattaforma di traduzione (Crowdin), altri no.
|
||||
Some of these files are translated on our translation platform (Crowdin), some are translated or created via PR's on GitHub.
|
||||
|
||||
**File tradotti con la nostra piattaforma di traduzione:**
|
||||
|
||||
@@ -73,28 +69,27 @@ Alcuni di questi file sono tradotti sulla nostra piattaforma di traduzione (Crow
|
||||
|
||||
- I file `motivation.json` non devono avere per forza le stesse frasi, complimenti o lunghezze degli array. Basta che abbiano la stessa struttura JSON.
|
||||
|
||||
- Il file `trending.json` contiene i titoli e i link ai nuovi articoli di tendenza all'interno del footer del sito.
|
||||
- The `meta-tags.json` file contains the information for our website's meta tag information.
|
||||
|
||||
- Il file `meta-tags.json` contiene le informazioni per il meta tag del nostro sito.
|
||||
|
||||
I cambiamenti su questi file sono tipicamente fatti dallo staff. Se vedi qualcosa fuori dall'ordinario, ti raccomandiamo di metterti in contatto con noi sulla [chat dei contributori](https://discord.gg/PRyKn3Vbay).
|
||||
Changes to these files are typically done by the staff team. If you see something out of the ordinary we recommend you reach us in the [contributors chat room](https://discord.gg/PRyKn3Vbay).
|
||||
|
||||
## Testare la app client in una lingua internazionale
|
||||
|
||||
Puoi testare la app client in ogni lingua disponibile nell'[elenco delle lingue](https://github.com/freeCodeCamp/freeCodeCamp/blob/main/config/i18n/all-langs.ts).
|
||||
You can test the client app in any language available in the [list of `availableLangs` here](https://github.com/freeCodeCamp/freeCodeCamp/blob/main/config/i18n.ts).
|
||||
|
||||
```js
|
||||
export const availableLangs = {
|
||||
export const availableLangs = {
|
||||
client: [
|
||||
'english',
|
||||
'espanol',
|
||||
'chinese',
|
||||
'chinese-traditional',
|
||||
'italian',
|
||||
'portuguese',
|
||||
'ukrainian',
|
||||
'japanese',
|
||||
'german'
|
||||
Languages.English,
|
||||
Languages.Espanol,
|
||||
Languages.Chinese,
|
||||
Languages.ChineseTrandational,
|
||||
Languages.Italian,
|
||||
Languages.Portuguese,
|
||||
Languages.Ukrainian,
|
||||
Languages.Japanese,
|
||||
Languages.German,
|
||||
Languages.Arabic
|
||||
],
|
||||
...
|
||||
};
|
||||
@@ -102,11 +97,11 @@ Puoi testare la app client in ogni lingua disponibile nell'[elenco delle lingue]
|
||||
|
||||
Se stai testando una nuova lingua, crea una cartella con il nome della lingua come titolo accanto alle altre lingue e copia i file JSON da un'altra lingua alla tua cartella.
|
||||
|
||||
Aggiungi la lingua all'array `client` come visto sopra nel file [`config/i18n/all-langs.ts`](https://github.com/freeCodeCamp/freeCodeCamp/blob/main/config/i18n/all-langs.ts).
|
||||
Add the new language to the `Languages` enum and the `client` array at the top of the [`config/i18n.ts`](https://github.com/freeCodeCamp/freeCodeCamp/blob/main/config/i18n.ts) file.
|
||||
|
||||
Successivamente, segui le istruzioni nei commenti nello stesso file per aggiungere/aggiornare il resto delle variabili secondo necessità.
|
||||
|
||||
Infine, imposta la variabile `CLIENT_LOCALE` nel tuo file `.env` alla lingua che vuoi sviluppare e hai finito.
|
||||
Finally, set the `CLIENT_LOCALE` variable in your `.env` file to the string of the locale you want to build from the `Languages` enum in the above file.
|
||||
|
||||
## Come strutturare i componenti
|
||||
|
||||
|
||||
@@ -51,8 +51,8 @@ There are a few steps to take in order to allow the codebase to build in your de
|
||||
|
||||
First, visit the `config/i18n.ts` file to add the language to the list of available languages and configure the values. There are several objects here.
|
||||
|
||||
- `availableLangs`: For both the `client` and `curriculum` arrays, add the text name of the language. This is the value that will be used in the `.env` file later.
|
||||
- `auditedCerts`: Add the text name of the language as the _key_, and add an array of `SuperBlocks.{cert}` variables as the _value_. This tells the client which certifications are fully translated.
|
||||
- `Languages`: Add the new language to `Languages` enum, similar to the others. The string value here will be used in the `.env` file to set a build language later.
|
||||
- `availableLangs`: Add the new property from the `Languages` enum to both the `client` and `curriculum` arrays.
|
||||
- `i18nextCodes`: These are the ISO language codes for each language. You will need to add the appropriate ISO code for the language you are enabling. These do need to be unique for each language.
|
||||
- `LangNames`: These are the display names for the language selector in the navigation menu.
|
||||
- `LangCodes`: These are the language codes used for formatting dates and numbers. These should be Unicode CLDR codes instead of ISO codes.
|
||||
@@ -62,78 +62,53 @@ First, visit the `config/i18n.ts` file to add the language to the list of availa
|
||||
As an example, if you wanted to enable Dothraki as a language, your `i18n.ts` objects should look like this:
|
||||
|
||||
```js
|
||||
export const availableLangs = {
|
||||
client: ['english', 'espanol', 'chinese', 'chinese-traditional', 'dothraki'],
|
||||
curriculum: [
|
||||
'english',
|
||||
'espanol',
|
||||
'chinese',
|
||||
'chinese-traditional',
|
||||
'dothraki'
|
||||
]
|
||||
};
|
||||
export enum Languages {
|
||||
English = 'english',
|
||||
Espanol = 'espanol',
|
||||
Chinese = 'chinese',
|
||||
ChineseTrandational = 'chinese-traditional',
|
||||
Dothraki = 'dothraki'
|
||||
}
|
||||
|
||||
export const auditedCerts = {
|
||||
espanol: [
|
||||
SuperBlocks.RespWebDesign,
|
||||
SuperBlocks.JsAlgoDataStruct,
|
||||
SuperBlocks.FrontEndDevLibs,
|
||||
SuperBlocks.DataVis,
|
||||
SuperBlocks.BackEndDevApis
|
||||
export const availableLangs = {
|
||||
client: [
|
||||
Languages.English,
|
||||
Languages.Espanol,
|
||||
Languages.Chinese,
|
||||
Languages.ChineseTrandational,
|
||||
Languages.Dothraki
|
||||
],
|
||||
chinese: [
|
||||
SuperBlocks.RespWebDesign,
|
||||
SuperBlocks.JsAlgoDataStruct,
|
||||
SuperBlocks.FrontEndDevLibs,
|
||||
SuperBlocks.DataVis,
|
||||
SuperBlocks.BackEndDevApis,
|
||||
SuperBlocks.QualityAssurance,
|
||||
SuperBlocks.SciCompPy,
|
||||
SuperBlocks.DataAnalysisPy,
|
||||
SuperBlocks.InfoSec,
|
||||
SuperBlocks.MachineLearningPy
|
||||
],
|
||||
'chinese-traditional': [
|
||||
SuperBlocks.RespWebDesign,
|
||||
SuperBlocks.JsAlgoDataStruct,
|
||||
SuperBlocks.FrontEndDevLibs,
|
||||
SuperBlocks.DataVis,
|
||||
SuperBlocks.BackEndDevApis,
|
||||
SuperBlocks.QualityAssurance,
|
||||
SuperBlocks.SciCompPy,
|
||||
SuperBlocks.DataAnalysisPy,
|
||||
SuperBlocks.InfoSec,
|
||||
SuperBlocks.MachineLearningPy
|
||||
],
|
||||
dothraki: [
|
||||
SuperBlocks.RespWebDesign,
|
||||
SuperBlocks.JsAlgoDataStruct,
|
||||
SuperBlocks.FrontEndDevLibs
|
||||
curriculum: [
|
||||
Languages.English,
|
||||
Languages.Espanol,
|
||||
Languages.Chinese,
|
||||
Languages.ChineseTrandational,
|
||||
Languages.Dothraki
|
||||
]
|
||||
};
|
||||
|
||||
export const i18nextCodes = {
|
||||
english: 'en',
|
||||
espanol: 'es',
|
||||
chinese: 'zh',
|
||||
'chinese-traditional': 'zh-Hant',
|
||||
dothraki: 'mis'
|
||||
[Languages.English]: 'en',
|
||||
[Languages.Espanol]: 'es',
|
||||
[Languages.Chinese]: 'zh',
|
||||
[Languages.ChineseTrandational]: 'zh-Hant',
|
||||
[Languages.Dothraki]: 'mis'
|
||||
};
|
||||
|
||||
export enum LangNames = {
|
||||
english: 'English',
|
||||
espanol: 'Español',
|
||||
chinese: '中文（简体字）',
|
||||
'chinese-traditional': '中文（繁體字）',
|
||||
dothraki: 'Dothraki'
|
||||
[Languages.English]: 'English',
|
||||
[Languages.Espanol]: 'Español',
|
||||
[Languages.Chinese]: '中文（简体字）',
|
||||
[Languages.ChineseTrandational]: '中文（繁體字）',
|
||||
[Languages.Dothraki]: 'Dothraki'
|
||||
};
|
||||
|
||||
export enum LangCodes = {
|
||||
english: 'en-US',
|
||||
espanol: 'es-419',
|
||||
chinese: 'zh',
|
||||
'chinese-traditional': 'zh-Hant',
|
||||
dothraki: 'mis'
|
||||
[Languages.English]: 'en-US',
|
||||
[Languages.Espanol]: 'es-419',
|
||||
[Languages.Chinese]: 'zh',
|
||||
[Languages.ChineseTrandational]: 'zh-Hant',
|
||||
[Languages.Dothraki]: 'mis'
|
||||
};
|
||||
|
||||
export const hiddenLangs = ['dothraki'];
|
||||
@@ -143,6 +118,71 @@ export const rtlLangs = [''];
|
||||
|
||||
> [!NOTE] When a language has been set up in the deployment pipeline AND has a public `/news` instance live, it can be removed from the `hiddenLangs` array and be made available to the public.
|
||||
|
||||
### Configure the Language Superblock Order
|
||||
|
||||
In the [config/superblock-order.ts](https://github.com/freeCodeCamp/freeCodeCamp/blob/main/config/superblock-order.ts) file, you need to set the order and state of all the superblocks for the new language in the `superBlockOrder` object. Copy one of the language keys and all its values, paste it to the bottom of the object (or wherever), and change the key to your new language from the `Languages` enum.
|
||||
|
||||
```js
|
||||
export const superBlockOrder: SuperBlockOrder = {
|
||||
...
|
||||
[Languages.Dothraki]: {
|
||||
[CurriculumMaps.Landing]: [
|
||||
SuperBlocks.RespWebDesignNew,
|
||||
SuperBlocks.JsAlgoDataStruct,
|
||||
SuperBlocks.FrontEndDevLibs,
|
||||
SuperBlocks.DataVis,
|
||||
SuperBlocks.RelationalDb,
|
||||
SuperBlocks.BackEndDevApis,
|
||||
SuperBlocks.QualityAssurance,
|
||||
SuperBlocks.SciCompPy,
|
||||
SuperBlocks.DataAnalysisPy,
|
||||
SuperBlocks.InfoSec,
|
||||
SuperBlocks.MachineLearningPy
|
||||
],
|
||||
[CurriculumMaps.Learn]: {
|
||||
[TranslationStates.Audited]: {
|
||||
[SuperBlockStates.Current]: [
|
||||
SuperBlocks.RespWebDesignNew,
|
||||
SuperBlocks.JsAlgoDataStruct,
|
||||
SuperBlocks.FrontEndDevLibs,
|
||||
SuperBlocks.DataVis,
|
||||
SuperBlocks.RelationalDb,
|
||||
SuperBlocks.BackEndDevApis,
|
||||
SuperBlocks.QualityAssurance,
|
||||
SuperBlocks.SciCompPy,
|
||||
SuperBlocks.DataAnalysisPy,
|
||||
SuperBlocks.InfoSec,
|
||||
SuperBlocks.MachineLearningPy,
|
||||
SuperBlocks.CodingInterviewPrep
|
||||
],
|
||||
[SuperBlockStates.New]: [],
|
||||
[SuperBlockStates.Upcoming]: [SuperBlocks.JsAlgoDataStructNew],
|
||||
[SuperBlockStates.Legacy]: [SuperBlocks.RespWebDesign]
|
||||
},
|
||||
[TranslationStates.NotAudited]: {
|
||||
[SuperBlockStates.Current]: [],
|
||||
[SuperBlockStates.New]: [],
|
||||
[SuperBlockStates.Upcoming]: [],
|
||||
[SuperBlockStates.Legacy]: []
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
The order of the superblocks in this object is how they appear on the "Landing" page and "Learn" maps. Follow the comments in that file so you know how you are allowed to order the superblocks, then move them to their proper places for the new language.
|
||||
|
||||
> [!ATTENTION] Do not change the order of any of the keys in the object, just move the superblocks to the different arrays
|
||||
|
||||
The `CurriculumMaps.Landing` array should contain exactly one superblock for all our current certifications, and the `CurriculumMaps.Learn` object should have all existing superblocks in it. Translated superblocks go in `TranslationStates.Audited` and non-translated superblocks go in `TranslationStates.NotAudited`. Each of those two objects has four different states a superblock can be in.
|
||||
|
||||
- `SuperBlockStates.Current`: Means that the superblock is current, `(New) Responsive Web Design` for example.
|
||||
- `SuperBlockStates.New`: These only show up when `SHOW_NEW_CURRICULUM` is set to `true` in your `.env` file. It is for displaying new superblocks on a specific build. For example, when we released the new RWD, we only showed in on English to start.
|
||||
- `SuperBlockStates.Upcoming`: These only show up when `SHOW_UPCOMING_CHANGES` is set to `true` in your `.env` file. It is to show superblocks locally while they are in development. Or, if you just need to hide a superblock from the map for some other reason.
|
||||
- `SuperBlockStates.Legacy`: A superblock is moved here when a newer version of that superblock has been fully translated and replaced it.
|
||||
|
||||
### Configure Search
|
||||
|
||||
Next, open the `client/src/utils/algolia-locale-setup.ts` file. This data is used for the search bar that loads `/news` articles. While it is unlikely that you are going to test this functionality, missing the data for your language can lead to errors when attempting to build the codebase locally.
|
||||
|
||||
Add an object for your language to the `algoliaIndices` object. You should use the the same values as the `english` object for local testing, replacing the `english` key with your language's `availableLangs` value.
|
||||
@@ -176,30 +216,6 @@ const algoliaIndices = {
|
||||
};
|
||||
```
|
||||
|
||||
### Releasing a Superblock
|
||||
|
||||
After a superblock has been fully translated into a language, there are two steps to release it. First add the superblock enum to that language's `auditedCerts` array. So, if you want to release the new Responsive Web Design superblock for Dothraki, the array should look like this:
|
||||
|
||||
```ts
|
||||
export const auditedCerts = {
|
||||
// other languages
|
||||
dothraki: [
|
||||
SuperBlocks.RespWebDesignNew, // the newly translated superblock
|
||||
SuperBlocks.RespWebDesign,
|
||||
SuperBlocks.JsAlgoDataStruct,
|
||||
SuperBlocks.FrontEndDevLibs
|
||||
]
|
||||
};
|
||||
```
|
||||
|
||||
Finally, if the superblock is in a "new" state (that is, replacing a legacy superblock), the `languagesWithAuditedBetaReleases` array should be updated to include the new language like this:
|
||||
|
||||
```ts
|
||||
export const languagesWithAuditedBetaReleases: ['english', 'dothraki'];
|
||||
```
|
||||
|
||||
This will move the new superblock to the correct place in the curriculum map on `/learn`.
|
||||
|
||||
## Enabling Localized Videos
|
||||
|
||||
For the video challenges, you need to change a few things. First add the new locale to the GraphQL query in the `client/src/templates/Challenges/video/Show.tsx` file. For example, adding Dothraki to the query:
|
||||
|
||||
@@ -80,7 +80,7 @@ Some community members also develop on Windows 10 natively with Git for Windows
|
||||
|
||||
| 必要条件 | バージョン | 注 |
|
||||
| --------------------------------------------------------------------------------------- | ------- | ---------------------------------------------------------------------------------------- |
|
||||
| [Node.js](http://nodejs.org) | `16.x` | 「Active LTS」バージョンを使用しています。[LTS スケジュール](https://nodejs.org/en/about/releases/) を参照してください。 |
|
||||
| [Node.js](http://nodejs.org) | `18.x` | 「Active LTS」バージョンを使用しています。[LTS スケジュール](https://nodejs.org/en/about/releases/) を参照してください。 |
|
||||
| npm (Nodeにバンドル) | `8.x` | Node.js Active LTS にバンドルされたバージョンを使用します。 |
|
||||
| [MongoDB コミュニティサーバー](https://docs.mongodb.com/manual/administration/install-community/) | `4.2.x` | - |
|
||||
|
||||
|
||||
@@ -17,8 +17,8 @@ i18n フレームワークとツールがどのように機能するかを理解
|
||||
プラットフォームを翻訳するために必要なファイルの多くは、[`client/i18n`](https://github.com/freeCodeCamp/freeCodeCamp/tree/main/client/i18n) フォルダに入っています。 各言語には、翻訳付きの JSON ファイルを含むディレクトリがあります。
|
||||
|
||||
```console
|
||||
config/i18n
|
||||
└── all-langs.ts
|
||||
config
|
||||
└── i18n.ts
|
||||
...
|
||||
client/i18n
|
||||
├── configForTests.js
|
||||
@@ -29,37 +29,33 @@ i18n フレームワークとツールがどのように機能するかを理解
|
||||
│ │ ├── links.json
|
||||
│ │ ├── meta-tags.json
|
||||
│ │ ├── motivation.json
|
||||
│ │ ├── translations.json
|
||||
│ │ └── trending.json
|
||||
│ │ └── translations.json
|
||||
... ...
|
||||
│ ├── dothraki
|
||||
│ │ ├── intro.json
|
||||
│ │ ├── links.json
|
||||
│ │ ├── meta-tags.json
|
||||
│ │ ├── motivation.json
|
||||
│ │ ├── translations.json
|
||||
│ │ └── trending.json
|
||||
│ │ └── translations.json
|
||||
... ...
|
||||
│ ├── english
|
||||
│ │ ├── intro.json
|
||||
│ │ ├── links.json
|
||||
│ │ ├── meta-tags.json
|
||||
│ │ ├── motivation.json
|
||||
│ │ ├── translations.json
|
||||
│ │ └── trending.json
|
||||
│ │ └── translations.json
|
||||
│ └── espanol
|
||||
│ ├── intro.json
|
||||
│ ├── links.json
|
||||
│ ├── meta-tags.json
|
||||
│ ├── motivation.json
|
||||
│ ├── translations.json
|
||||
│ └── trending.json
|
||||
│ └── translations.json
|
||||
├── locales.test.js
|
||||
├── schema-validation.js
|
||||
└── validate-keys.ts
|
||||
```
|
||||
|
||||
これらのファイルは翻訳プラットフォーム (Crowdin) で翻訳されていますが、翻訳されていないものもあります。
|
||||
Some of these files are translated on our translation platform (Crowdin), some are translated or created via PR's on GitHub.
|
||||
|
||||
**翻訳プラットフォーム上で翻訳されたファイル:**
|
||||
|
||||
@@ -73,28 +69,27 @@ i18n フレームワークとツールがどのように機能するかを理解
|
||||
|
||||
- `motivation.json` ファイルは、同じ引用符、賛辞、配列の長さを含む必要はありません。 JSON 構造だけは同じです。
|
||||
|
||||
- `trending.json` ファイルは、Web サイトのフッターにトレンドニュース記事のタイトルとリンクを含みます。
|
||||
- The `meta-tags.json` file contains the information for our website's meta tag information.
|
||||
|
||||
- `meta-tags.json` ファイルには、Web サイトのメタタグ情報に関する情報が含まれています。
|
||||
|
||||
これらのファイルの変更は通常、スタッフチームによって行われます。 If you see something out of the ordinary we recommend you reach us in the [contributors chat room](https://discord.gg/PRyKn3Vbay).
|
||||
Changes to these files are typically done by the staff team. If you see something out of the ordinary we recommend you reach us in the [contributors chat room](https://discord.gg/PRyKn3Vbay).
|
||||
|
||||
## 世界の言語でクライアントアプリをテストする
|
||||
|
||||
You can test the client app in any language available in the [list of languages here](https://github.com/freeCodeCamp/freeCodeCamp/blob/main/config/i18n/all-langs.ts).
|
||||
You can test the client app in any language available in the [list of `availableLangs` here](https://github.com/freeCodeCamp/freeCodeCamp/blob/main/config/i18n.ts).
|
||||
|
||||
```js
|
||||
export const availableLangs = {
|
||||
export const availableLangs = {
|
||||
client: [
|
||||
'english',
|
||||
'espanol',
|
||||
'chinese',
|
||||
'chinese-traditional',
|
||||
'italian',
|
||||
'portuguese',
|
||||
'ukrainian',
|
||||
'japanese',
|
||||
'german'
|
||||
Languages.English,
|
||||
Languages.Espanol,
|
||||
Languages.Chinese,
|
||||
Languages.ChineseTrandational,
|
||||
Languages.Italian,
|
||||
Languages.Portuguese,
|
||||
Languages.Ukrainian,
|
||||
Languages.Japanese,
|
||||
Languages.German,
|
||||
Languages.Arabic
|
||||
],
|
||||
...
|
||||
};
|
||||
@@ -102,11 +97,11 @@ You can test the client app in any language available in the [list of languages
|
||||
|
||||
新しい言語をテストするには、言語名をタイトルとしたフォルダを他の言語の隣に作成し、JSON ファイルを別の言語から新しいフォルダにコピーします。
|
||||
|
||||
Add the language to the `client` array as seen above in the [`config/i18n/all-langs.ts`](https://github.com/freeCodeCamp/freeCodeCamp/blob/main/config/i18n/all-langs.ts) file.
|
||||
Add the new language to the `Languages` enum and the `client` array at the top of the [`config/i18n.ts`](https://github.com/freeCodeCamp/freeCodeCamp/blob/main/config/i18n.ts) file.
|
||||
|
||||
次に、同じファイルのコメント指示に従って、必要に応じて残りの変数を追加 / 更新します。
|
||||
|
||||
最後に、`.env` ファイルの `CLIENT_LOCALE` 変数を、ビルドするロケールに設定します。これで準備が整います。
|
||||
Finally, set the `CLIENT_LOCALE` variable in your `.env` file to the string of the locale you want to build from the `Languages` enum in the above file.
|
||||
|
||||
## コンポーネントの構築方法
|
||||
|
||||
|
||||
@@ -51,8 +51,8 @@ Existem algumas etapas a serem seguidas para permitir que a base de código seja
|
||||
|
||||
Primeiro, visite o arquivo `config/i18n.ts` para adicionar o idioma à lista de idiomas disponíveis e configurar os valores. Existem vários objetos aqui.
|
||||
|
||||
- `availableLangs`: tanto para o array `client` quanto para o array `curriculum`, adicione o nome do idioma. Esse valor é o que será usado no arquivo `.env` depois.
|
||||
- `auditedCerts`: adicione o nome do texto do idioma como a _chave_ e adicione um array de variáveis `SuperBlocks.{cert}` como o _valor_. Isto informa ao cliente quais certificações estão totalmente traduzidas.
|
||||
- `Languages`: Add the new language to `Languages` enum, similar to the others. The string value here will be used in the `.env` file to set a build language later.
|
||||
- `availableLangs`: Add the new property from the `Languages` enum to both the `client` and `curriculum` arrays.
|
||||
- `i18nextCodes`: esses são os códigos ISO de cada linguagem. Você vai precisar do código ISO apropriado para o idioma que você está habilitando. Eles precisam ser únicos para cada idioma.
|
||||
- `LangNames`: esses são os nomes dos idiomas que aparecerão para a seleção no menu de navegação.
|
||||
- `LangCodes`: esses são os códigos de idiomas usados para formatar datas e números. Esses deverão ser códigos Unicode CLDR ao invés de códigos ISO.
|
||||
@@ -62,78 +62,53 @@ Primeiro, visite o arquivo `config/i18n.ts` para adicionar o idioma à lista de
|
||||
Como um exemplo, se você tivesse que habilitar o idioma Dothraki como seu idioma, os objetos `i18n.ts` devem ficar assim:
|
||||
|
||||
```js
|
||||
export const availableLangs = {
|
||||
client: ['english', 'espanol', 'chinese', 'chinese-traditional', 'dothraki'],
|
||||
curriculum: [
|
||||
'english',
|
||||
'espanol',
|
||||
'chinese',
|
||||
'chinese-traditional',
|
||||
'dothraki'
|
||||
]
|
||||
};
|
||||
export enum Languages {
|
||||
English = 'english',
|
||||
Espanol = 'espanol',
|
||||
Chinese = 'chinese',
|
||||
ChineseTrandational = 'chinese-traditional',
|
||||
Dothraki = 'dothraki'
|
||||
}
|
||||
|
||||
export const auditedCerts = {
|
||||
espanol: [
|
||||
SuperBlocks.RespWebDesign,
|
||||
SuperBlocks.JsAlgoDataStruct,
|
||||
SuperBlocks.FrontEndDevLibs,
|
||||
SuperBlocks.DataVis,
|
||||
SuperBlocks.BackEndDevApis
|
||||
export const availableLangs = {
|
||||
client: [
|
||||
Languages.English,
|
||||
Languages.Espanol,
|
||||
Languages.Chinese,
|
||||
Languages.ChineseTrandational,
|
||||
Languages.Dothraki
|
||||
],
|
||||
chinese: [
|
||||
SuperBlocks.RespWebDesign,
|
||||
SuperBlocks.JsAlgoDataStruct,
|
||||
SuperBlocks.FrontEndDevLibs,
|
||||
SuperBlocks.DataVis,
|
||||
SuperBlocks.BackEndDevApis,
|
||||
SuperBlocks.QualityAssurance,
|
||||
SuperBlocks.SciCompPy,
|
||||
SuperBlocks.DataAnalysisPy,
|
||||
SuperBlocks.InfoSec,
|
||||
SuperBlocks.MachineLearningPy
|
||||
],
|
||||
'chinese-traditional': [
|
||||
SuperBlocks.RespWebDesign,
|
||||
SuperBlocks.JsAlgoDataStruct,
|
||||
SuperBlocks.FrontEndDevLibs,
|
||||
SuperBlocks.DataVis,
|
||||
SuperBlocks.BackEndDevApis,
|
||||
SuperBlocks.QualityAssurance,
|
||||
SuperBlocks.SciCompPy,
|
||||
SuperBlocks.DataAnalysisPy,
|
||||
SuperBlocks.InfoSec,
|
||||
SuperBlocks.MachineLearningPy
|
||||
],
|
||||
dothraki: [
|
||||
SuperBlocks.RespWebDesign,
|
||||
SuperBlocks.JsAlgoDataStruct,
|
||||
SuperBlocks.FrontEndDevLibs
|
||||
curriculum: [
|
||||
Languages.English,
|
||||
Languages.Espanol,
|
||||
Languages.Chinese,
|
||||
Languages.ChineseTrandational,
|
||||
Languages.Dothraki
|
||||
]
|
||||
};
|
||||
|
||||
export const i18nextCodes = {
|
||||
english: 'en',
|
||||
espanol: 'es',
|
||||
chinese: 'zh',
|
||||
'chinese-traditional': 'zh-Hant',
|
||||
dothraki: 'mis'
|
||||
[Languages.English]: 'en',
|
||||
[Languages.Espanol]: 'es',
|
||||
[Languages.Chinese]: 'zh',
|
||||
[Languages.ChineseTrandational]: 'zh-Hant',
|
||||
[Languages.Dothraki]: 'mis'
|
||||
};
|
||||
|
||||
export enum LangNames = {
|
||||
english: 'English',
|
||||
espanol: 'Español',
|
||||
chinese: '中文（简体字）',
|
||||
'chinese-traditional': '中文（繁體字）',
|
||||
dothraki: 'Dothraki'
|
||||
[Languages.English]: 'English',
|
||||
[Languages.Espanol]: 'Español',
|
||||
[Languages.Chinese]: '中文（简体字）',
|
||||
[Languages.ChineseTrandational]: '中文（繁體字）',
|
||||
[Languages.Dothraki]: 'Dothraki'
|
||||
};
|
||||
|
||||
export enum LangCodes = {
|
||||
english: 'en-US',
|
||||
espanol: 'es-419',
|
||||
chinese: 'zh',
|
||||
'chinese-traditional': 'zh-Hant',
|
||||
dothraki: 'mis'
|
||||
[Languages.English]: 'en-US',
|
||||
[Languages.Espanol]: 'es-419',
|
||||
[Languages.Chinese]: 'zh',
|
||||
[Languages.ChineseTrandational]: 'zh-Hant',
|
||||
[Languages.Dothraki]: 'mis'
|
||||
};
|
||||
|
||||
export const hiddenLangs = ['dothraki'];
|
||||
@@ -143,6 +118,71 @@ export const rtlLangs = [''];
|
||||
|
||||
> [!NOTE] Quando um idioma for configurado no pipeline de implantação E tiver uma instância pública de `/news` ativa, ele pode ser removido da matriz `hiddenLangs` e ser disponibilizado ao público.
|
||||
|
||||
### Configure the Language Superblock Order
|
||||
|
||||
In the [config/superblock-order.ts](https://github.com/freeCodeCamp/freeCodeCamp/blob/main/config/superblock-order.ts) file, you need to set the order and state of all the superblocks for the new language in the `superBlockOrder` object. Copy one of the language keys and all its values, paste it to the bottom of the object (or wherever), and change the key to your new language from the `Languages` enum.
|
||||
|
||||
```js
|
||||
export const superBlockOrder: SuperBlockOrder = {
|
||||
...
|
||||
[Languages.Dothraki]: {
|
||||
[CurriculumMaps.Landing]: [
|
||||
SuperBlocks.RespWebDesignNew,
|
||||
SuperBlocks.JsAlgoDataStruct,
|
||||
SuperBlocks.FrontEndDevLibs,
|
||||
SuperBlocks.DataVis,
|
||||
SuperBlocks.RelationalDb,
|
||||
SuperBlocks.BackEndDevApis,
|
||||
SuperBlocks.QualityAssurance,
|
||||
SuperBlocks.SciCompPy,
|
||||
SuperBlocks.DataAnalysisPy,
|
||||
SuperBlocks.InfoSec,
|
||||
SuperBlocks.MachineLearningPy
|
||||
],
|
||||
[CurriculumMaps.Learn]: {
|
||||
[TranslationStates.Audited]: {
|
||||
[SuperBlockStates.Current]: [
|
||||
SuperBlocks.RespWebDesignNew,
|
||||
SuperBlocks.JsAlgoDataStruct,
|
||||
SuperBlocks.FrontEndDevLibs,
|
||||
SuperBlocks.DataVis,
|
||||
SuperBlocks.RelationalDb,
|
||||
SuperBlocks.BackEndDevApis,
|
||||
SuperBlocks.QualityAssurance,
|
||||
SuperBlocks.SciCompPy,
|
||||
SuperBlocks.DataAnalysisPy,
|
||||
SuperBlocks.InfoSec,
|
||||
SuperBlocks.MachineLearningPy,
|
||||
SuperBlocks.CodingInterviewPrep
|
||||
],
|
||||
[SuperBlockStates.New]: [],
|
||||
[SuperBlockStates.Upcoming]: [SuperBlocks.JsAlgoDataStructNew],
|
||||
[SuperBlockStates.Legacy]: [SuperBlocks.RespWebDesign]
|
||||
},
|
||||
[TranslationStates.NotAudited]: {
|
||||
[SuperBlockStates.Current]: [],
|
||||
[SuperBlockStates.New]: [],
|
||||
[SuperBlockStates.Upcoming]: [],
|
||||
[SuperBlockStates.Legacy]: []
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
The order of the superblocks in this object is how they appear on the "Landing" page and "Learn" maps. Follow the comments in that file so you know how you are allowed to order the superblocks, then move them to their proper places for the new language.
|
||||
|
||||
> [!ATTENTION] Do not change the order of any of the keys in the object, just move the superblocks to the different arrays
|
||||
|
||||
The `CurriculumMaps.Landing` array should contain exactly one superblock for all our current certifications, and the `CurriculumMaps.Learn` object should have all existing superblocks in it. Translated superblocks go in `TranslationStates.Audited` and non-translated superblocks go in `TranslationStates.NotAudited`. Each of those two objects has four different states a superblock can be in.
|
||||
|
||||
- `SuperBlockStates.Current`: Means that the superblock is current, `(New) Responsive Web Design` for example.
|
||||
- `SuperBlockStates.New`: These only show up when `SHOW_NEW_CURRICULUM` is set to `true` in your `.env` file. It is for displaying new superblocks on a specific build. For example, when we released the new RWD, we only showed in on English to start.
|
||||
- `SuperBlockStates.Upcoming`: These only show up when `SHOW_UPCOMING_CHANGES` is set to `true` in your `.env` file. It is to show superblocks locally while they are in development. Or, if you just need to hide a superblock from the map for some other reason.
|
||||
- `SuperBlockStates.Legacy`: A superblock is moved here when a newer version of that superblock has been fully translated and replaced it.
|
||||
|
||||
### Configure Search
|
||||
|
||||
Agora, abra o arquivo `client/src/utils/algolia-locale-setup.ts`. Esse dado é usado para a barra de busca que carrega os artigos `/news`. Embora seja improvável que você venha a testar essa funcionalidade, não ter os dados para o seu idioma pode levar a erros quando tentar criar a base de código localmente.
|
||||
|
||||
Adicione um objeto para seu idioma no objeto `algoliaIndices`. Você deve usar os mesmos valores do objeto `english` para o teste local, substituindo a chave `english` pelo valor de `availableLangs` do seu idioma.
|
||||
@@ -176,30 +216,6 @@ const algoliaIndices = {
|
||||
};
|
||||
```
|
||||
|
||||
### Liberar um superbloco
|
||||
|
||||
Após um superbloco ter sido totalmente traduzido para um idioma, há duas etapas necessárias para seu lançamento. Primeiro, adicione o enum do superblock ao array `auditedCerts` do idioma. Assim, se você quiser liberar o novo superbloco de Design Responsivo para a Web para o dothraki, o array deverá ter essa aparência:
|
||||
|
||||
```ts
|
||||
export const auditedCerts = {
|
||||
// other languages
|
||||
dothraki: [
|
||||
SuperBlocks.RespWebDesignNew, // the newly translated superblock
|
||||
SuperBlocks.RespWebDesign,
|
||||
SuperBlocks.JsAlgoDataStruct,
|
||||
SuperBlocks.FrontEndDevLibs
|
||||
]
|
||||
};
|
||||
```
|
||||
|
||||
Finalmente, se o superbloco estiver em um estado "new" (ou seja, substituindo um superbloco legado), o array de `languagesWithAuditedBetaReleases` deve ser atualizado para incluir o novo idioma, assim:
|
||||
|
||||
```ts
|
||||
export const languagesWithAuditedBetaReleases: ['english', 'dothraki'];
|
||||
```
|
||||
|
||||
Isso moverá o novo superbloco para o lugar correto no mapa do currículo em `/learn`.
|
||||
|
||||
## Ativando vídeos localizados
|
||||
|
||||
Para os desafios em vídeo, você precisa fazer algumas alterações. Primeiro, adicione o novo idioma (locale) à consulta do GraphQL no arquivo `client/src/templates/Challenges/video/Show.tsx`. Por exemplo, para adicionar Dothraki à consulta:
|
||||
|
||||
@@ -80,7 +80,7 @@ Alguns membros da comunidade também desenvolvem no Windows 10 nativamente com G
|
||||
|
||||
| Pré-requisito | Versão | Observações |
|
||||
| --------------------------------------------------------------------------------------------------- | ------- | ------------------------------------------------------------------------------------------- |
|
||||
| [Node.js](http://nodejs.org) | `16.x` | Usamos a versão "Active LTS". Consulte [Agenda LTS](https://nodejs.org/en/about/releases/). |
|
||||
| [Node.js](http://nodejs.org) | `18.x` | Usamos a versão "Active LTS". Consulte [Agenda LTS](https://nodejs.org/en/about/releases/). |
|
||||
| npm (vem junto com o Node) | `8.x` | Usamos a versão que vem com o Node.js Active LTS. |
|
||||
| [Servidor da Comunidade MongoDB](https://docs.mongodb.com/manual/administration/install-community/) | `4.2.x` | - |
|
||||
|
||||
|
||||
@@ -17,8 +17,8 @@ Vamos entender como o framework i18n e suas ferramentas funcionam.
|
||||
A maioria dos arquivos para tradução da plataforma ficam localizados na pasta [`client/i18n`](https://github.com/freeCodeCamp/freeCodeCamp/tree/main/client/i18n). Cada idioma tem uma pasta contendo arquivos JSON com as traduções.
|
||||
|
||||
```console
|
||||
config/i18n
|
||||
└── all-langs.ts
|
||||
config
|
||||
└── i18n.ts
|
||||
...
|
||||
client/i18n
|
||||
├── configForTests.js
|
||||
@@ -29,37 +29,33 @@ A maioria dos arquivos para tradução da plataforma ficam localizados na pasta
|
||||
│ │ ├── links.json
|
||||
│ │ ├── meta-tags.json
|
||||
│ │ ├── motivation.json
|
||||
│ │ ├── translations.json
|
||||
│ │ └── trending.json
|
||||
│ │ └── translations.json
|
||||
... ...
|
||||
│ ├── dothraki
|
||||
│ │ ├── intro.json
|
||||
│ │ ├── links.json
|
||||
│ │ ├── meta-tags.json
|
||||
│ │ ├── motivation.json
|
||||
│ │ ├── translations.json
|
||||
│ │ └── trending.json
|
||||
│ │ └── translations.json
|
||||
... ...
|
||||
│ ├── english
|
||||
│ │ ├── intro.json
|
||||
│ │ ├── links.json
|
||||
│ │ ├── meta-tags.json
|
||||
│ │ ├── motivation.json
|
||||
│ │ ├── translations.json
|
||||
│ │ └── trending.json
|
||||
│ │ └── translations.json
|
||||
│ └── espanol
|
||||
│ ├── intro.json
|
||||
│ ├── links.json
|
||||
│ ├── meta-tags.json
|
||||
│ ├── motivation.json
|
||||
│ ├── translations.json
|
||||
│ └── trending.json
|
||||
│ └── translations.json
|
||||
├── locales.test.js
|
||||
├── schema-validation.js
|
||||
└── validate-keys.ts
|
||||
```
|
||||
|
||||
Alguns desses arquivos estão traduzidos na nossa plataforma de tradução (Crowdin), outros não.
|
||||
Some of these files are translated on our translation platform (Crowdin), some are translated or created via PR's on GitHub.
|
||||
|
||||
**Arquivos traduzidos na nossa plataforma de tradução:**
|
||||
|
||||
@@ -73,28 +69,27 @@ Alguns desses arquivos estão traduzidos na nossa plataforma de tradução (Crow
|
||||
|
||||
- Os arquivos `motivation.json` não precisam ter as mesmas citações, elogios ou comprimento de array. Apenas a mesma estrutura do JSON.
|
||||
|
||||
- O arquivo `trending.json` contém os títulos e links para os artigos de notícias populares no rodapé do site.
|
||||
- The `meta-tags.json` file contains the information for our website's meta tag information.
|
||||
|
||||
- O arquivo `meta-tags.json` contém as informações para a tag meta do nosso site.
|
||||
|
||||
Mudanças nesses arquivos são tipicamente feitos pelo time da staff. Se você vir algo fora do ordinário, nós recomendamos que você nos contate na [sala de chat dos contribuidores](https://discord.gg/PRyKn3Vbay).
|
||||
Changes to these files are typically done by the staff team. If you see something out of the ordinary we recommend you reach us in the [contributors chat room](https://discord.gg/PRyKn3Vbay).
|
||||
|
||||
## Testando o cliente web em um idioma mundial
|
||||
|
||||
Você pode testar o client app em qualquer linguagem disponível nessa [lista de idiomas aqui](https://github.com/freeCodeCamp/freeCodeCamp/blob/main/config/i18n/all-langs.ts).
|
||||
You can test the client app in any language available in the [list of `availableLangs` here](https://github.com/freeCodeCamp/freeCodeCamp/blob/main/config/i18n.ts).
|
||||
|
||||
```js
|
||||
export const availableLangs = {
|
||||
export const availableLangs = {
|
||||
client: [
|
||||
'english',
|
||||
'espanol',
|
||||
'chinese',
|
||||
'chinese-traditional',
|
||||
'italian',
|
||||
'portuguese',
|
||||
'ukrainian',
|
||||
'japanese',
|
||||
'german'
|
||||
Languages.English,
|
||||
Languages.Espanol,
|
||||
Languages.Chinese,
|
||||
Languages.ChineseTrandational,
|
||||
Languages.Italian,
|
||||
Languages.Portuguese,
|
||||
Languages.Ukrainian,
|
||||
Languages.Japanese,
|
||||
Languages.German,
|
||||
Languages.Arabic
|
||||
],
|
||||
...
|
||||
};
|
||||
@@ -102,11 +97,11 @@ Você pode testar o client app em qualquer linguagem disponível nessa [lista de
|
||||
|
||||
Se você estiver testando um idioma novo, crie uma pasta com o nome do idioma como título próximo dos outros idiomas e copie os arquivos JSON de outro idioma para a sua pasta.
|
||||
|
||||
Adicione o idioma ao array `client` como mostrado acima no arquivo [`config/i18n/all-langs.ts`](https://github.com/freeCodeCamp/freeCodeCamp/blob/main/config/i18n/all-langs.ts).
|
||||
Add the new language to the `Languages` enum and the `client` array at the top of the [`config/i18n.ts`](https://github.com/freeCodeCamp/freeCodeCamp/blob/main/config/i18n.ts) file.
|
||||
|
||||
A seguir, siga as instruções nos comentários dentro do mesmo arquivo para adicionar/atualizar o rest das variáveis se necessário.
|
||||
|
||||
Finalmente, defina a variável `CLIENT_LOCALE` no seu arquivo `.env` para o local que você deseja fazer o build quando você estiver pronto(a).
|
||||
Finally, set the `CLIENT_LOCALE` variable in your `.env` file to the string of the locale you want to build from the `Languages` enum in the above file.
|
||||
|
||||
## Como estruturar os componentes
|
||||
|
||||
|
||||
@@ -51,8 +51,8 @@ There are a few steps to take in order to allow the codebase to build in your de
|
||||
|
||||
First, visit the `config/i18n.ts` file to add the language to the list of available languages and configure the values. There are several objects here.
|
||||
|
||||
- `availableLangs`: For both the `client` and `curriculum` arrays, add the text name of the language. This is the value that will be used in the `.env` file later.
|
||||
- `auditedCerts`: Add the text name of the language as the _key_, and add an array of `SuperBlocks.{cert}` variables as the _value_. This tells the client which certifications are fully translated.
|
||||
- `Languages`: Add the new language to `Languages` enum, similar to the others. The string value here will be used in the `.env` file to set a build language later.
|
||||
- `availableLangs`: Add the new property from the `Languages` enum to both the `client` and `curriculum` arrays.
|
||||
- `i18nextCodes`: These are the ISO language codes for each language. You will need to add the appropriate ISO code for the language you are enabling. These do need to be unique for each language.
|
||||
- `LangNames`: These are the display names for the language selector in the navigation menu.
|
||||
- `LangCodes`: These are the language codes used for formatting dates and numbers. These should be Unicode CLDR codes instead of ISO codes.
|
||||
@@ -62,78 +62,53 @@ First, visit the `config/i18n.ts` file to add the language to the list of availa
|
||||
As an example, if you wanted to enable Dothraki as a language, your `i18n.ts` objects should look like this:
|
||||
|
||||
```js
|
||||
export const availableLangs = {
|
||||
client: ['english', 'espanol', 'chinese', 'chinese-traditional', 'dothraki'],
|
||||
curriculum: [
|
||||
'english',
|
||||
'espanol',
|
||||
'chinese',
|
||||
'chinese-traditional',
|
||||
'dothraki'
|
||||
]
|
||||
};
|
||||
export enum Languages {
|
||||
English = 'english',
|
||||
Espanol = 'espanol',
|
||||
Chinese = 'chinese',
|
||||
ChineseTrandational = 'chinese-traditional',
|
||||
Dothraki = 'dothraki'
|
||||
}
|
||||
|
||||
export const auditedCerts = {
|
||||
espanol: [
|
||||
SuperBlocks.RespWebDesign,
|
||||
SuperBlocks.JsAlgoDataStruct,
|
||||
SuperBlocks.FrontEndDevLibs,
|
||||
SuperBlocks.DataVis,
|
||||
SuperBlocks.BackEndDevApis
|
||||
export const availableLangs = {
|
||||
client: [
|
||||
Languages.English,
|
||||
Languages.Espanol,
|
||||
Languages.Chinese,
|
||||
Languages.ChineseTrandational,
|
||||
Languages.Dothraki
|
||||
],
|
||||
chinese: [
|
||||
SuperBlocks.RespWebDesign,
|
||||
SuperBlocks.JsAlgoDataStruct,
|
||||
SuperBlocks.FrontEndDevLibs,
|
||||
SuperBlocks.DataVis,
|
||||
SuperBlocks.BackEndDevApis,
|
||||
SuperBlocks.QualityAssurance,
|
||||
SuperBlocks.SciCompPy,
|
||||
SuperBlocks.DataAnalysisPy,
|
||||
SuperBlocks.InfoSec,
|
||||
SuperBlocks.MachineLearningPy
|
||||
],
|
||||
'chinese-traditional': [
|
||||
SuperBlocks.RespWebDesign,
|
||||
SuperBlocks.JsAlgoDataStruct,
|
||||
SuperBlocks.FrontEndDevLibs,
|
||||
SuperBlocks.DataVis,
|
||||
SuperBlocks.BackEndDevApis,
|
||||
SuperBlocks.QualityAssurance,
|
||||
SuperBlocks.SciCompPy,
|
||||
SuperBlocks.DataAnalysisPy,
|
||||
SuperBlocks.InfoSec,
|
||||
SuperBlocks.MachineLearningPy
|
||||
],
|
||||
dothraki: [
|
||||
SuperBlocks.RespWebDesign,
|
||||
SuperBlocks.JsAlgoDataStruct,
|
||||
SuperBlocks.FrontEndDevLibs
|
||||
curriculum: [
|
||||
Languages.English,
|
||||
Languages.Espanol,
|
||||
Languages.Chinese,
|
||||
Languages.ChineseTrandational,
|
||||
Languages.Dothraki
|
||||
]
|
||||
};
|
||||
|
||||
export const i18nextCodes = {
|
||||
english: 'en',
|
||||
espanol: 'es',
|
||||
chinese: 'zh',
|
||||
'chinese-traditional': 'zh-Hant',
|
||||
dothraki: 'mis'
|
||||
[Languages.English]: 'en',
|
||||
[Languages.Espanol]: 'es',
|
||||
[Languages.Chinese]: 'zh',
|
||||
[Languages.ChineseTrandational]: 'zh-Hant',
|
||||
[Languages.Dothraki]: 'mis'
|
||||
};
|
||||
|
||||
export enum LangNames = {
|
||||
english: 'English',
|
||||
espanol: 'Español',
|
||||
chinese: '中文（简体字）',
|
||||
'chinese-traditional': '中文（繁體字）',
|
||||
dothraki: 'Dothraki'
|
||||
[Languages.English]: 'English',
|
||||
[Languages.Espanol]: 'Español',
|
||||
[Languages.Chinese]: '中文（简体字）',
|
||||
[Languages.ChineseTrandational]: '中文（繁體字）',
|
||||
[Languages.Dothraki]: 'Dothraki'
|
||||
};
|
||||
|
||||
export enum LangCodes = {
|
||||
english: 'en-US',
|
||||
espanol: 'es-419',
|
||||
chinese: 'zh',
|
||||
'chinese-traditional': 'zh-Hant',
|
||||
dothraki: 'mis'
|
||||
[Languages.English]: 'en-US',
|
||||
[Languages.Espanol]: 'es-419',
|
||||
[Languages.Chinese]: 'zh',
|
||||
[Languages.ChineseTrandational]: 'zh-Hant',
|
||||
[Languages.Dothraki]: 'mis'
|
||||
};
|
||||
|
||||
export const hiddenLangs = ['dothraki'];
|
||||
@@ -143,6 +118,71 @@ export const rtlLangs = [''];
|
||||
|
||||
> [!NOTE] When a language has been set up in the deployment pipeline AND has a public `/news` instance live, it can be removed from the `hiddenLangs` array and be made available to the public.
|
||||
|
||||
### Configure the Language Superblock Order
|
||||
|
||||
In the [config/superblock-order.ts](https://github.com/freeCodeCamp/freeCodeCamp/blob/main/config/superblock-order.ts) file, you need to set the order and state of all the superblocks for the new language in the `superBlockOrder` object. Copy one of the language keys and all its values, paste it to the bottom of the object (or wherever), and change the key to your new language from the `Languages` enum.
|
||||
|
||||
```js
|
||||
export const superBlockOrder: SuperBlockOrder = {
|
||||
...
|
||||
[Languages.Dothraki]: {
|
||||
[CurriculumMaps.Landing]: [
|
||||
SuperBlocks.RespWebDesignNew,
|
||||
SuperBlocks.JsAlgoDataStruct,
|
||||
SuperBlocks.FrontEndDevLibs,
|
||||
SuperBlocks.DataVis,
|
||||
SuperBlocks.RelationalDb,
|
||||
SuperBlocks.BackEndDevApis,
|
||||
SuperBlocks.QualityAssurance,
|
||||
SuperBlocks.SciCompPy,
|
||||
SuperBlocks.DataAnalysisPy,
|
||||
SuperBlocks.InfoSec,
|
||||
SuperBlocks.MachineLearningPy
|
||||
],
|
||||
[CurriculumMaps.Learn]: {
|
||||
[TranslationStates.Audited]: {
|
||||
[SuperBlockStates.Current]: [
|
||||
SuperBlocks.RespWebDesignNew,
|
||||
SuperBlocks.JsAlgoDataStruct,
|
||||
SuperBlocks.FrontEndDevLibs,
|
||||
SuperBlocks.DataVis,
|
||||
SuperBlocks.RelationalDb,
|
||||
SuperBlocks.BackEndDevApis,
|
||||
SuperBlocks.QualityAssurance,
|
||||
SuperBlocks.SciCompPy,
|
||||
SuperBlocks.DataAnalysisPy,
|
||||
SuperBlocks.InfoSec,
|
||||
SuperBlocks.MachineLearningPy,
|
||||
SuperBlocks.CodingInterviewPrep
|
||||
],
|
||||
[SuperBlockStates.New]: [],
|
||||
[SuperBlockStates.Upcoming]: [SuperBlocks.JsAlgoDataStructNew],
|
||||
[SuperBlockStates.Legacy]: [SuperBlocks.RespWebDesign]
|
||||
},
|
||||
[TranslationStates.NotAudited]: {
|
||||
[SuperBlockStates.Current]: [],
|
||||
[SuperBlockStates.New]: [],
|
||||
[SuperBlockStates.Upcoming]: [],
|
||||
[SuperBlockStates.Legacy]: []
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
The order of the superblocks in this object is how they appear on the "Landing" page and "Learn" maps. Follow the comments in that file so you know how you are allowed to order the superblocks, then move them to their proper places for the new language.
|
||||
|
||||
> [!ATTENTION] Do not change the order of any of the keys in the object, just move the superblocks to the different arrays
|
||||
|
||||
The `CurriculumMaps.Landing` array should contain exactly one superblock for all our current certifications, and the `CurriculumMaps.Learn` object should have all existing superblocks in it. Translated superblocks go in `TranslationStates.Audited` and non-translated superblocks go in `TranslationStates.NotAudited`. Each of those two objects has four different states a superblock can be in.
|
||||
|
||||
- `SuperBlockStates.Current`: Means that the superblock is current, `(New) Responsive Web Design` for example.
|
||||
- `SuperBlockStates.New`: These only show up when `SHOW_NEW_CURRICULUM` is set to `true` in your `.env` file. It is for displaying new superblocks on a specific build. For example, when we released the new RWD, we only showed in on English to start.
|
||||
- `SuperBlockStates.Upcoming`: These only show up when `SHOW_UPCOMING_CHANGES` is set to `true` in your `.env` file. It is to show superblocks locally while they are in development. Or, if you just need to hide a superblock from the map for some other reason.
|
||||
- `SuperBlockStates.Legacy`: A superblock is moved here when a newer version of that superblock has been fully translated and replaced it.
|
||||
|
||||
### Configure Search
|
||||
|
||||
Next, open the `client/src/utils/algolia-locale-setup.ts` file. This data is used for the search bar that loads `/news` articles. While it is unlikely that you are going to test this functionality, missing the data for your language can lead to errors when attempting to build the codebase locally.
|
||||
|
||||
Add an object for your language to the `algoliaIndices` object. You should use the the same values as the `english` object for local testing, replacing the `english` key with your language's `availableLangs` value.
|
||||
@@ -176,30 +216,6 @@ const algoliaIndices = {
|
||||
};
|
||||
```
|
||||
|
||||
### Releasing a Superblock
|
||||
|
||||
After a superblock has been fully translated into a language, there are two steps to release it. First add the superblock enum to that language's `auditedCerts` array. So, if you want to release the new Responsive Web Design superblock for Dothraki, the array should look like this:
|
||||
|
||||
```ts
|
||||
export const auditedCerts = {
|
||||
// other languages
|
||||
dothraki: [
|
||||
SuperBlocks.RespWebDesignNew, // the newly translated superblock
|
||||
SuperBlocks.RespWebDesign,
|
||||
SuperBlocks.JsAlgoDataStruct,
|
||||
SuperBlocks.FrontEndDevLibs
|
||||
]
|
||||
};
|
||||
```
|
||||
|
||||
Finally, if the superblock is in a "new" state (that is, replacing a legacy superblock), the `languagesWithAuditedBetaReleases` array should be updated to include the new language like this:
|
||||
|
||||
```ts
|
||||
export const languagesWithAuditedBetaReleases: ['english', 'dothraki'];
|
||||
```
|
||||
|
||||
This will move the new superblock to the correct place in the curriculum map on `/learn`.
|
||||
|
||||
## Enabling Localized Videos
|
||||
|
||||
For the video challenges, you need to change a few things. First add the new locale to the GraphQL query in the `client/src/templates/Challenges/video/Show.tsx` file. For example, adding Dothraki to the query:
|
||||
|
||||
@@ -80,7 +80,7 @@ Some community members also develop on Windows 10 natively with Git for Windows
|
||||
|
||||
| Prerequisite | Version | Notes |
|
||||
| --------------------------------------------------------------------------------------------- | ------- | ------------------------------------------------------------------------------------------- |
|
||||
| [Node.js](http://nodejs.org) | `16.x` | We use the "Active LTS" version, See [LTS Schedule](https://nodejs.org/en/about/releases/). |
|
||||
| [Node.js](http://nodejs.org) | `18.x` | We use the "Active LTS" version, See [LTS Schedule](https://nodejs.org/en/about/releases/). |
|
||||
| npm (comes bundled with Node) | `8.x` | We use the version bundled with Node.js Active LTS. |
|
||||
| [MongoDB Community Server](https://docs.mongodb.com/manual/administration/install-community/) | `4.2.x` | - |
|
||||
|
||||
|
||||
@@ -17,49 +17,45 @@ Let's understand how the i18n frameworks and tooling work.
|
||||
Most of files for translating the platform are located in the [`client/i18n`](https://github.com/freeCodeCamp/freeCodeCamp/tree/main/client/i18n) folder. Each language has a directory within that containing JSON files with the translations.
|
||||
|
||||
```console
|
||||
config/i18n
|
||||
└── all-langs.ts
|
||||
config
|
||||
└── i18n.ts
|
||||
...
|
||||
client/i18n
|
||||
├── configForTests.js
|
||||
├── config.js
|
||||
├── locales
|
||||
│ ├── chinese
|
||||
│ │ ├── intro.json
|
||||
│ │ ├── links.json
|
||||
│ │ ├── meta-tags.json
|
||||
│ │ ├── motivation.json
|
||||
│ │ ├── translations.json
|
||||
│ │ └── trending.json
|
||||
│ ├── chinese
|
||||
│ │ ├── intro.json
|
||||
│ │ ├── links.json
|
||||
│ │ ├── meta-tags.json
|
||||
│ │ ├── motivation.json
|
||||
│ │ └── translations.json
|
||||
... ...
|
||||
│ ├── dothraki
|
||||
│ │ ├── intro.json
|
||||
│ │ ├── links.json
|
||||
│ │ ├── meta-tags.json
|
||||
│ │ ├── motivation.json
|
||||
│ │ ├── translations.json
|
||||
│ │ └── trending.json
|
||||
│ ├── dothraki
|
||||
│ │ ├── intro.json
|
||||
│ │ ├── links.json
|
||||
│ │ ├── meta-tags.json
|
||||
│ │ ├── motivation.json
|
||||
│ │ └── translations.json
|
||||
... ...
|
||||
│ ├── english
|
||||
│ │ ├── intro.json
|
||||
│ │ ├── links.json
|
||||
│ │ ├── meta-tags.json
|
||||
│ │ ├── motivation.json
|
||||
│ │ ├── translations.json
|
||||
│ │ └── trending.json
|
||||
│ └── espanol
|
||||
│ ├── intro.json
|
||||
│ ├── links.json
|
||||
│ ├── meta-tags.json
|
||||
│ ├── motivation.json
|
||||
│ ├── translations.json
|
||||
│ └── trending.json
|
||||
│ ├── english
|
||||
│ │ ├── intro.json
|
||||
│ │ ├── links.json
|
||||
│ │ ├── meta-tags.json
|
||||
│ │ ├── motivation.json
|
||||
│ │ └── translations.json
|
||||
│ └── espanol
|
||||
│ ├── intro.json
|
||||
│ ├── links.json
|
||||
│ ├── meta-tags.json
|
||||
│ ├── motivation.json
|
||||
│ └── translations.json
|
||||
├── locales.test.js
|
||||
├── schema-validation.js
|
||||
└── validate-keys.ts
|
||||
```
|
||||
|
||||
Some of these files are translated on our translation platform (Crowdin), some are not.
|
||||
Some of these files are translated on our translation platform (Crowdin), some are translated or created via PR's on GitHub.
|
||||
|
||||
**Files translated on our translation platform:**
|
||||
|
||||
@@ -73,28 +69,27 @@ Some of these files are translated on our translation platform (Crowdin), some a
|
||||
|
||||
- The `motivation.json` files are not required to have the same quotes, compliments, or array length. Just the same JSON structure.
|
||||
|
||||
- The `trending.json` file contains the titles and links for the trending news articles in the website's footer.
|
||||
|
||||
- The `meta-tags.json` file contains the information for our website's meta tag information.
|
||||
|
||||
Changes to these files are typically done by the staff team. If you see something out of the ordinary we recommend you reach us in the [contributors chat room](https://discord.gg/PRyKn3Vbay).
|
||||
|
||||
## Testing the client app in a world language
|
||||
|
||||
You can test the client app in any language available in the [list of languages here](https://github.com/freeCodeCamp/freeCodeCamp/blob/main/config/i18n/all-langs.ts).
|
||||
You can test the client app in any language available in the [list of `availableLangs` here](https://github.com/freeCodeCamp/freeCodeCamp/blob/main/config/i18n.ts).
|
||||
|
||||
```js
|
||||
export const availableLangs = {
|
||||
export const availableLangs = {
|
||||
client: [
|
||||
'english',
|
||||
'espanol',
|
||||
'chinese',
|
||||
'chinese-traditional',
|
||||
'italian',
|
||||
'portuguese',
|
||||
'ukrainian',
|
||||
'japanese',
|
||||
'german'
|
||||
Languages.English,
|
||||
Languages.Espanol,
|
||||
Languages.Chinese,
|
||||
Languages.ChineseTrandational,
|
||||
Languages.Italian,
|
||||
Languages.Portuguese,
|
||||
Languages.Ukrainian,
|
||||
Languages.Japanese,
|
||||
Languages.German,
|
||||
Languages.Arabic
|
||||
],
|
||||
...
|
||||
};
|
||||
@@ -102,11 +97,11 @@ You can test the client app in any language available in the [list of languages
|
||||
|
||||
If you are testing a new language, create a folder with the language name as the title next to the other languages and copy the JSON files from another language into your new folder.
|
||||
|
||||
Add the language to the `client` array as seen above in the [`config/i18n/all-langs.ts`](https://github.com/freeCodeCamp/freeCodeCamp/blob/main/config/i18n/all-langs.ts) file.
|
||||
Add the new language to the `Languages` enum and the `client` array at the top of the [`config/i18n.ts`](https://github.com/freeCodeCamp/freeCodeCamp/blob/main/config/i18n.ts) file.
|
||||
|
||||
Next, follow the instructions in the comments in the same file to add/update the rest of the variables as needed.
|
||||
|
||||
Finally, set the `CLIENT_LOCALE` variable in your `.env` file to the locale you want to build and you're ready.
|
||||
Finally, set the `CLIENT_LOCALE` variable in your `.env` file to the string of the locale you want to build from the `Languages` enum in the above file.
|
||||
|
||||
## How to Structure Components
|
||||
|
||||
|
||||
Reference in New Issue
Block a user