diff --git a/curriculum/challenges/italian/05-back-end-development-and-apis/basic-node-and-express/use-the-.env-file.md b/curriculum/challenges/italian/05-back-end-development-and-apis/basic-node-and-express/use-the-.env-file.md index 11ce41eb97d..a816bf9ca39 100644 --- a/curriculum/challenges/italian/05-back-end-development-and-apis/basic-node-and-express/use-the-.env-file.md +++ b/curriculum/challenges/italian/05-back-end-development-and-apis/basic-node-and-express/use-the-.env-file.md @@ -18,11 +18,11 @@ Aggiungiamo una variabile d'ambiente come opzione di configurazione. Crea un file `.env` nella directory principale del tuo progetto e memorizza la variabile `MESSAGE_STYLE=uppercase` in esso. -Poi, nel gestore della rotta GET `/json` che hai creato nell'ultima sfida, trasforma il messaggio dell'oggetto di risposta in maiuscolo se `process.env.MESSAGE_STYLE` è uguale a `uppercase`. L'oggetto della risposta dovrebbe essere `{"message": "Hello json"}` o `{"message": "HELLO JSON"}`, a seconda del valore di `MESSAGE_STYLE`. +Poi, all'interno del gestore della rotta `/json` GET che hai creato nell'ultima sfida accedi a `process.env.MESSAGE_STYLE` e trasforma la proprietà `message` dell'oggetto di risposta in maiuscolo se la variabile è uguale a `uppercase`. L'oggetto della risposta dovrebbe essere `{"message": "Hello json"}` o `{"message": "HELLO JSON"}`, a seconda del valore di `MESSAGE_STYLE`. **Nota:** Se stai usando Replit, non puoi creare un file `.env`. Utilizza invece la scheda SECRETS integrata per aggiungere la variabile. -Se stai lavorando in locale, avrai bisogno del pacchetto `dotenv`. Carica le variabili ambientali dal tuo file `.env` in `process.env`. Installalo con `npm install dotenv`. Quindi, in cima al tuo file `myApp.js`, importa e carica le variabili con `require('dotenv').config()`. +Se stai lavorando in locale, avrai bisogno del pacchetto `dotenv`. Carica le variabili ambientali dal tuo file `.env` in `process.env`. Il pacchetto `dotenv` è già stato installato ed è nel file `package.json` del tuo progetto. Quindi, in cima al tuo file `myApp.js`, importa e carica le variabili con `require('dotenv').config()`. # --hints-- diff --git a/curriculum/challenges/italian/05-back-end-development-and-apis/managing-packages-with-npm/manage-npm-dependencies-by-understanding-semantic-versioning.md b/curriculum/challenges/italian/05-back-end-development-and-apis/managing-packages-with-npm/manage-npm-dependencies-by-understanding-semantic-versioning.md index 8c7c88bf0f9..04ad9c519d1 100644 --- a/curriculum/challenges/italian/05-back-end-development-and-apis/managing-packages-with-npm/manage-npm-dependencies-by-understanding-semantic-versioning.md +++ b/curriculum/challenges/italian/05-back-end-development-and-apis/managing-packages-with-npm/manage-npm-dependencies-by-understanding-semantic-versioning.md @@ -20,11 +20,11 @@ La versione MAJOR dovrebbe essere incrementata quando si effettuano modifiche AP # --instructions-- -Nella sezione dependencies del tuo file package.json, cambia la `version` di moment per farlo corrispondere alla versione MAJOR 2, alla versione MINOR 10 e alla versione PATCH 2 +Nella sezione dependencies del tuo file `package.json`, cambia la versione di `@freecodecamp/example` per farla corrispondere a versione MAJOR 1, versione MINOR 2 e versione di PATCH 13 # --hints-- -"dependencies" dovrebbe includere "moment" +`"dependencies"` dovrebbe includere `"@freecodecamp/example"`. ```js (getUserInput) => @@ -33,8 +33,8 @@ Nella sezione dependencies del tuo file package.json, cambia la `version` di mom var packJson = JSON.parse(data); assert.property( packJson.dependencies, - 'moment', - '"dependencies" does not include "moment"' + '@freecodecamp/example', + '"dependencies" does not include "@freecodecamp/example"' ); }, (xhr) => { @@ -43,7 +43,7 @@ Nella sezione dependencies del tuo file package.json, cambia la `version` di mom ); ``` -La versione di "moment" dovrebbe essere "2.10.2" +La versione di `"@freecodecamp/example"` dovrebbe essere `"1.2.13"`. ```js (getUserInput) => @@ -51,9 +51,9 @@ La versione di "moment" dovrebbe essere "2.10.2" (data) => { var packJson = JSON.parse(data); assert.equal( - packJson.dependencies.moment, - '2.10.2', - 'Wrong version of "moment". It should be 2.10.2' + packJson.dependencies["@freecodecamp/example"], + '1.2.13', + 'Wrong version of "@freecodecamp/example". It should be 1.2.13' ); }, (xhr) => { diff --git a/curriculum/challenges/italian/14-responsive-web-design-22/learn-html-by-building-a-cat-photo-app/5f05a1d8e233dff4a68508d8.md b/curriculum/challenges/italian/14-responsive-web-design-22/learn-html-by-building-a-cat-photo-app/5f05a1d8e233dff4a68508d8.md index 288b18ccfdf..062a52df1f2 100644 --- a/curriculum/challenges/italian/14-responsive-web-design-22/learn-html-by-building-a-cat-photo-app/5f05a1d8e233dff4a68508d8.md +++ b/curriculum/challenges/italian/14-responsive-web-design-22/learn-html-by-building-a-cat-photo-app/5f05a1d8e233dff4a68508d8.md @@ -7,13 +7,11 @@ dashedName: step-46 # --description-- -Annida un altro pulsante di opzione con l'opzione `Outdoor` in un nuovo elemento `label`. Il nuovo pulsante di opzione dovrebbe essere posizionato dopo il primo. Inoltre, imposta il valore dell'attributo `id` su: - -`outdoor` +Crea un altro pulsante di opzione sotto il primo. Annidalo all'interno di un elemento `label` con `Outdoor` come testo dell'elemento `label`. Dai al pulsante di opzione un attributo `id` con `outdoor` come valore. # --hints-- -Hai bisogno di aggiungere un nuovo elemento `label` nel quale annidare il nuovo pulsante di opzione. Assicurati di avere entrambi i tag di apertura e chiusura. +Dovrai aggiungere un nuovo elemento `label` nel quale annidare il nuovo pulsante di opzione. Assicurati di avere entrambi i tag di apertura e chiusura. ```js assert( @@ -22,7 +20,7 @@ assert( ); ``` -Il testo `Outdoor` dovrebbe essere posizionato direttamente a destra del nuovo pulsante di opzione. Assicurati che ci sia uno spazio tra l'elemento e il testo. Hai omesso il testo o hai un refuso. +Il testo `Outdoor` dovrebbe essere posizionato direttamente a destra del nuovo pulsante `radio`. Assicurati che ci sia uno spazio tra l'elemento e il testo. O hai omesso il testo o hai un refuso. ```js const radioButtons = [...$('input')]; @@ -42,13 +40,13 @@ const collection = [ assert(collection.indexOf('Indoor') < collection.indexOf('Outdoor')); ``` -Il nuovo pulsante di opzione dovrebbe avere un attributo `id`. Controlla che ci sia uno spazio dopo il nome del tag di apertura e/o che ci siano spazi prima di tutti i nomi degli attributi. +Il nuovo pulsante di opzione dovrebbe avere un attributo `id`. Verifica che ci sia uno spazio dopo il nome del tag di apertura e/o che ci siano spazi prima di tutti i nomi degli attributi. ```js assert($('input')[1].hasAttribute('id')); ``` -Il nuovo pulsante di opzione dovrebbe avere un attributo `id` con il valore `outdoor`. Hai omesso il valore o hai un refuso. Ricorda che i valori degli attributi devono essere circondati da virgolette. +Il nuovo pulsante di opzione dovrebbe avere un attributo `id` con il valore `outdoor`. O hai omesso il valore o hai un refuso. Ricorda che i valori degli attributi devono essere racchiusi tra virgolette. ```js assert($('input')[1].id.match(/^outdoor$/)); diff --git a/curriculum/challenges/italian/14-responsive-web-design-22/learn-more-about-css-pseudo-selectors-by-building-a-balance-sheet/61fdac1e31692f9a9ad97295.md b/curriculum/challenges/italian/14-responsive-web-design-22/learn-more-about-css-pseudo-selectors-by-building-a-balance-sheet/61fdac1e31692f9a9ad97295.md index 26fddf9639c..27067de0b38 100644 --- a/curriculum/challenges/italian/14-responsive-web-design-22/learn-more-about-css-pseudo-selectors-by-building-a-balance-sheet/61fdac1e31692f9a9ad97295.md +++ b/curriculum/challenges/italian/14-responsive-web-design-22/learn-more-about-css-pseudo-selectors-by-building-a-balance-sheet/61fdac1e31692f9a9ad97295.md @@ -9,7 +9,7 @@ dashedName: step-31 La proprietà CSS `clip` è usata per definire la porzione visibile di un elemento. Imposta il selettore `span[class~="sr-only"]` per avere una proprietà `clip` di `rect(1px, 1px, 1px, 1px, 1px)`. -La proprietà `clip-path` determina la forma che la proprietà `clip` dovrebbe assumere. Usa i selettori `clip-path` e `-webkit-clip-path` per impostare il valore su `inset(50%)`, facendo sì che il clip-path sia un rettangolo all'interno dell'elemento. +La proprietà `clip-path` determina la forma che la proprietà `clip` dovrebbe assumere. Imposta le proprietà `clip-path` e `-webkit-clip-path` al valore di `inset(50%)`, ritagliando un rettangolo all'interno dell'elemento. # --hints-- diff --git a/curriculum/challenges/italian/14-responsive-web-design-22/learn-more-about-css-pseudo-selectors-by-building-a-balance-sheet/62017b6f47454059bf2d3bd1.md b/curriculum/challenges/italian/14-responsive-web-design-22/learn-more-about-css-pseudo-selectors-by-building-a-balance-sheet/62017b6f47454059bf2d3bd1.md index 16ad45d8874..6309abb6de9 100644 --- a/curriculum/challenges/italian/14-responsive-web-design-22/learn-more-about-css-pseudo-selectors-by-building-a-balance-sheet/62017b6f47454059bf2d3bd1.md +++ b/curriculum/challenges/italian/14-responsive-web-design-22/learn-more-about-css-pseudo-selectors-by-building-a-balance-sheet/62017b6f47454059bf2d3bd1.md @@ -9,7 +9,7 @@ dashedName: step-45 Prima di iniziare a immergerti nella tabella stessa, occupati degli elementi `span`, che sono attualmente in grassetto. Crea un selettore `span:not(.sr-only)` e dagli una proprietà `font-weight` impostata su `normal`. -Lo pseudo-selettore `:not()` viene utilizzato per scegliere come target tutti gli elementi che non corrispondono al selettore - in questo caso, qualsiasi elemento `span` che non ha la classe `span[class~="sr-only"]`. Ciò garantisce che le regole precedenti per la classe `sr-only` non vengano sovrascritte. +Lo pseudo-selettore `:not()` viene utilizzato per selezionare tutti gli elementi che non corrispondono al selettore - in questo caso, tutti i tuoi elementi `span` che non hanno la classe `sr-only`. Questo assicura che le regole precedenti per il selettore `span[class~="sr-only"]` non siano sovrascritte. # --hints-- diff --git a/curriculum/challenges/japanese/14-responsive-web-design-22/learn-html-by-building-a-cat-photo-app/5dfa3589eacea3f48c6300ae.md b/curriculum/challenges/japanese/14-responsive-web-design-22/learn-html-by-building-a-cat-photo-app/5dfa3589eacea3f48c6300ae.md new file mode 100644 index 00000000000..2362bb7bd47 --- /dev/null +++ b/curriculum/challenges/japanese/14-responsive-web-design-22/learn-html-by-building-a-cat-photo-app/5dfa3589eacea3f48c6300ae.md @@ -0,0 +1,75 @@ +--- +id: 5dfa3589eacea3f48c6300ae +title: ステップ 17 +challengeType: 0 +dashedName: step-17 +--- + +# --description-- + +2 つ目の `section` 要素内に、新しい `h2` 要素を追加して、テキストを `Cat Lists` としてください。 + +# --hints-- + +`section` 要素には開始タグが必要です。 開始タグは `` のような形式の構文です。 + +```js +assert( + document.querySelectorAll('section').length === 2 && + code.match(/<\/section>/g).length === 2 +); +``` + +`h2` 要素には開始タグが必要です。 開始タグは `` のような形式の構文です。 + +```js +assert(document.querySelectorAll('h2').length === 2); +``` + +`h2` 要素には終了タグが必要です。 終了タグは `<` の直後に `/` があります。 + +```js +assert(code.match(/<\/h2\>/g).length === 2); +``` + +2 つ目の `h2` 要素は、2 つ目の `section` 要素の終了タグのすぐ上にある必要があります。 位置が正しくないようです。 + +```js +const secondSection = document.querySelectorAll('section')[1]; +assert(secondSection.lastElementChild.nodeName === 'H2'); +``` + +2 つ目の `h2` 要素には `Cat Lists` というテキストが必要です。 テキストに誤字脱字があります。 + +```js +assert( + document + .querySelectorAll('main > section')[1] + .lastElementChild.innerText.toLowerCase() === 'cat lists' +); +``` + +# --seed-- + +## --seed-contents-- + +```html + + +

CatPhotoApp

+
+
+

Cat Photos

+ +

Click here to view more cat photos.

+ A cute orange cat lying on its back. +
+--fcc-editable-region-- +
+
+--fcc-editable-region-- +
+ + +``` + diff --git a/curriculum/challenges/japanese/14-responsive-web-design-22/learn-html-by-building-a-cat-photo-app/5dfa371beacea3f48c6300af.md b/curriculum/challenges/japanese/14-responsive-web-design-22/learn-html-by-building-a-cat-photo-app/5dfa371beacea3f48c6300af.md new file mode 100644 index 00000000000..c34a57c7de0 --- /dev/null +++ b/curriculum/challenges/japanese/14-responsive-web-design-22/learn-html-by-building-a-cat-photo-app/5dfa371beacea3f48c6300af.md @@ -0,0 +1,84 @@ +--- +id: 5dfa371beacea3f48c6300af +title: ステップ 18 +challengeType: 0 +dashedName: step-18 +--- + +# --description-- + +ページ内に下位の見出し要素を追加することは、そこから新しいサブセクションが始まることを意味します。 + +2 つ目の `section` 要素内の `h2` 要素の後に、`h3` 要素を追加して次のテキストを設定してください: + +`Things cats love:` + +# --hints-- + +2 つ目の `section` 要素がないか、開始タグか終了タグが欠けているようです。 + +```js +assert( + document.querySelectorAll('main > section')[1] && + code.match(/\<\/section>/g).length == 2 +); +``` + +2 つ目の `section` 要素の終了タグのすぐ上に `h3` 要素が必要です。 + +```js +assert( + document.querySelectorAll('main > section')[1].lastElementChild.nodeName === + 'H3' +); +``` + +2 つ目の `section` 要素の終了タグのすぐ上にある `h3` 要素は、`Things cats love:` というテキストを持つ必要があります。 テキストの終わりのコロンを必ず含めてください。 + +```js +assert( + document + .querySelectorAll('main > section')[1] + .lastElementChild.innerText.toLowerCase() + .replace(/\s+/g, ' ') === 'things cats love:' +); +``` + +最後の `section` 要素内にネストされている最後の `h3` 要素の上には、テキスト `Cat Lists` を持つ `h2` 要素があるはずです。 `h2` 要素が誤って削除された可能性があります。 + +```js +const secondSectionLastElemNode = document.querySelectorAll('main > section')[1] + .lastElementChild; +assert( + secondSectionLastElemNode.nodeName === 'H3' && + secondSectionLastElemNode.previousElementSibling.innerText + .toLowerCase() + .replace(/\s+/g, ' ') === 'cat lists' +); +``` + +# --seed-- + +## --seed-contents-- + +```html + + +

CatPhotoApp

+
+
+

Cat Photos

+ +

Click here to view more cat photos.

+ A cute orange cat lying on its back. +
+--fcc-editable-region-- +
+

Cat Lists

+
+--fcc-editable-region-- +
+ + +``` + diff --git a/curriculum/challenges/japanese/14-responsive-web-design-22/learn-html-by-building-a-cat-photo-app/5dfa37b9eacea3f48c6300b0.md b/curriculum/challenges/japanese/14-responsive-web-design-22/learn-html-by-building-a-cat-photo-app/5dfa37b9eacea3f48c6300b0.md new file mode 100644 index 00000000000..df66b1f7990 --- /dev/null +++ b/curriculum/challenges/japanese/14-responsive-web-design-22/learn-html-by-building-a-cat-photo-app/5dfa37b9eacea3f48c6300b0.md @@ -0,0 +1,58 @@ +--- +id: 5dfa37b9eacea3f48c6300b0 +title: ステップ 19 +challengeType: 0 +dashedName: step-19 +--- + +# --description-- + +テキスト `Things cats love:` を持つ `h3` 要素の後に、順序なしリスト (unordered list、`ul`) 要素を追加してください。 この時点では何も表示されません。 + +# --hints-- + +`ul` 要素には開始タグが必要です。 開始タグは `` のような形式の構文です。 + +```js +assert(document.querySelector('ul')); +``` + +`ul` 要素には終了タグが必要です。 終了タグは `<` の直後に `/` があります。 + +```js +assert(code.match(/<\/ul>/)); +``` + +`ul` 要素は、2 つ目の `section` 要素の終了タグの上にある必要があります。 + +```js +const secondSectionLastElemNode = $('main > section')[1].lastElementChild; +assert(secondSectionLastElemNode.nodeName === 'UL'); +``` + +# --seed-- + +## --seed-contents-- + +```html + + +

CatPhotoApp

+
+
+

Cat Photos

+ +

Click here to view more cat photos.

+ A cute orange cat lying on its back. +
+
+--fcc-editable-region-- +

Cat Lists

+

Things cats love:

+--fcc-editable-region-- +
+
+ + +``` + diff --git a/curriculum/challenges/japanese/14-responsive-web-design-22/learn-html-by-building-a-cat-photo-app/5dfb5ecbeacea3f48c6300b1.md b/curriculum/challenges/japanese/14-responsive-web-design-22/learn-html-by-building-a-cat-photo-app/5dfb5ecbeacea3f48c6300b1.md new file mode 100644 index 00000000000..302563699a4 --- /dev/null +++ b/curriculum/challenges/japanese/14-responsive-web-design-22/learn-html-by-building-a-cat-photo-app/5dfb5ecbeacea3f48c6300b1.md @@ -0,0 +1,79 @@ +--- +id: 5dfb5ecbeacea3f48c6300b1 +title: ステップ 20 +challengeType: 0 +dashedName: step-20 +--- + +# --description-- + +リスト項目 (list item、`li`) 要素を使用して、リストの項目を作成しましょう。 こちらが順序なしリスト内のリスト項目の例です。 + +```html +
    +
  • milk
  • +
  • cheese
  • +
+``` + +`ul` 要素内に 3 つのリスト項目をネストして、下記 3 つの猫が好きなものを表示してください: + +`cat nip` `laser pointers` `lasagna` + +# --hints-- + +`li` 要素が 3 つ必要です。 各 `li` 要素に開始タグと終了タグが必要です。 + +```js +assert($('li').length === 3 && code.match(/<\/li\>/g).length === 3); +``` + +3 つの `li` 要素に、テキスト `cat nip`、`laser pointers`、`lasagna` が任意の順番で設定されている必要があります。 テキストが設定されていないか、誤字脱字があります。 + +```js +assert.deepStrictEqual( + [...document.querySelectorAll('li')] + .map((item) => item.innerText.toLowerCase()) + .sort((a, b) => a.localeCompare(b)), + ['cat nip', 'lasagna', 'laser pointers'] +); +``` + +3 つの `li` 要素は、`ul` 要素の開始タグと終了タグの間に配置する必要があります。 + +```js +assert( + [...document.querySelectorAll('li')].filter( + (item) => item.parentNode.nodeName === 'UL' + ).length === 3 +); +``` + +# --seed-- + +## --seed-contents-- + +```html + + +

CatPhotoApp

+
+
+

Cat Photos

+ +

Click here to view more cat photos.

+ A cute orange cat lying on its back. +
+
+

Cat Lists

+

Things cats love:

+--fcc-editable-region-- +
    +
+--fcc-editable-region-- +
+
+ + +``` + diff --git a/curriculum/challenges/japanese/14-responsive-web-design-22/learn-html-by-building-a-cat-photo-app/5dfb6a35eacea3f48c6300b4.md b/curriculum/challenges/japanese/14-responsive-web-design-22/learn-html-by-building-a-cat-photo-app/5dfb6a35eacea3f48c6300b4.md new file mode 100644 index 00000000000..6e584d18374 --- /dev/null +++ b/curriculum/challenges/japanese/14-responsive-web-design-22/learn-html-by-building-a-cat-photo-app/5dfb6a35eacea3f48c6300b4.md @@ -0,0 +1,98 @@ +--- +id: 5dfb6a35eacea3f48c6300b4 +title: ステップ 23 +challengeType: 0 +dashedName: step-23 +--- + +# --description-- + +図キャプション (`figcaption`) 要素は、`figure` 要素内の画像を説明するキャプションを追加するために利用されます。 例えば `
A cute cat
` と書くことで、`A cute cat` というキャプションを追加できます。 + +`figure` 要素内にネストされた画像の後に、`figcaption` 要素を追加して下記のテキストを設定してください: + +`Cats love lasagna.` + +# --hints-- + +`figcaption` 要素には開始タグが必要です。 開始タグは `` のような形式の構文です。 + +```js +assert(document.querySelector('figcaption')); +``` + +`figcaption` 要素には終了タグが必要です。 終了タグは `<` の直後に `/` があります。 + +```js +assert(code.match(/<\/figcaption\>/)); +``` + +`figcaption` 要素は `figure` 要素内にネストされている必要があります。 + +```js +assert( + document.querySelector('figure > figcaption') && + document.querySelector('figure > figcaption') +); +``` + +ラザニアの `img` 要素は `figure` 要素内にネストされている必要があります。 + +```js +assert( + document.querySelector('figure > img') && + document.querySelector('figure > img').getAttribute('src').toLowerCase() === + 'https://cdn.freecodecamp.org/curriculum/cat-photo-app/lasagna.jpg' +); +``` + +`figure` 要素内にネストされた `figcaption` 要素は、`img` 要素の下に置く必要があります。 順番が誤っているようです。 + +```js +assert( + document.querySelector('figcaption').previousElementSibling.nodeName === 'IMG' +); +``` + +`figcaption` 要素のテキストは `Cats love lasagna.` でなければなりません。 テキストが設定されていないか、誤字脱字があります。 + +```js +assert( + document.querySelector('figcaption').innerText.match(/Cats love lasagna.?$/i) +); +``` + +# --seed-- + +## --seed-contents-- + +```html + + +

CatPhotoApp

+
+
+

Cat Photos

+ +

Click here to view more cat photos.

+ A cute orange cat lying on its back. +
+
+

Cat Lists

+

Things cats love:

+
    +
  • cat nip
  • +
  • laser pointers
  • +
  • lasagna
  • +
+--fcc-editable-region-- +
+ A slice of lasagna on a plate. +
+--fcc-editable-region-- +
+
+ + +``` + diff --git a/curriculum/challenges/ukrainian/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e98c9.md b/curriculum/challenges/ukrainian/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e98c9.md index 8e11d93ea16..db7caf4c4dc 100644 --- a/curriculum/challenges/ukrainian/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e98c9.md +++ b/curriculum/challenges/ukrainian/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e98c9.md @@ -7,7 +7,7 @@ dashedName: step-1 # --description-- -Ласкаво просимо до проєкту «Горизонт CSS-змінних»! Почніть з додавання декларації `!DOCTYPE html` в верхній частині документа, щоб браузер знав, який тип документа він читає. +Ласкаво просимо до проєкту «Панорама CSS-змінних»! Почніть з додавання декларації `!DOCTYPE html` в верхній частині документа, щоб браузер знав, який тип документа він читає. # --hints-- diff --git a/curriculum/challenges/ukrainian/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e98eb.md b/curriculum/challenges/ukrainian/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e98eb.md index 620b41ecc39..6f8155673e3 100644 --- a/curriculum/challenges/ukrainian/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e98eb.md +++ b/curriculum/challenges/ukrainian/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e98eb.md @@ -7,7 +7,7 @@ dashedName: step-35 # --description-- -Вимальовується горизонт. Заповніть властивість `background-color` будівель переднього плану. Використайте свою змінну `--building-color1`, щоб заповнити `.fb3` та `.fb4`, `--building-color2` для `.fb5`, `--building-color3` для `.fb2` та `.fb6` та `--building-color4` для `.fb1`. +Вимальовується панорама. Заповніть властивість `background-color` будівель переднього плану. Використайте свою змінну `--building-color1`, щоб заповнити `.fb3` та `.fb4`, `--building-color2` для `.fb5`, `--building-color3` для `.fb2` та `.fb6` та `--building-color4` для `.fb1`. # --hints-- diff --git a/curriculum/challenges/ukrainian/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e9937.md b/curriculum/challenges/ukrainian/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e9937.md index ad2902e6936..34b3040bf84 100644 --- a/curriculum/challenges/ukrainian/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e9937.md +++ b/curriculum/challenges/ukrainian/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e9937.md @@ -7,7 +7,7 @@ dashedName: step-111 # --description-- -Додайте `sky` як другий клас до елемента `.background-buildings`. Ви робитимете фон для горизонту. +Додайте `sky` як другий клас до елемента `.background-buildings`. Ви робитимете фон для панорами. # --hints-- diff --git a/curriculum/challenges/ukrainian/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e993b.md b/curriculum/challenges/ukrainian/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e993b.md index 6bb7e6c3242..0fe687c5ac5 100644 --- a/curriculum/challenges/ukrainian/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e993b.md +++ b/curriculum/challenges/ukrainian/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e993b.md @@ -7,7 +7,7 @@ dashedName: step-115 # --description-- -Скопіюйте та вставте весь клас `sky` разом з усіма його властивостями та значеннями в медіазапит. Ви збираєтеся створити іншу колірну схему для лінії горизонту, яка змінює день на ніч. +Скопіюйте та вставте весь клас `sky` разом з усіма його властивостями та значеннями в медіазапит. Ви збираєтеся створити іншу колірну схему для лінії панорами, яка змінює день на ніч. Примітка: потрібно буде прокрутити повз область, яку можна редагувати, щоб скопіювати клас. diff --git a/curriculum/challenges/ukrainian/14-responsive-web-design-22/learn-html-by-building-a-cat-photo-app/5f05a1d8e233dff4a68508d8.md b/curriculum/challenges/ukrainian/14-responsive-web-design-22/learn-html-by-building-a-cat-photo-app/5f05a1d8e233dff4a68508d8.md index a6fc3ffc93c..7fb28347b3e 100644 --- a/curriculum/challenges/ukrainian/14-responsive-web-design-22/learn-html-by-building-a-cat-photo-app/5f05a1d8e233dff4a68508d8.md +++ b/curriculum/challenges/ukrainian/14-responsive-web-design-22/learn-html-by-building-a-cat-photo-app/5f05a1d8e233dff4a68508d8.md @@ -7,13 +7,11 @@ dashedName: step-46 # --description-- -Вкладіть іншу радіокнопку з опцією `Outdoor` в новий елемент `label`. Нову радіокнопку потрібно розмістити після першої. Також встановіть для атрибута `id` значення: - -`outdoor` +Створіть ще одну радіокнопку під першою. Вкладіть її в межі елемента `label` з `Outdoor` як текст `label`. Надайте радіокнопці атрибут `id` зі значенням `outdoor`. # --hints-- -Вам потрібно буде додати новий елемент `label`, в який буде вкладено вашу нову радіокнопку. Переконайтеся, що він має початковий та кінцевий теґи. +Вам потрібно буде додати новий елемент `label`, в який вкладете нову радіокнопку. Переконайтеся, що він має початковий та кінцевий теґи. ```js assert( @@ -22,7 +20,7 @@ assert( ); ``` -Текст `Outdoor` повинен бути розташований праворуч від вашої нової кнопки `radio`. Переконайтеся, що між елементом та текстом є пробіл. Ви або не написали текст, або маєте друкарську помилку. +Текст `Outdoor` повинен бути праворуч від кнопки `radio`. Переконайтеся, що між елементом та текстом є пробіл. Ви або не написали текст, або маєте друкарську помилку. ```js const radioButtons = [...$('input')]; diff --git a/curriculum/challenges/ukrainian/14-responsive-web-design-22/learn-more-about-css-pseudo-selectors-by-building-a-balance-sheet/61fdac1e31692f9a9ad97295.md b/curriculum/challenges/ukrainian/14-responsive-web-design-22/learn-more-about-css-pseudo-selectors-by-building-a-balance-sheet/61fdac1e31692f9a9ad97295.md index 506d626c631..8518692d4b0 100644 --- a/curriculum/challenges/ukrainian/14-responsive-web-design-22/learn-more-about-css-pseudo-selectors-by-building-a-balance-sheet/61fdac1e31692f9a9ad97295.md +++ b/curriculum/challenges/ukrainian/14-responsive-web-design-22/learn-more-about-css-pseudo-selectors-by-building-a-balance-sheet/61fdac1e31692f9a9ad97295.md @@ -9,7 +9,7 @@ dashedName: step-31 CSS-властивість `clip` використовують для визначення видимих частин елемента. Встановіть селектору `span[class~="sr-only"]` властивість `clip` зі значенням `rect(1px, 1px, 1px, 1px)`. -Властивість `clip-path` визначає форму властивості `clip`. Використайте обидва селектори `clip-path` та `-webkit-clip-path`, щоб встановити значення `inset(50%)`, створюючи форму області (прямокутник) всередині елемента. +Властивість `clip-path` визначає форму властивості `clip`. Встановіть значення властивостей `clip-path` та `-webkit-clip-path` на `inset(50%)`, створюючи всередині елемента прямокутник. # --hints-- diff --git a/curriculum/challenges/ukrainian/14-responsive-web-design-22/learn-more-about-css-pseudo-selectors-by-building-a-balance-sheet/62017b6f47454059bf2d3bd1.md b/curriculum/challenges/ukrainian/14-responsive-web-design-22/learn-more-about-css-pseudo-selectors-by-building-a-balance-sheet/62017b6f47454059bf2d3bd1.md index 878998378f8..7e72875c070 100644 --- a/curriculum/challenges/ukrainian/14-responsive-web-design-22/learn-more-about-css-pseudo-selectors-by-building-a-balance-sheet/62017b6f47454059bf2d3bd1.md +++ b/curriculum/challenges/ukrainian/14-responsive-web-design-22/learn-more-about-css-pseudo-selectors-by-building-a-balance-sheet/62017b6f47454059bf2d3bd1.md @@ -9,7 +9,7 @@ dashedName: step-45 Перш ніж ви почнете занурюватися в саму таблицю, наразі ваші елементи `span` виділені жирним шрифтом. Створіть селектор `span:not(.sr-only)` та надайте йому властивість `font-weight` зі значенням `normal`. -Псевдоселектор `:not()` використовують для націлювання на всі елементи, які не відповідають селектору: в цьому випадку будь-який з ваших елементів `span`, який не має клас `span[class~="sr-only"]`. Це гарантує, що ваші попередні правила для класу `sr-only` не будуть перезаписані. +Псевдоселектор `:not()` використовують для націлення всіх елементів, які не відповідають селектору: в цьому разі будь-який з ваших елементів `span`, який не має клас `sr-only`. Це гарантує, що попередні правила для селектора `span[class~="sr-only"]` не будуть перезаписані. # --hints-- diff --git a/curriculum/challenges/ukrainian/15-javascript-algorithms-and-data-structures-22/build-a-caesars-cipher-project/caesars-cipher.md b/curriculum/challenges/ukrainian/15-javascript-algorithms-and-data-structures-22/build-a-caesars-cipher-project/caesars-cipher.md new file mode 100644 index 00000000000..b4025c1a63a --- /dev/null +++ b/curriculum/challenges/ukrainian/15-javascript-algorithms-and-data-structures-22/build-a-caesars-cipher-project/caesars-cipher.md @@ -0,0 +1,88 @@ +--- +id: 56533eb9ac21ba0edf2244e2 +title: Створіть шифр Цезаря +challengeType: 5 +forumTopicId: 16003 +dashedName: build-a-caesars-cipher +--- + +# --description-- + +Одним з найпростіших і найпоширеніших шифрів є шифр Цезаря, також відомий як шифр зсуву. У шифрі зсуву значення літери зміщене на встановлену кількість. + +Часто використовують шифр ROT13, який зміщує літеру на 13 місць. Таким чином, `A ↔ N`, `B ↔ O` і так далі. + +Напишіть функцію, яка приймає закодований рядок ROT13 як вхідні дані та повертає декодований. + +Всі літери повинні бути великими. Не замінюйте неалфавітні символи (пробіли, знаки пунктуації), але перенесіть їх. + +# --hints-- + +`rot13("SERR PBQR PNZC")` повинен декодувати рядок `FREE CODE CAMP` + +```js +assert(rot13('SERR PBQR PNZC') === 'FREE CODE CAMP'); +``` + +`rot13("SERR CVMMN!")` повинен декодувати рядок `FREE PIZZA!` + +```js +assert(rot13('SERR CVMMN!') === 'FREE PIZZA!'); +``` + +`rot13("SERR YBIR?")` повинен декодувати рядок `FREE LOVE?` + +```js +assert(rot13('SERR YBIR?') === 'FREE LOVE?'); +``` + +`rot13("GUR DHVPX OEBJA SBK WHZCF BIRE GUR YNML QBT.")` повинен декодувати рядок `THE QUICK BROWN FOX JUMPS OVER THE LAZY DOG.` + +```js +assert( + rot13('GUR DHVPX OEBJA SBK WHZCF BIRE GUR YNML QBT.') === + 'THE QUICK BROWN FOX JUMPS OVER THE LAZY DOG.' +); +``` + +# --seed-- + +## --seed-contents-- + +```js +function rot13(str) { + return str; +} + +rot13("SERR PBQR PNZC"); +``` + +# --solutions-- + +```js +var lookup = { + 'A': 'N','B': 'O','C': 'P','D': 'Q', + 'E': 'R','F': 'S','G': 'T','H': 'U', + 'I': 'V','J': 'W','K': 'X','L': 'Y', + 'M': 'Z','N': 'A','O': 'B','P': 'C', + 'Q': 'D','R': 'E','S': 'F','T': 'G', + 'U': 'H','V': 'I','W': 'J','X': 'K', + 'Y': 'L','Z': 'M' +}; + +function rot13(encodedStr) { + var codeArr = encodedStr.split(""); // String to Array + var decodedArr = []; // Your Result goes here + // Only change code below this line + + decodedArr = codeArr.map(function(letter) { + if(lookup.hasOwnProperty(letter)) { + letter = lookup[letter]; + } + return letter; + }); + + // Only change code above this line + return decodedArr.join(""); // Array to String +} +``` diff --git a/curriculum/challenges/ukrainian/15-javascript-algorithms-and-data-structures-22/build-a-roman-numeral-converter-project/roman-numeral-converter.md b/curriculum/challenges/ukrainian/15-javascript-algorithms-and-data-structures-22/build-a-roman-numeral-converter-project/roman-numeral-converter.md new file mode 100644 index 00000000000..0182fe6ef82 --- /dev/null +++ b/curriculum/challenges/ukrainian/15-javascript-algorithms-and-data-structures-22/build-a-roman-numeral-converter-project/roman-numeral-converter.md @@ -0,0 +1,215 @@ +--- +id: a7f4d8f2483413a6ce226cac +title: Створіть конвертер римських чисел +challengeType: 5 +forumTopicId: 16044 +dashedName: build-a-roman-numeral-converter +--- + +# --description-- + +Перетворіть подане число в римське число. + +| Римські числа | Арабські числа | +| ------------- | -------------- | +| M | 1000 | +| CM | 900 | +| D | 500 | +| CD | 400 | +| С | 100 | +| XC | 90 | +| L | 50 | +| XL | 40 | +| X | 10 | +| IX | 9 | +| V | 5 | +| IV | 4 | +| I | 1 | + +Всі римські числа повинні бути написаними великими літерами. + +# --hints-- + +`convertToRoman(2)` повинен повертати рядок `II`. + +```js +assert.deepEqual(convertToRoman(2), 'II'); +``` + +`convertToRoman(3)` повинен повертати рядок `III`. + +```js +assert.deepEqual(convertToRoman(3), 'III'); +``` + +`convertToRoman(4)` повинен повертати рядок `IV`. + +```js +assert.deepEqual(convertToRoman(4), 'IV'); +``` + +`convertToRoman(5)` повинен повертати рядок `V`. + +```js +assert.deepEqual(convertToRoman(5), 'V'); +``` + +`convertToRoman(9)` повинен повертати рядок `IX`. + +```js +assert.deepEqual(convertToRoman(9), 'IX'); +``` + +`convertToRoman(12)` повинен повертати рядок `XII`. + +```js +assert.deepEqual(convertToRoman(12), 'XII'); +``` + +`convertToRoman(16)` повинен повертати рядок `XVI`. + +```js +assert.deepEqual(convertToRoman(16), 'XVI'); +``` + +`convertToRoman(29)` повинен повертати рядок `XXIX`. + +```js +assert.deepEqual(convertToRoman(29), 'XXIX'); +``` + +`convertToRoman(44)` повинен повертати рядок `XLIV`. + +```js +assert.deepEqual(convertToRoman(44), 'XLIV'); +``` + +`convertToRoman(45)` повинен повертати рядок `XLV`. + +```js +assert.deepEqual(convertToRoman(45), 'XLV'); +``` + +`convertToRoman(68)` повинен повертати рядок `LXVIII` + +```js +assert.deepEqual(convertToRoman(68), 'LXVIII'); +``` + +`convertToRoman(83)` повинен повертати рядок `LXXXIII` + +```js +assert.deepEqual(convertToRoman(83), 'LXXXIII'); +``` + +`convertToRoman(97)` повинен повертати рядок `XCVII` + +```js +assert.deepEqual(convertToRoman(97), 'XCVII'); +``` + +`convertToRoman(99)` повинен повертати рядок `XCIX` + +```js +assert.deepEqual(convertToRoman(99), 'XCIX'); +``` + +`convertToRoman(400)` повинен повертати рядок `CD` + +```js +assert.deepEqual(convertToRoman(400), 'CD'); +``` + +`convertToRoman(500)` повинен повертати рядок `D` + +```js +assert.deepEqual(convertToRoman(500), 'D'); +``` + +`convertToRoman(501)` повинен повертати рядок `DI` + +```js +assert.deepEqual(convertToRoman(501), 'DI'); +``` + +`convertToRoman(649)` повинен повертати рядок `DCXLIX` + +```js +assert.deepEqual(convertToRoman(649), 'DCXLIX'); +``` + +`convertToRoman(798)` повинен повертати рядок `DCCXCVIII` + +```js +assert.deepEqual(convertToRoman(798), 'DCCXCVIII'); +``` + +`convertToRoman(891)` повинен повертати рядок `DCCCXCI` + +```js +assert.deepEqual(convertToRoman(891), 'DCCCXCI'); +``` + +`convertToRoman(1000)` повинен повертати рядок `M` + +```js +assert.deepEqual(convertToRoman(1000), 'M'); +``` + +`convertToRoman(1004)` повинен повертати рядок `MIV` + +```js +assert.deepEqual(convertToRoman(1004), 'MIV'); +``` + +`convertToRoman(1006)` повинен повертати рядок `MVI` + +```js +assert.deepEqual(convertToRoman(1006), 'MVI'); +``` + +`convertToRoman(1023)` повинен повертати рядок `MXXIII` + +```js +assert.deepEqual(convertToRoman(1023), 'MXXIII'); +``` + +`convertToRoman(2014)` повинен повертати рядок `MMXIV` + +```js +assert.deepEqual(convertToRoman(2014), 'MMXIV'); +``` + +`convertToRoman(3999)` повинен повертати рядок `MMMCMXCIX` + +```js +assert.deepEqual(convertToRoman(3999), 'MMMCMXCIX'); +``` + +# --seed-- + +## --seed-contents-- + +```js +function convertToRoman(num) { + return num; +} + +convertToRoman(36); +``` + +# --solutions-- + +```js +function convertToRoman(num) { + var ref = [['M', 1000], ['CM', 900], ['D', 500], ['CD', 400], ['C', 100], ['XC', 90], ['L', 50], ['XL', 40], ['X', 10], ['IX', 9], ['V', 5], ['IV', 4], ['I', 1]]; + var res = []; + ref.forEach(function(p) { + while (num >= p[1]) { + res.push(p[0]); + num -= p[1]; + } + }); + return res.join(''); +} +``` diff --git a/curriculum/challenges/ukrainian/15-javascript-algorithms-and-data-structures-22/build-a-telephone-number-validator-project/telephone-number-validator.md b/curriculum/challenges/ukrainian/15-javascript-algorithms-and-data-structures-22/build-a-telephone-number-validator-project/telephone-number-validator.md new file mode 100644 index 00000000000..8dbbc579286 --- /dev/null +++ b/curriculum/challenges/ukrainian/15-javascript-algorithms-and-data-structures-22/build-a-telephone-number-validator-project/telephone-number-validator.md @@ -0,0 +1,217 @@ +--- +id: aff0395860f5d3034dc0bfc9 +title: Створіть валідатор мобільного номера +challengeType: 5 +forumTopicId: 16090 +dashedName: build-a-telephone-number-validator +--- + +# --description-- + +Поверніть `true`, якщо наданий рядок виглядає як дійсний мобільний номер США. + +Користувач може заповнити поле форми в будь-який спосіб, тільки якщо він має формат дійсного номера США. Нижче наведені приклади припустимих форматів номерів США (для інших варіантів посилайтесь на тести, подані нижче): + +
555-555-5555
(555)555-5555
(555) 555-5555
555 555 5555
5555555555
1 555 555 5555
+ +В цьому челенджі вам буде надано рядок, наприклад `800-692-7753` або `8oo-six427676;laskdjf`. Ваше завдання – підтвердити або відхилити мобільний номер США на основі будь-якої комбінації форматів, наданих вище. Код зони нумерації є обов'язковим. Якщо надано телефонний код країни, то ви повинні підтвердити, що телефонний код країни – `1`. Поверніть `true`, якщо рядок є дійсним мобільним номером США; в іншому випадку, поверніть `false`. + +# --hints-- + +`telephoneCheck("555-555-5555")` повинен повертати булеве значення. + +```js +assert(typeof telephoneCheck('555-555-5555') === 'boolean'); +``` + +`telephoneCheck("1 555-555-5555")` повинен повертати `true`. + +```js +assert(telephoneCheck('1 555-555-5555') === true); +``` + +`telephoneCheck("1 (555) 555-5555")` повинен повертати `true`. + +```js +assert(telephoneCheck('1 (555) 555-5555') === true); +``` + +`telephoneCheck("5555555555")` повинен повертати `true`. + +```js +assert(telephoneCheck('5555555555') === true); +``` + +`telephoneCheck("555-555-5555")` повинен повертати `true`. + +```js +assert(telephoneCheck('555-555-5555') === true); +``` + +`telephoneCheck("(555)555-5555")` повинен повертати `true`. + +```js +assert(telephoneCheck('(555)555-5555') === true); +``` + +`telephoneCheck("1(555)555-5555")` повинен повертати `true`. + +```js +assert(telephoneCheck('1(555)555-5555') === true); +``` + +`telephoneCheck("555-5555")` повинен повертати `false`. + +```js +assert(telephoneCheck('555-5555') === false); +``` + +`telephoneCheck("5555555")` повинен повертати `false`. + +```js +assert(telephoneCheck('5555555') === false); +``` + +`telephoneCheck("1 555)555-5555")` повинен повертати `false`. + +```js +assert(telephoneCheck('1 555)555-5555') === false); +``` + +`telephoneCheck("1 555 555 5555")` повинен повертати `true`. + +```js +assert(telephoneCheck('1 555 555 5555') === true); +``` + +`telephoneCheck("1 456 789 4444")` повинен повертати `true`. + +```js +assert(telephoneCheck('1 456 789 4444') === true); +``` + +`telephoneCheck("123**&!!asdf#")` повинен повертати `false`. + +```js +assert(telephoneCheck('123**&!!asdf#') === false); +``` + +`telephoneCheck("55555555")` повинен повертати `false`. + +```js +assert(telephoneCheck('55555555') === false); +``` + +`telephoneCheck("(6054756961)")` повинен повертати `false`. + +```js +assert(telephoneCheck('(6054756961)') === false); +``` + +`telephoneCheck("2 (757) 622-7382")` повинен повертати `false`. + +```js +assert(telephoneCheck('2 (757) 622-7382') === false); +``` + +`telephoneCheck("0 (757) 622-7382")` повинен повертати `false`. + +```js +assert(telephoneCheck('0 (757) 622-7382') === false); +``` + +`telephoneCheck("-1 (757) 622-7382")` повинен повертати `false`. + +```js +assert(telephoneCheck('-1 (757) 622-7382') === false); +``` + +`telephoneCheck("2 757 622-7382")` повинен повертати `false`. + +```js +assert(telephoneCheck('2 757 622-7382') === false); +``` + +`telephoneCheck("10 (757) 622-7382")` повинен повертати `false`. + +```js +assert(telephoneCheck('10 (757) 622-7382') === false); +``` + +`telephoneCheck("27576227382")` повинен повертати `false`. + +```js +assert(telephoneCheck('27576227382') === false); +``` + +`telephoneCheck("(275)76227382")` повинен повертати `false`. + +```js +assert(telephoneCheck('(275)76227382') === false); +``` + +`telephoneCheck("2(757)6227382")` повинен повертати `false`. + +```js +assert(telephoneCheck('2(757)6227382') === false); +``` + +`telephoneCheck("2(757)622-7382")` повинен повертати `false`. + +```js +assert(telephoneCheck('2(757)622-7382') === false); +``` + +`telephoneCheck("555)-555-5555")` повинен повертати `false`. + +```js +assert(telephoneCheck('555)-555-5555') === false); +``` + +`telephoneCheck("(555-555-5555")` повинен повертати `false`. + +```js +assert(telephoneCheck('(555-555-5555') === false); +``` + +`telephoneCheck("(555)5(55?)-5555")` повинен повертати `false`. + +```js +assert(telephoneCheck('(555)5(55?)-5555') === false); +``` + +`telephoneCheck("55 55-55-555-5")` повинен повертати `false`. + +```js +assert(telephoneCheck('55 55-55-555-5') === false); +``` + +`telephoneCheck("11 555-555-5555")` повинен повертати `false`. + +```js +assert(telephoneCheck('11 555-555-5555') === false); +``` + +# --seed-- + +## --seed-contents-- + +```js +function telephoneCheck(str) { + return true; +} + +telephoneCheck("555-555-5555"); +``` + +# --solutions-- + +```js +var re = /^([+]?1[\s]?)?((?:[(](?:[2-9]1[02-9]|[2-9][02-8][0-9])[)][\s]?)|(?:(?:[2-9]1[02-9]|[2-9][02-8][0-9])[\s.-]?)){1}([2-9]1[02-9]|[2-9][02-9]1|[2-9][02-9]{2}[\s.-]?){1}([0-9]{4}){1}$/; + +function telephoneCheck(str) { + return re.test(str); +} + +telephoneCheck("555-555-5555"); +```