chore(i18n,learn): processed translations (#48631)

This commit is contained in:
camperbot
2022-11-30 08:15:49 -08:00
committed by GitHub
parent eafd5aa2e3
commit 1bf2ca0cdc
108 changed files with 285 additions and 285 deletions

View File

@@ -35,7 +35,7 @@ assert.exists(document.querySelector('section:last-of-type + button') || documen
assert.exists(document.querySelector('button[type="submit"]') || document.querySelector('form > input[type="submit"]'));
```
The submit should display the text `Send`.
يجب أن يعرض زر الإرسال (submit) نص `Send`.
```js
assert.equal(document.querySelector('button[type="submit"]')?.textContent ?? document.querySelector('input[type="submit"]')?.value, 'Send');

View File

@@ -7,7 +7,7 @@ dashedName: step-7
# --description--
Use an id selector to give the element with the id `back-wall` a `background-color` of `#8B4513`.
استخدم محدد معرف (id selector) لإعطاء عنصر `back-wall` خاصية `background-color` بقيمة `#8B4513`.
# --hints--

View File

@@ -7,7 +7,7 @@ dashedName: step-25
# --description--
Using an id selector, give the element with the id `gray-instrument` a `width` of `15%`, a `height` of `40%`, and a `background-color` of `rgb(167, 162, 117)`.
باستعمال منتقي معرف (id selector), اعطي عنصر الذي يحتوي على معرف (id) يسمى `gray-instrument` خاصية `width` بقيمة `15%`، و`height` بقيمة `40%`، و `background-color` بقيمة `rgb(167, 162, 117)`.
# --hints--

View File

@@ -7,7 +7,7 @@ dashedName: step-64
# --description--
Style the element with the id `black-round-hat` using an id selector. عيّن `width` بقيمة `180px`, و`height` بقيمة `150px`, و`background-color` بقيمة `rgb(45, 31, 19)`.
حدد العنصر يحتوي على معرف (id) يسمى `black-round-hat` باستخدام محدد المعرف (id selector). عيّن `width` بقيمة `180px`, و`height` بقيمة `150px`, و`background-color` بقيمة `rgb(45, 31, 19)`.
# --hints--

View File

@@ -7,7 +7,7 @@ dashedName: step-69
# --description--
Now move the `#eyes-div` element into position with `position` set to `absolute`, `top` set to `-40px`, and `left` set to `20px`.
الآن أنقل عنصر `#eyes-div` إلى الموضع `position` بقيمة `absolute`، و`top` بقيمة `-40px`، و `left` بقيمة `20px`.
# --hints--

View File

@@ -7,7 +7,7 @@ dashedName: step-79
# --description--
Now use a class selector to target `guitar`. سيؤدي هذا إلى تصميم "نصفي" جيتارك. قم بتعيين `width` إلى `150px`، و `height` إلى `120px` و `background-color` إلى `Goldenrod` و `border-radius` إلى `50%`.
الآن استخدم منتقي فئة (class selector) لاستهداف `guitar`. سيؤدي هذا إلى تصميم "نصفي" جيتارك. قم بتعيين `width` إلى `150px`، و `height` إلى `120px` و `background-color` إلى `Goldenrod` و `border-radius` إلى `50%`.
# --hints--

View File

@@ -7,7 +7,7 @@ dashedName: step-89
# --description--
خطوة واحدة أخيرة. أيقونات FontAwesome صغيرة جدا. Target all of them with a class selector for `fas`, and set the `font-size` to `30px`.
خطوة واحدة أخيرة. أيقونات FontAwesome صغيرة جدا. استخدام منتقي الفئة (class selector) لاستهداف جميع `fas`، وعيّن `font-size` بقيمة `30px`.
بهذا اكتمل رسم بيكاسو الخاص بك!

View File

@@ -8,31 +8,31 @@ dashedName: reverse-a-string
# --description--
Reverse the provided string and return the reversed string.
反轉提供的字符串並返回反轉後的字符串。
For example, `"hello"` should become `"olleh"`.
例如, `"hello"` 應該變成 `"olleh"`
# --hints--
`reverseString("hello")` should return a string.
`reverseString("hello")` 應返回一個字符串。
```js
assert(typeof reverseString('hello') === 'string');
```
`reverseString("hello")` should return the string `olleh`.
`reverseString("hello")` 應返回 `olleh`
```js
assert(reverseString('hello') === 'olleh');
```
`reverseString("Howdy")` should return the string `ydwoH`.
`reverseString("Howdy")` 應返回 `ydwoH`
```js
assert(reverseString('Howdy') === 'ydwoH');
```
`reverseString("Greetings from Earth")` should return the string `htraE morf sgniteerG`.
`reverseString("Greetings from Earth")` 應返回 `htraE morf sgniteerG`
```js
assert(reverseString('Greetings from Earth') === 'htraE morf sgniteerG');

View File

@@ -109,7 +109,7 @@ assert(
);
```
A `setter` should be defined.
應該定義一個 `setter`
```js
assert(

View File

@@ -8,31 +8,31 @@ dashedName: reverse-a-string
# --description--
Reverse the provided string and return the reversed string.
反转提供的字符串并返回反转后的字符串。
For example, `"hello"` should become `"olleh"`.
例如, `"hello"` 应该变成 `"olleh"`
# --hints--
`reverseString("hello")` should return a string.
`reverseString("hello")` 应返回一个字符串。
```js
assert(typeof reverseString('hello') === 'string');
```
`reverseString("hello")` should return the string `olleh`.
`reverseString("hello")` 应返回 `olleh`
```js
assert(reverseString('hello') === 'olleh');
```
`reverseString("Howdy")` should return the string `ydwoH`.
`reverseString("Howdy")` 应返回 `ydwoH`
```js
assert(reverseString('Howdy') === 'ydwoH');
```
`reverseString("Greetings from Earth")` should return the string `htraE morf sgniteerG`.
`reverseString("Greetings from Earth")` 应返回 `htraE morf sgniteerG`
```js
assert(reverseString('Greetings from Earth') === 'htraE morf sgniteerG');

View File

@@ -109,7 +109,7 @@ assert(
);
```
A `setter` should be defined.
应该定义一个 `setter`
```js
assert(

View File

@@ -31,7 +31,7 @@ Verkette in der Route `app.get('/now', ...)` eine Middleware-Funktion und den fi
# --hints--
The /now endpoint should have mounted middleware
Der /now-Endpunkt sollte über eine eingebundene Middleware verfügen
```js
(getUserInput) =>

View File

@@ -1,6 +1,6 @@
---
id: 587d7fb2367417b2b2512bf5
title: Get Route Parameter Input from the Client
title: Routen-Eingabeparameter vom Kunden erhalten
challengeType: 2
forumTopicId: 301513
dashedName: get-route-parameter-input-from-the-client

View File

@@ -1,6 +1,6 @@
---
id: 587d7fb1367417b2b2512bf3
title: Implement a Root-Level Request Logger Middleware
title: Implementiere eine Anfragenlogger-Middleware auf Hauptverzeichnisebene
challengeType: 2
forumTopicId: 301514
dashedName: implement-a-root-level-request-logger-middleware
@@ -29,7 +29,7 @@ Baue einen einfachen Logger. Für jede Anfrage sollte ein String folgenden Forma
# --hints--
Root level logger middleware should be active
Logger-Middleware auf Hauptverzeichnisebene sollte aktiv sein
```js
(getUserInput) =>

View File

@@ -1,6 +1,6 @@
---
id: 587d7fb0367417b2b2512bed
title: Meet the Node console
title: Lerne Node console kennen
challengeType: 2
forumTopicId: 301515
dashedName: meet-the-node-console
@@ -8,11 +8,11 @@ dashedName: meet-the-node-console
# --description--
Working on these challenges will involve you writing your code using one of the following methods:
Bei der Arbeit an diesen Aufgaben wirst du deinen Code mithilfe folgender Methoden schreiben:
- Clone <a href="https://github.com/freeCodeCamp/boilerplate-express/" target="_blank" rel="noopener noreferrer nofollow">this GitHub repo</a> and complete these challenges locally.
- Use <a href="https://replit.com/github/freeCodeCamp/boilerplate-express" target="_blank" rel="noopener noreferrer nofollow">our Replit starter project</a> to complete these challenges.
- Use a site builder of your choice to complete the project. Be sure to incorporate all the files from our GitHub repo.
- Klone <a href="https://github.com/freeCodeCamp/boilerplate-express/" target="_blank" rel="noopener noreferrer nofollow">dieses GitHub-Repo</a> und schließe dein Projekt lokal ab.
- Benutze <a href="https://replit.com/github/freeCodeCamp/boilerplate-express" target="_blank" rel="noopener noreferrer nofollow">unser Replit-Starterprojekt</a>, um die Aufgaben abzuschließen.
- Verwende einen Site Builder deiner Wahl, um das Projekt abzuschließen. Achte darauf, alle Dateien aus unserem GitHub Repo zu integrieren.
If you use Replit, follow these steps to set up the project:

View File

@@ -8,7 +8,7 @@ dashedName: serve-an-html-file
# --description--
Du kannst auf Anfragen mit einer Datei antworten, indem du die Methode `res.sendFile(path)` verwendest. You can put it inside the `app.get('/', ...)` route handler. Behind the scenes, this method will set the appropriate headers to instruct your browser on how to handle the file you want to send, according to its type. Dann wird die Datei gelesen und gesendet. Diese Methode benötigt einen absoluten Dateipfad. Wir empfehlen dir, die globale Node-Variable `__dirname` zu verwenden, um den Pfad wie folgt zu berechnen:
Du kannst auf Anfragen mit einer Datei antworten, indem du die Methode `res.sendFile(path)` verwendest. Du kannst sie im `app.get('/', ...)`-Route-Handler einfügen. Im Hintergrund setzt diese Methode die jeweiligen Header, um deinem Browser mitzuteilen, wie er die von dir gesendete Datei je nach Typ zu verarbeiten hat. Dann wird die Datei gelesen und gesendet. Diese Methode benötigt einen absoluten Dateipfad. Wir empfehlen dir, die globale Node-Variable `__dirname` zu verwenden, um den Pfad wie folgt zu berechnen:
```js
absolutePath = __dirname + relativePath/file.ext
@@ -16,13 +16,13 @@ absolutePath = __dirname + relativePath/file.ext
# --instructions--
Sende die `/views/index.html`-Datei als Antwort auf GET-Anfragen an den `/`-Pfad. If you view your live app, you should see a big HTML heading (and a form that we will use later…), with no style applied.
Sende die `/views/index.html`-Datei als Antwort auf GET-Anfragen an den `/`-Pfad. Siehst du dir deine laufende Anwendung an, solltest du eine große HTML-Überschrift ohne angewandten Stil sehen (und ein Formular, welches wir später verwenden werden...).
**Note:** You can edit the solution of the previous challenge or create a new one. If you create a new solution, keep in mind that Express evaluates routes from top to bottom, and executes the handler for the first match. You have to comment out the preceding solution, or the server will keep responding with a string.
**Hinweis:** Du kannst die Lösung der vorherigen Aufgabe bearbeiten oder eine neue erstellen. Wenn du eine neue Lösung erstellst, beachte, dass Express die Pfade von oben nach unten auswertet und den Handler für die erste Übereinstimmung ausführt. Du musst die vorangehende Lösung entkommentieren, sonst antwortet der Server weiterhin mit einem String.
# --hints--
Your app should serve the file views/index.html
Die Anwendung sollte die Datei views/index.html bereitstellen
```js
(getUserInput) =>

View File

@@ -1,6 +1,6 @@
---
id: 587d7fb1367417b2b2512bf1
title: Serve JSON on a Specific Route
title: Bereitstellen von JSON auf einer bestimmten Route
challengeType: 2
forumTopicId: 301517
dashedName: serve-json-on-a-specific-route
@@ -8,17 +8,17 @@ dashedName: serve-json-on-a-specific-route
# --description--
While an HTML server serves HTML, an API serves data. A <dfn>REST</dfn> (REpresentational State Transfer) API allows data exchange in a simple way, without the need for clients to know any detail about the server. The client only needs to know where the resource is (the URL), and the action it wants to perform on it (the verb). The GET verb is used when you are fetching some information, without modifying anything. These days, the preferred data format for moving information around the web is JSON. Simply put, JSON is a convenient way to represent a JavaScript object as a string, so it can be easily transmitted.
Während ein normaler HTML-Server HTML liefert, liefert eine API Daten. Eine <dfn>REST</dfn>-API (REpresentational State Transfer) erlaubt Datenaustausch auf eine einfachere Art und Weise ohne dass Nutzer Details über den Server wissen müssen. Der Benutzer muss hierbei lediglich den Ort der Quelle (die URL) sowie die hier auszuführende Aktion wissen (das Verb). Das GET-Verb wird bei reinen Datenaufrufen benutzt ohne etwas zu ändern. Heutzutage ist das für Datentransfers bevorzugte Format JSON. Einfach ausgedrückt: JSON ist eine bequeme Möglichkeit, mit einem JavaScript-Objekt als String zu arbeiten, um Datenübertragungen zu erleichtern.
Let's create a simple API by creating a route that responds with JSON at the path `/json`. You can do it as usual, with the `app.get()` method. Inside the route handler, use the method `res.json()`, passing in an object as an argument. This method closes the request-response loop, returning the data. Behind the scenes, it converts a valid JavaScript object into a string, then sets the appropriate headers to tell your browser that you are serving JSON, and sends the data back. A valid object has the usual structure `{key: data}`. `data` can be a number, a string, a nested object or an array. `data` can also be a variable or the result of a function call, in which case it will be evaluated before being converted into a string.
Lass uns eine einfache API erstellen, indem wir eine JSON zurückgebende Route unter dem Pfad `/json` erstellen. Du kannst das wie immer mit der `app.get()`-Methode machen. Benutze innerhalb des Route-Handlers die Methode `res.json()`, und übergebe ihr ein Objekt als Argument. Diese Methode schließt die Anfrage-Antwort-Schleife und gibt die Daten zurück. Hinter den Kulissen wird hierbei ein gültiges JavaScript-Objekt in einen String konvertiert, anschließend werden die entsprechenden Header gesetzt, um deinen Browser mitzuteilen, dass du JSON-Daten lieferst danach werden die Daten zurückgegeben. Ein gültiges Objekt hat die bekannte Struktur `{key: data}`. `data` kann hierbei eine Nummer, ein String, ein verschachteltes Objekt oder ein Array sein. `data` kann auch eine Variable, oder das Ergebnis eines Function-Calls sein, in diesem Fall werden die Daten vor Umwandlung in einen String überprüft.
# --instructions--
Serve the object `{"message": "Hello json"}` as a response, in JSON format, to GET requests to the `/json` route. Then point your browser to `your-app-url/json`, you should see the message on the screen.
Liefere das Objekt `{"message": "Hello json"}` im JSON-Format als Antwort, um GET-Anfragen der `/json`-Route zu beantworten. Wenn du anschließend mit deinem Browser `your-app-url/json` aufrufst, solltest du die Nachricht auf deinem Bildschirm sehen.
# --hints--
The endpoint `/json` should serve the json object `{"message": "Hello json"}`
Der Endpunkt `/json` sollte das JSON-Objekt `{"message": "Hello json"}` liefern
```js
(getUserInput) =>

View File

@@ -1,6 +1,6 @@
---
id: 587d7fb0367417b2b2512bf0
title: Serve Static Assets
title: Bereitstellen von statischen Assets
challengeType: 2
forumTopicId: 301518
dashedName: serve-static-assets
@@ -8,21 +8,21 @@ dashedName: serve-static-assets
# --description--
An HTML server usually has one or more directories that are accessible by the user. You can place there the static assets needed by your application (stylesheets, scripts, images).
Ein HTML-Server verfügt normalerweise über ein oder mehr Verzeichnisse, die vom Nutzer zugänglich sind. Hier kannst du jene Assets platzieren, die von deiner Anwendung benötigt werden (Stylesheets, Skripte, Bilder).
In Express, you can put in place this functionality using the middleware `express.static(path)`, where the `path` parameter is the absolute path of the folder containing the assets.
Mit Express kannst du von dieser Funktion mit der Middleware `express.static(path)` Gebrauch machen der `path`-Parameter ist hier der absolute Pfad, in dem sich die Assets befinden.
If you dont know what middleware is... dont worry, we will discuss in detail later. Basically, middleware are functions that intercept route handlers, adding some kind of information. A middleware needs to be mounted using the method `app.use(path, middlewareFunction)`. The first `path` argument is optional. If you dont pass it, the middleware will be executed for all requests.
Wenn du nicht weißt, was Middleware ist... keine Sorge, wir werden das noch im Detail besprechen. Ganz allgemein sind Middleware Funktionen, die sich in Route-Handler zwischenschalten und Informationen hinzufügen. Eine Middleware wird mit der Methode `app.use(path, middlewareFunction)` aufgesetzt. Hierbei ist das erste `path`-Argument optional. Übergibst du dieses nicht, wird die Middleware für alle Anfragen ausgeführt.
# --instructions--
Mount the `express.static()` middleware to the path `/public` with `app.use()`. The absolute path to the assets folder is `__dirname + /public`.
Setze eine `express.static()`-Middleware für den Pfad `/public` mit `app.use()` auf. Der absolute Pfad zum Assets-Ordner ist `__dirname + /public`.
Now your app should be able to serve a CSS stylesheet. Note that the `/public/style.css` file is referenced in the `/views/index.html` in the project boilerplate. Your front-page should look a little better now!
Jetzt sollte deine Anwendung ein CSS-Stylesheet liefern können. Beachte, dass die `/public/style.css`-Datei in der `/views/index.html` in der Projekt-Boilerplate verwendet wird. Nun sollte deine Startseite bereits ein wenig besser aussehen!
# --hints--
Your app should serve asset files from the `/public` directory to the `/public` path
Deine Anwendung sollte Asset-Dateien des `/public`-Verzeichnisses an den `/public`-Pfad liefern
```js
(getUserInput) =>

View File

@@ -1,6 +1,6 @@
---
id: 587d7fb0367417b2b2512bee
title: Start a Working Express Server
title: Starte einen funktionierenden Express-Server
challengeType: 2
forumTopicId: 301519
dashedName: start-a-working-express-server
@@ -8,9 +8,9 @@ dashedName: start-a-working-express-server
# --description--
In the first two lines of the file `myApp.js`, you can see how easy it is to create an Express app object. This object has several methods, and you will learn many of them in these challenges. One fundamental method is `app.listen(port)`. It tells your server to listen on a given port, putting it in running state. For testing reasons, we need the app to be running in the background so we added this method in the `server.js` file for you.
In den ersten zwei Zeilen der Datei `myApp.js` siehst du, wie einfach es ist, ein Objekt der Express-Bibliothek zu erzeugen. Dieses Objekt verfügt über verschiedene Methoden in diesen Aufgaben lernst du mehrere dieser kennen. Eine grundlegende Methode ist hierbei `app.listen(port)`. Diese teilt deinen Server mit, auf einen bestimmten Port zu hören, und sich in den Zustand "running" zu begeben. Aus Testzwecken muss diese Anwendung im Hintergrund laufen wir haben deshalb diese Methode in der Datei `server.js` für dich erstellt.
Lets serve our first string! In Express, routes takes the following structure: `app.METHOD(PATH, HANDLER)`. METHOD is an http method in lowercase. PATH is a relative path on the server (it can be a string, or even a regular expression). HANDLER is a function that Express calls when the route is matched. Handlers take the form `function(req, res) {...}`, where req is the request object, and res is the response object. For example, the handler
Lass uns unseren ersten String erstellen! In Express verwenden Routen die folgende Struktur: `app.METHOD(PATH, HANDLER)`. METHOD ist eine HTTP-Methode in Kleinbuchstaben. PATH ist ein relativer Pfad auf deinem Server (kann sowohl String als auch regulärer Ausdruck sein). HANDLER ist eine von Express aufgerufene Funktion, wenn auf die Route zugegriffen wird. Handler werden über das Format `function(req, res) {...}` verwendet req ist hier das Anfragen- und res das Antwortobjekt. So wird dieser Handler beispielsweise
```js
function(req, res) {
@@ -18,17 +18,17 @@ function(req, res) {
}
```
will serve the string 'Response String'.
den String 'Response String' zurückgeben.
# --instructions--
Use the `app.get()` method to serve the string "Hello Express" to GET requests matching the `/` (root) path. Be sure that your code works by looking at the logs, then see the results in the preview if you are using Replit.
Benutze die `app.get()`-Methode, um den String "Hello Express" an GET Anfragen zu erstellen, die mit `/` (Hauptverzeichnis) übereinstimmen. Stelle über einen Blick auf die Logs sicher, dass dein Code funktioniert; siehe dann die Ergebnisse in der Vorschau ein wenn du Replit verwendest.
**Note:** All the code for these lessons should be added in between the few lines of code we have started you off with.
**Hinweis:** Der gesamte Code für diese Lektionen sollte zwischen den wenigen Codezeilen eingefügt werden, mit denen du angefangen hast.
# --hints--
Your app should serve the string 'Hello Express'
Deine App sollte die Zeichenfolge "Hello Express" ausgeben
```js
(getUserInput) =>

View File

@@ -1,6 +1,6 @@
---
id: 587d7fb2367417b2b2512bf7
title: Use body-parser to Parse POST Requests
title: Body-Parser verwenden, um POST-Anfragen zu parsen
challengeType: 2
forumTopicId: 301520
dashedName: use-body-parser-to-parse-post-requests
@@ -8,9 +8,9 @@ dashedName: use-body-parser-to-parse-post-requests
# --description--
Besides GET, there is another common HTTP verb, it is POST. POST is the default method used to send client data with HTML forms. In REST convention, POST is used to send data to create new items in the database (a new user, or a new blog post). You dont have a database in this project, but you are going to learn how to handle POST requests anyway.
Neben GET gibt es ein weiteres, übliches HTTP-Verb: POST. POST ist die Standardmethode, um Benutzerdaten mit HTML-Formularen abzuschicken. Der REST-Konvention zufolge, wird POST dazu verwendet, Daten zu senden, um neue Einträge in einer Datenbank zu erzeugen (ein neuer Nutzer oder ein neuer Blogeintrag). Für dieses Projekt benötigst du keinen Dateneintrag du wirst dennoch lernen, mit POST-Anfragen zu arbeiten.
In these kind of requests, the data doesnt appear in the URL, it is hidden in the request body. The body is a part of the HTTP request, also called the payload. Even though the data is not visible in the URL, this does not mean that it is private. To see why, look at the raw content of an HTTP POST request:
Bei dieser Art von Anfragen tauchen die Daten nicht in der URL auf sie werden im Anfragen-Body versteckt. Der Body ist Teil einer HTTP-Anfrage, auch Payload genannt. Obwohl die Daten in der URL nicht sichtbar sind, bedeutet das nicht, dass diese privat sind. Schaue dir diesen unverarbeiteten Inhalt einer HTTP-Post-Anfrage an, um herauszufinden, wieso:
```http
POST /path/subpath HTTP/1.0
@@ -22,19 +22,19 @@ Content-Length: 20
name=John+Doe&age=25
```
As you can see, the body is encoded like the query string. This is the default format used by HTML forms. With Ajax, you can also use JSON to handle data having a more complex structure. There is also another type of encoding: multipart/form-data. This one is used to upload binary files. In this exercise, you will use a URL encoded body. To parse the data coming from POST requests, you must use the `body-parser` package. This package allows you to use a series of middleware, which can decode data in different formats.
Wie du siehst, wird der Body genau wie der Abfragen-String kodiert. Das ist das von HTML-Formularen verwendete Standardformat. Mit JSON kannst du über Ajax auch mit Daten komplexerer Struktur arbeiten. Es gibt aber auch eine andere Kodierungsart: multipart/form-data. Diese wird für das Hochladen von Binärdateien verwendet. In dieser Übung wirst du jedoch URL-kodierten Body verwenden. Um die von POST-Anfragen erhaltenen Daten zu parsen, musst du das Paket `body-parser` verwenden. Dieses Paket erlaubt dir, eine Reihe von Middleware-Funktionen zu verwenden, mit welchen du Daten verschiedener Formate dekodieren kannst.
# --instructions--
`body-parser` has already been installed and is in your project's `package.json` file. `require` it at the top of the `myApp.js` file and store it in a variable named `bodyParser`. The middleware to handle URL encoded data is returned by `bodyParser.urlencoded({extended: false})`. Pass the function returned by the previous method call to `app.use()`. As usual, the middleware must be mounted before all the routes that depend on it.
`body-parser` wurde bereits installiert und befindet sich in deiner `package.json` Projektdatei. `require` es am Anfang der `myApp.js`-Datei und speicher es in einer Variable namens `bodyParser`. Die Middleware zur Verarbeitung von URL-kodierten Daten wird von `bodyParser.urlencoded({extended: false})` zurückgegeben. Übergib die Funktion, die durch den vorherigen Methodenaufruf zurückgegeben wurde, an `app.use()`. Wie üblich muss die Middleware vor allen Pfaden eingebaut werden, die von ihr abhängen.
**Note:** `extended` is a configuration option that tells `body-parser` which parsing needs to be used. When `extended=false` it uses the classic encoding `querystring` library. When `extended=true` it uses `qs` library for parsing.
**Hinweis:** `extended` ist eine Konfigurationsoption, die dem `body-parser` mitteilt, welches Parsing verwendet werden muss. Bei `extended=false` wird die klassische Kodierung der `querystring` Bibliothek verwendet. Ist `extended=true`, wird die Bibliothek `qs` zum Parsen verwendet.
When using `extended=false`, values can be only strings or arrays. The object returned when using `querystring` does not prototypically inherit from the default JavaScript `Object`, which means functions like `hasOwnProperty`, `toString` will not be available. The extended version allows more data flexibility, but it is outmatched by JSON.
Bei `extended=false` können Werte ausschließlich Strings oder Arrays sein. Das von `querystring` zurückgegebene Objekt erbt nicht prototypisch vom klassischen JavaScript-`Object`, weshalb Funktionen wie `hasOwnProperty` und `toString` nicht verwendbar sind. Zwar erlaubt die erweiterte Version mehr Datenflexibilität, wird aber von JSON übertroffen.
# --hints--
The 'body-parser' middleware should be mounted
Die Middleware 'body-parser' sollte aufgesetzt werden
```js
(getUserInput) =>

View File

@@ -22,7 +22,7 @@ Greife nun in dem `/json`-GET-Route-Handler, den du in der letzten Aufgabe erste
**Hinweis:** Nutzt du Replit, kannst du keine `.env`-Datei erstellen. Benutze stattdessen den eingebauten <dfn>SECRETS</dfn>-Tab, um eine Variabel hinzuzufügen.
Wenn du lokal arbeitest, benötigst du das `dotenv`-Paket. Dieses lädt Umgebungsvariablen deiner `.env`-Datei in `process.env`. Das `dotenv`-Paket wurde bereits installiert und befindet sich in deiner `package.json`-Projektdatei. At the top of your `myApp.js` file, import and load the variables with `require('dotenv').config()`.
Wenn du lokal arbeitest, benötigst du das `dotenv`-Paket. Dieses lädt Umgebungsvariablen deiner `.env`-Datei in `process.env`. Das `dotenv`-Paket wurde bereits installiert und befindet sich in deiner `package.json`-Projektdatei. Importiere und lade die Variablen mit `require('dotenv').config()` am Anfang deiner `myApp.js`-Datei.
# --hints--

View File

@@ -10,7 +10,7 @@ dashedName: add-a-description-to-your-package-json
Der nächste Teil einer guten package.json-Datei ist das `description` Feld; hier sollte eine kurze, aber informative Beschreibung deines Projekts zu finden sein.
If some day you plan to publish a package to npm, this is the string that should sell your idea to the user when they decide whether to install your package or not. Jedoch ist das nicht der einzige Verwendungszweck für die Beschreibung dieses Feld ist ein toller Weg, um zusammenzufassen, worum es in dem Projekt geht. In jedem Node.js-Projekt ist es ebenso wichtig, anderen Entwicklern, zukünftigen Maintainern oder vielleicht sogar deinem zukünftigen Selbst dabei zu helfen, das Projekt schnell zu verstehen.
Solltest du eines Tages planen, ein Paket mit npm zu veröffentlichen, ist das der String, mit welchem du deine Idee dem Nutzer näherbringen solltest. Jedoch ist das nicht der einzige Verwendungszweck für die Beschreibung dieses Feld ist ein toller Weg, um zusammenzufassen, worum es in dem Projekt geht. In jedem Node.js-Projekt ist es ebenso wichtig, anderen Entwicklern, zukünftigen Maintainern oder vielleicht sogar deinem zukünftigen Selbst dabei zu helfen, das Projekt schnell zu verstehen.
Unabhängig davon, was du für dein Projekt planst, wird eine Beschreibung auf jeden Fall empfohlen. Hier ist ein Beispiel:

View File

@@ -10,7 +10,7 @@ dashedName: add-a-license-to-your-package-json
Im Feld `license` teilst du den Nutzern mit, was sie mit deinem Projekt machen dürfen.
Einige gängige Lizenzen für Open-Source-Projekte sind MIT und BSD. Lizenzinformation ist nicht erforderlich, und die Urheberrechtsgesetze der meisten Länder geben dir standardmäßig Eigentumsrechte an deiner Kreation. However, its always a good practice to explicitly state what users can and cant do. Hier ist ein Beispiel für das Lizenzfeld:
Einige gängige Lizenzen für Open-Source-Projekte sind MIT und BSD. Lizenzinformation ist nicht erforderlich, und die Urheberrechtsgesetze der meisten Länder geben dir standardmäßig Eigentumsrechte an deiner Kreation. Es ist jedoch ein bewährtes Verfahren, ausdrücklich anzugeben, was Nutzer machen dürfen und was nicht. Hier ist ein Beispiel für das Lizenzfeld:
```json
"license": "MIT",
@@ -18,7 +18,7 @@ Einige gängige Lizenzen für Open-Source-Projekte sind MIT und BSD. Lizenzinfor
# --instructions--
Fill the `license` field in the package.json file of your project as you find suitable.
Fülle das `license`-Feld in der package.json-Datei deines Projekts so aus, wie du das für notwendig hältst.
# --hints--

View File

@@ -8,7 +8,7 @@ dashedName: expand-your-project-with-external-packages-from-npm
# --description--
Einer der wichtigsten Gründe für die Verwendung eines Paketmanagers, ist dessen leistungstarkes Abhängigkeitsmanagement. Anstatt manuell sicherzustellen, dass du alle Abhängigkeiten erhältst, wenn du ein Projekt auf einem neuen Computer einrichtest, installiert npm alles automatisch für dich. Aber wie kann npm genau wissen, was dein Projekt benötigt? Meet the `dependencies` section of your package.json file.
Einer der wichtigsten Gründe für die Verwendung eines Paketmanagers, ist dessen leistungstarkes Abhängigkeitsmanagement. Anstatt manuell sicherzustellen, dass du alle Abhängigkeiten erhältst, wenn du ein Projekt auf einem neuen Computer einrichtest, installiert npm alles automatisch für dich. Aber wie kann npm genau wissen, was dein Projekt benötigt? Lerne den `dependencies`-Abschnitt deiner package.json Datei kennen.
In diesem Abschnitt werden die Pakete, die dein Projekt benötigt, in folgendem Format gespeichert:
@@ -22,9 +22,9 @@ In diesem Abschnitt werden die Pakete, die dein Projekt benötigt, in folgendem
# --instructions--
Add version "1.1.0" of the `@freecodecamp/example` package to the `dependencies` field of your `package.json` file.
Füge die Version "1.1.0" des `@freecodecamp/example`-Pakets dem `dependencies`-Feld deiner `package.json`-Datei hinzu.
**Note:** `@freecodecamp/example` is a faux package used as a learning tool.
**Hinweis:** `@freecodecamp/example` ist eine Mogelpackung, die wir hier als Lernbeispiel verwenden.
# --hints--

View File

@@ -1,6 +1,6 @@
---
id: 587d7fb3367417b2b2512bfb
title: 'How to Use package.json, the Core of Any Node.js Project or npm Package'
title: 'Wie man package.json, den Kern eines jeden Node.js-Projekts oder npm-Pakets, verwendet'
challengeType: 2
forumTopicId: 301528
dashedName: how-to-use-package-json-the-core-of-any-node-js-project-or-npm-package
@@ -10,9 +10,9 @@ dashedName: how-to-use-package-json-the-core-of-any-node-js-project-or-npm-packa
Bei der Bearbeitung dieser Aufgaben musst du deinen Code nach einer der folgenden Methoden schreiben:
- Clone <a href="https://github.com/freeCodeCamp/boilerplate-npm/" target="_blank" rel="noopener noreferrer nofollow">this GitHub repo</a> and complete these challenges locally.
- Use <a href="https://replit.com/github/freeCodeCamp/boilerplate-npm" target="_blank" rel="noopener noreferrer nofollow">our Replit starter project</a> to complete these challenges.
- Verwende einen Site-Builder deiner Wahl, um das Projekt fertigzustellen. Be sure to incorporate all the files from our GitHub repo.
- Klone <a href="https://github.com/freeCodeCamp/boilerplate-npm/" target="_blank" rel="noopener noreferrer nofollow">diese GitHub-Repo</a> und schließe dein Projekt lokal ab.
- Benutze <a href="https://replit.com/github/freeCodeCamp/boilerplate-npm" target="_blank" rel="noopener noreferrer nofollow">unser Replit-Starterprojekt</a>, um diese Aufgabe fertigzustellen.
- Verwende einen Site-Builder deiner Wahl, um das Projekt fertigzustellen. Achte darauf, alle Dateien aus unserer GitHub-Repo zu integrieren.
If you use Replit, follow these steps to set up the project:

View File

@@ -1,6 +1,6 @@
---
id: 587d7fb5367417b2b2512c01
title: Manage npm Dependencies By Understanding Semantic Versioning
title: Verwalte npm-Abhängigkeiten durch das Verstehen semantischer Versionierung
challengeType: 2
forumTopicId: 301529
dashedName: manage-npm-dependencies-by-understanding-semantic-versioning
@@ -8,9 +8,9 @@ dashedName: manage-npm-dependencies-by-understanding-semantic-versioning
# --description--
`Versions` of the npm packages in the dependencies section of your package.json file follow whats called Semantic Versioning (SemVer), an industry standard for software versioning aiming to make it easier to manage dependencies. Libraries, frameworks or other tools published on npm should use SemVer in order to clearly communicate what kind of changes projects can expect if they update.
`Versions` der npm-Pakete im Abschnitt "dependencies" (Abhängigkeiten) deiner package.json-Datei folgen dem sogenannten Semantic Versioning (SemVer), einem Industriestandard für Software Versioning, der die Verwaltung von Abhängigkeiten erleichtern soll. Bibliotheken, Frameworks oder andere Tools, die auf npm veröffentlicht werden, sollten SemVer verwenden, um klar zu kommunizieren, welche Art von Änderungen Projekte erwarten können, wenn sie aktualisiert werden.
Knowing SemVer can be useful when you develop software that uses external dependencies (which you almost always do). One day, your understanding of these numbers will save you from accidentally introducing breaking changes to your project without understanding why things that worked yesterday suddenly dont work today. This is how Semantic Versioning works according to the official website:
Die Kenntnis von SemVer kann nützlich sein, wenn du eine Software entwickelst, die externe Abhängigkeiten nutzt (was du fast immer tust). One day, your understanding of these numbers will save you from accidentally introducing breaking changes to your project without understanding why things that worked yesterday suddenly dont work today. This is how Semantic Versioning works according to the official website:
```json
"package": "MAJOR.MINOR.PATCH"

View File

@@ -8,21 +8,21 @@ dashedName: remove-a-package-from-your-dependencies
# --description--
You have now tested a few ways you can manage dependencies of your project by using the package.json's dependencies section. You have also included external packages by adding them to the file and even told npm what types of versions you want, by using special characters such as the tilde or the caret.
Du hast nun einige Möglichkeiten ausprobiert, wie du Abhängigkeiten deines Projekts mithilfe des Abschnitts "dependencies" in der package.json verwalten kannst. Du hast auch externe Pakete eingebunden, indem du sie der Datei zugefügt und npm sogar mitgeteilt hast, welche Arten von Versionen du haben möchtest, indem du Sonderzeichen wie die Tilde oder das Caret verwendet hast.
Aber was passiert, wenn du ein externes Paket entfernen möchtest, das du nicht länger benötigst? You might already have guessed it, just remove the corresponding key-value pair for that package from your dependencies.
This same method applies to removing other fields in your package.json as well.
Dieselbe Methode gilt auch für das Entfernen anderer Felder in deiner package.json.
# --instructions--
Remove the `@freecodecamp/example` package from your dependencies.
Entferne das `@freecodecamp/example`-Paket aus deinen "dependencies" (Abhängigkeiten).
**Note:** Make sure you have the right amount of commas after removing it.
**Hinweis:** Stelle sicher, dass du die richtige Menge an Kommas verwendest, nachdem du das Paket entfernt hast.
# --hints--
`"dependencies"` should not include `"@freecodecamp/example"`.
`"dependencies"` sollte nicht `"@freecodecamp/example"` enthalten.
```js
(getUserInput) =>

View File

@@ -1,6 +1,6 @@
---
id: 587d7fb5367417b2b2512c03
title: Use the Caret-Character to Use the Latest Minor Version of a Dependency
title: Benutze das Caret-Zeichen, um die neueste Nebenversion einer Abhängigkeit zu verwenden
challengeType: 2
forumTopicId: 301531
dashedName: use-the-caret-character-to-use-the-latest-minor-version-of-a-dependency
@@ -8,9 +8,9 @@ dashedName: use-the-caret-character-to-use-the-latest-minor-version-of-a-depende
# --description--
Similar to how the tilde we learned about in the last challenge allows npm to install the latest PATCH for a dependency, the caret (`^`) allows npm to install future updates as well. Der Unterschied ist, dass das Caret sowohl MINOR-Updates als auch PATCHes zulässt.
Ähnlich wie die Tilde, die wir in der letzten Aufgabe kennengelernt haben, erlaubt sie npm das aktuelle PATCH für eine Abhängigkeit zu installieren, so erlaubt das Caret (`^`) npm auch zukünftige Updates zu installieren. Der Unterschied ist, dass das Caret sowohl MINOR-Updates als auch PATCHes zulässt.
Your current version of `@freecodecamp/example` should be "~1.2.13" which allows npm to install to the latest 1.2.x version. If you were to use the caret (^) as a version prefix instead, npm would be allowed to update to any 1.x.x version.
Deine aktuelle Version von `@freecodecamp/example` sollte "~1.2.13" sein, welches dem npm erlaubt auf die neueste Version 1.2.x zu aktualisieren. Wenn du stattdessen das Caret (^) als Versionspräfix verwendest, darf npm auf jede Version 1.x.x aktualisieren.
```json
"package": "^1.3.8"
@@ -20,13 +20,13 @@ Dies würde Aktualisierungen auf jede Version 1.x.x des Pakets ermöglichen.
# --instructions--
Use the caret (`^`) to prefix the version of `@freecodecamp/example` in your dependencies and allow npm to update it to any new MINOR release.
Verwende das Caret (`^`), um die Version von `@freecodecamp/example` in deinen Abhängigkeiten voranzustellen und erlaube npm auf jede neue MINOR-Version zu aktualisieren.
**Hinweis:** Die Versionsnummern selbst sollten nicht geändert werden.
# --hints--
`"dependencies"` should include `"@freecodecamp/example"`.
`"dependencies"` sollten `"@freecodecamp/example"` enthalten.
```js
(getUserInput) =>
@@ -45,7 +45,7 @@ Use the caret (`^`) to prefix the version of `@freecodecamp/example` in your dep
);
```
`"@freecodecamp/example"` version should match `"^1.x.x"`.
`"@freecodecamp/example"`-Version sollte `"^1.x.x"` entsprechen.
```js
(getUserInput) =>

View File

@@ -1,6 +1,6 @@
---
id: 587d7fb5367417b2b2512c02
title: Use the Tilde-Character to Always Use the Latest Patch Version of a Dependency
title: Verwende das Tilde-Zeichen, um immer die neueste Patch-Version einer Abhängigkeit zu verwenden
challengeType: 2
forumTopicId: 301532
dashedName: use-the-tilde-character-to-always-use-the-latest-patch-version-of-a-dependency
@@ -8,9 +8,9 @@ dashedName: use-the-tilde-character-to-always-use-the-latest-patch-version-of-a-
# --description--
In the last challenge, you told npm to only include a specific version of a package. Das ist eine nützliche Methode, um Abhängigkeiten einzufrieren, wenn du sicherstellen möchtest, dass verschiedene Teile deines Projekts miteinander kompatibel bleiben. But in most use cases, you dont want to miss bug fixes since they often include important security patches and (hopefully) dont break things in doing so.
In der letzten Aufgabe hast du npm angewiesen, nur eine bestimmte Version eines Pakets einzufügen. Das ist eine nützliche Methode, um Abhängigkeiten einzufrieren, wenn du sicherstellen möchtest, dass verschiedene Teile deines Projekts miteinander kompatibel bleiben. In der Praxis solltest du jedoch keine Fehlerbehebungen übersehen, da sie oft wichtige Sicherheitspatches enthalten und somit (hoffentlich) nichts beschädigt wird.
To allow an npm dependency to update to the latest PATCH version, you can prefix the dependencys version with the tilde (`~`) character. Here's an example of how to allow updates to any 1.3.x version.
Um eine npm-Abhängigkeit auf die neueste PATCH-Version zu aktualisieren, kannst du der Abhängigkeitsversion das Tilde-Zeichen (`~`) voranstellen. Hier ein Beispiel, wie man Aktualisierungen auf jede Version der 1.3.x zulässt.
```json
"package": "~1.3.8"
@@ -18,15 +18,15 @@ To allow an npm dependency to update to the latest PATCH version, you can prefix
# --instructions--
In the package.json file, your current rule for how npm may upgrade `@freecodecamp/example` is to use a specific version (1.2.13). But now, you want to allow the latest 1.2.x version.
In the package.json file, your current rule for how npm may upgrade `@freecodecamp/example` is to use a specific version (1.2.13). Jetzt möchtest du aber die neueste Version 1.2.x zulassen.
Use the tilde (`~`) character to prefix the version of `@freecodecamp/example` in your dependencies, and allow npm to update it to any new _patch_ release.
Verwende das (`~`) Tilde-Zeichen, um die Version von `@freecodecamp/example` in deinen Abhängigkeiten voranzustellen und erlaube npm auf jede neue _patch_ Version zu aktualisieren.
**Note:** The version numbers themselves should not be changed.
**Hinweis:** Die Versionsnummern selbst sollten nicht geändert werden.
# --hints--
`"dependencies"` should include `"@freecodecamp/example"`.
`"dependencies"` sollte `"@freecodecamp/example"` enthalten.
```js
(getUserInput) =>
@@ -45,7 +45,7 @@ Use the tilde (`~`) character to prefix the version of `@freecodecamp/example` i
);
```
`"@freecodecamp/example"` version should match `"~1.2.13"`.
`"@freecodecamp/example"` Version sollte `"~1.2.13"` entsprechen.
```js
(getUserInput) =>

View File

@@ -35,7 +35,7 @@ Dovresti dare al pulsante di invio un `type` del valore di `submit`.
assert.exists(document.querySelector('button[type="submit"]') || document.querySelector('form > input[type="submit"]'));
```
The submit should display the text `Send`.
Il pulsante di invio dovrebbe avere il testo `Send`.
```js
assert.equal(document.querySelector('button[type="submit"]')?.textContent ?? document.querySelector('input[type="submit"]')?.value, 'Send');

View File

@@ -7,7 +7,7 @@ dashedName: step-20
# --description--
Attualmente, gli edifici sono accatastati l'uno sopra l'altro. Align the buildings by turning the `.background-buildings` element into a flexbox parent. Usa le proprietà `align-items` e `justify-content` per spaziare equamente gli edifici nella parte inferiore dell'elemento.
Attualmente, gli edifici sono accatastati l'uno sopra l'altro. Allinea gli edifici trasformando l'elemento `.background-buildings` in un genitore flexbox. Usa le proprietà `align-items` e `justify-content` per spaziare equamente gli edifici nella parte inferiore dell'elemento.
# --hints--

View File

@@ -7,7 +7,7 @@ dashedName: step-7
# --description--
Use an id selector to give the element with the id `back-wall` a `background-color` of `#8B4513`.
Usa un selettore id per assegnare all'elemento con l'id `back-wall` una proprietà `background-color` di `#8B4513`.
# --hints--

View File

@@ -7,7 +7,7 @@ dashedName: step-8
# --description--
Give the `#back-wall` element a `width` of `100%` and a `height` of `60%`.
Assegna all'elemento `#back-wall` una proprietà `width` del `100%` e una proprietà `height` del `60%`.
# --hints--

View File

@@ -9,9 +9,9 @@ dashedName: step-9
Tipicamente, l'HTML è renderizzato in modo top-down. Gli elementi in cima al codice sono posizionati nella parte superiore della pagina. Tuttavia, spesso è possibile che tu voglia spostare gli elementi in posizioni diverse. Puoi farlo grazie alla proprietà `position`.
Set the `position` property for the `#back-wall` element to `absolute`. Il valore `absolute` toglie l'elemento dal flusso top-down del documento e ti permette di spostarlo relativamente al suo contenitore.
Imposta la proprietà `position` per l'elemento `#back-wall` sul valore `absolute`. Il valore `absolute` toglie l'elemento dal flusso top-down del documento e ti permette di spostarlo relativamente al suo contenitore.
Puoi spostare manualmente il layout di un elemento con `top`, `left`, `right` e `bottom`. Set the `#back-wall` element to have a `top` value of `0`, and a `left` value of `0`.
Puoi spostare manualmente il layout di un elemento con `top`, `left`, `right` e `bottom`. Assegna all'elemento `#back-wall` una proprietà `top` di `0` e una proprietà `left` di `0`.
# --hints--

View File

@@ -7,7 +7,7 @@ dashedName: step-11
# --description--
Below your `#back-wall` element, create a `div` with a `class` of `characters`. Qui creerai le figure del tuo dipinto.
Sotto l'elemento `#back-wall`, crea un `div` con un attributo `class` del valore di `characters`. Qui creerai le figure del tuo dipinto.
# --hints--

View File

@@ -7,7 +7,7 @@ dashedName: step-12
# --description--
Inside that `.characters` element, create another `div` with an `id` of `offwhite-character`.
All'interno dell'elemento `.characters`, crea un altro `div` con un `id` del valore di `offwhite-character`.
# --hints--

View File

@@ -7,7 +7,7 @@ dashedName: step-14
# --description--
Questa figura ha bisogno di occhi. Create two `div` elements in the `#black-mask` element. Assegna loro le classi `eyes left` e `eyes right`, in quest'ordine.
Questa figura ha bisogno di occhi. Crea due elementi `div` nell'elemento `#black-mask`. Assegna loro le classi `eyes left` e `eyes right`, in quest'ordine.
# --hints--

View File

@@ -7,7 +7,7 @@ dashedName: step-15
# --description--
Crea alcuni "pallini" per lo strumento. Add five `div` elements within your `#gray-instrument` element. Imposta l'attributo `class` di ciascuno su `black-dot`.
Crea alcuni "pallini" per lo strumento. Aggiungi cinque elementi `div` all'interno dell'elemento `#gray-instrument`. Imposta l'attributo `class` di ciascuno su `black-dot`.
# --hints--

View File

@@ -7,7 +7,7 @@ dashedName: step-16
# --description--
Using an id selector, create a rule for the element with the id `offwhite-character`. Dagli una proprietà `width` di `300px`, una proprietà `height` di `550px` e un `background-color` del valore di `GhostWhite`.
Usando un selettore di id, crea una regola per l'elemento con l'id `offwhite-character`. Dagli una proprietà `width` di `300px`, una proprietà `height` di `550px` e un `background-color` del valore di `GhostWhite`.
# --hints--

View File

@@ -7,7 +7,7 @@ dashedName: step-17
# --description--
Move the `#offwhite-character` into place by giving it a `position` of `absolute`, a `top` value of `20%`, and a `left` value of `17.5%`.
Sposta l'elemento `#offwhite-character` in posizione dandogli una `position` con il valore `absolute` una proprietà `top` del `20%` e una proprietà `left` del `17.5%`.
# --hints--

View File

@@ -7,7 +7,7 @@ dashedName: step-18
# --description--
Using an id selector, style the element with the id `white-hat`. Assegnagli delle proprietà `width` e `height` con il valore `0` e una proprietà `border-style` del valore di `solid`.
Usando un selettore di id, definisci lo stile dell'elemento con l'id `white-hat`. Assegnagli delle proprietà `width` e `height` con il valore `0` e una proprietà `border-style` del valore di `solid`.
# --hints--

View File

@@ -7,7 +7,7 @@ dashedName: step-22
# --description--
Using an id selector, create a rule for the element with the id `black-mask`. Dagli una proprietà `width` del `100%`, una proprietà `height` di `50px` e un `background-color` con il valore `rgb(45, 31, 19)`.
Usando un selettore di id, crea una regola per l'elemento con l'id `black-mask`. Dagli una proprietà `width` del `100%`, una proprietà `height` di `50px` e un `background-color` con il valore `rgb(45, 31, 19)`.
# --hints--

View File

@@ -7,7 +7,7 @@ dashedName: step-25
# --description--
Using an id selector, give the element with the id `gray-instrument` a `width` of `15%`, a `height` of `40%`, and a `background-color` of `rgb(167, 162, 117)`.
Usando un selettore di id, assegna all'elemento con l'id `gray-instrument` una proprietà `width` del `15%`, una proprietà `height` del `40%` e un `background-color` con il valore `rgb(167, 162, 117)`.
# --hints--

View File

@@ -7,7 +7,7 @@ dashedName: step-28
# --description--
Use a class selector to create a rule for the elements with `black-dot` class. Imposta `width` a `10px`, `height` a `10px` e `background-color` su `rgb(45, 31, 19)`.
Usa un selettore di classe per creare una regola per gli elementi di classe `black-dot`. Imposta `width` a `10px`, `height` a `10px` e `background-color` su `rgb(45, 31, 19)`.
# --hints--

View File

@@ -7,7 +7,7 @@ dashedName: step-31
# --description--
Use an id selector to style the element with the id `tan-table`. Dagli una proprietà `width` di`450px`, una proprietà `height` di `140px` e una proprietà `background-color` con il valore `#D2691E`.
Usa un selettore di id per definire lo stile dell'elemento con l'id `tan-table`. Dagli una proprietà `width` di`450px`, una proprietà `height` di `140px` e una proprietà `background-color` con il valore `#D2691E`.
# --hints--

View File

@@ -7,7 +7,7 @@ dashedName: step-35
# --description--
Within your new `#black-character` element, add three `div` elements with the following `id` values, in order: `black-hat`, `gray-mask`, `white-paper`.
All'interno del nuovo elemento `#black-character`, aggiungi tre elementi `div` con i seguenti valori `id`, in ordine: `black-hat`, `gray-mask`, `white-paper`.
# --hints--

View File

@@ -7,7 +7,7 @@ dashedName: step-36
# --description--
La maschera ha bisogno di occhi. Within your `#gray-mask` element, add two `div` elements. Il primo dovrebbe avere l'attributo `class` impostato su `eyes left` e il secondo dovrebbe avere l'attributo `class` impostato su `eyes right`.
La maschera ha bisogno di occhi. All'interno dell'elemento `#gray-mask`, aggiungi due elementi `div`. Il primo dovrebbe avere l'attributo `class` impostato su `eyes left` e il secondo dovrebbe avere l'attributo `class` impostato su `eyes right`.
# --hints--

View File

@@ -11,7 +11,7 @@ dashedName: step-37
L'elemento `i` è usato per il testo idiomatico o il testo che è separato dal "normale" contenuto di testo. Può essere usato per il testo in _corsivo_, per i termini scientifici o per icone, come quelle fornite da FontAwesome.
Within your `#white-paper` element, add four `i` elements. Assegna loro un valore di `class` di `fas fa-music`.
All'interno dell'elemento `#white-paper`, aggiungi quattro elementi `i`. Assegna loro un valore di `class` di `fas fa-music`.
Questa classe speciale viene usata da FontAwesome per determinare quale icona caricare. `fas` indica la categoria delle icone (FontAwesome Solid, in questo caso), mentre `fa-music` seleziona l'icona specifica.

View File

@@ -7,7 +7,7 @@ dashedName: step-38
# --description--
Use an id selector to create a rule for the element with the id `black-character`. Imposta `width` a `300px`, `height` a `500px` e `background-color` su `rgb(45, 31, 19)`.
Usa un selettore di id per creare una regola per l'elemento con l'id `black-character`. Imposta `width` a `300px`, `height` a `500px` e `background-color` su `rgb(45, 31, 19)`.
# --hints--

View File

@@ -7,7 +7,7 @@ dashedName: step-39
# --description--
Move the `#black-character` element into place by setting the `position` to `absolute`, the `top` to `30%`, and the `left` to `59%`.
Sposta l'elemento `#black-character` impostando `position` su `absolute`, `top` al `30%` e `left` al `59%`.
# --hints--

View File

@@ -7,7 +7,7 @@ dashedName: step-40
# --description--
Use an id selector to create a rule for the element with the id `black-hat`. Imposta `width` a `0`, `height` a `0` e `border-style` su `solid`.
Usa un selettore di id per creare una regola per l'elemento con l'id `black-hat`. Imposta `width` a `0`, `height` a `0` e `border-style` su `solid`.
# --hints--

View File

@@ -7,7 +7,7 @@ dashedName: step-42
# --description--
Just like with your `#white-hat`, you should style the border for the `#black-hat` element. Imposta `border-top-color`, `border-right-color` e `border-bottom-color` su`transparent`. Imposta `border-left-color` su `rgb(45, 31, 19)`.
Proprio come con l'elemento `#white-hat`, dovresti definire lo stile del bordo per l'elemento `#black-hat`. Imposta `border-top-color`, `border-right-color` e `border-bottom-color` su`transparent`. Imposta `border-left-color` su `rgb(45, 31, 19)`.
# --hints--

View File

@@ -7,7 +7,7 @@ dashedName: step-43
# --description--
Now position the `#black-hat` element. Imposta `position` su `absolute`, `top` a `-150px` e `left` a `0`.
Ora posiziona l'elemento `#black-hat`. Imposta `position` su `absolute`, `top` a `-150px` e `left` a `0`.
# --hints--

View File

@@ -7,7 +7,7 @@ dashedName: step-44
# --description--
Using an id selector, style the element with the id `gray-mask`. Imposta `width` a `150px`, `height` a `150px` e `background-color` a `rgb(167, 162, 117)`.
Usando un selettore di id, definisci lo stile dell'elemento con l'id `gray-mask`. Imposta `width` a `150px`, `height` a `150px` e `background-color` a `rgb(167, 162, 117)`.
# --hints--

View File

@@ -7,7 +7,7 @@ dashedName: step-45
# --description--
Position the `#gray-mask` element by setting `position` to `absolute`, the `top` to `-10px`, and the `left` to `70px`.
Posiziona l'elemento `#gray-mask` impostando `position` su `absolute`, `top` a `-10px` e `left` a `70px`.
# --hints--

View File

@@ -7,7 +7,7 @@ dashedName: step-46
# --description--
Using an id selector, create a rule for the id `white-paper`. Imposta `width` a `400px`, `height` a `100px` e `background-color` su `GhostWhite`.
Usando un selettore di id, crea una regola per l'id `white-paper`. Imposta `width` a `400px`, `height` a `100px` e `background-color` su `GhostWhite`.
# --hints--

View File

@@ -7,7 +7,7 @@ dashedName: step-47
# --description--
Give the `#white-paper` a `position` of `absolute`, a `top` of `250px`, and a `left` of `-150px` to move it into place.
Posiziona `#white-paper` impostando `position` su `absolute`, `top` a `250px` e `left` a `-150px`.
# --hints--

View File

@@ -7,7 +7,7 @@ dashedName: step-48
# --description--
Set the `z-index` of the `#white-paper` element to `1`.
Imposta la proprietà `z-index` dell'elemento `#white-paper` a `1`.
# --hints--

View File

@@ -7,7 +7,7 @@ dashedName: step-49
# --description--
Le icone FontAwesome posseggono già il loro stile. Tuttavia, anche tu puoi agire sul loro stile cambiando cose come il colore e le dimensioni. For now, use a class selector to target the icons with the class `fa-music`. Imposta `display` su `inline-block`, `margin-top` all'`8%` e `margin-left` al `13%`.
Le icone FontAwesome posseggono già il loro stile. Tuttavia, anche tu puoi agire sul loro stile cambiando cose come il colore e le dimensioni. Per ora, usa un selettore di classe per selezionare le icone con la classe `fa-music`. Imposta `display` su `inline-block`, `margin-top` all'`8%` e `margin-left` al `13%`.
# --hints--

View File

@@ -7,7 +7,7 @@ dashedName: step-50
# --description--
Below your `#black-character` element, add two new `div` elements. Saranno lo scialle. Assegna a entrambi un attributo `class` con il valore `blue`. Quindi dai al primo un `id` di `blue-left`, e al secondo un `id` di `blue-right`.
Sotto l'elemento `#black-character`, aggiungi due nuovi elementi `div`. Saranno lo scialle. Assegna a entrambi un attributo `class` con il valore `blue`. Quindi dai al primo un `id` di `blue-left`, e al secondo un `id` di `blue-right`.
# --hints--

View File

@@ -7,7 +7,7 @@ dashedName: step-51
# --description--
Use a class selector to target the new elements with the class `blue`. Imposta il `background-color` su `#1E90FF`.
Usa un selettore di classe per selezionare i nuovi elementi con la classe `blue`. Imposta il `background-color` su `#1E90FF`.
# --hints--

View File

@@ -7,7 +7,7 @@ dashedName: step-52
# --description--
Select the element with the id `blue-left` using an id selector. Imposta `width` a `500px` e `height` a `300px`.
Seleziona l'elemento con l'id `blue-left` usando un selettore di id. Imposta `width` a `500px` e `height` a `300px`.
# --hints--

View File

@@ -7,7 +7,7 @@ dashedName: step-54
# --description--
Next, target the element with the id `blue-right` using an id selector. Imposta `width` a `400px` e `height` a `300px`.
Poi seleziona l'elemento con l'id `blue-right` usando un selettore di id. Imposta `width` a `400px` e `height` a `300px`.
# --hints--

View File

@@ -7,7 +7,7 @@ dashedName: step-55
# --description--
Give the `#blue-right` element the correct positioning with `position` set to `absolute`, `top` set to `50%`, and `left` set to `40%`.
Posiziona correttamente l'elemento `#blue-right` impostando `position` su `absolute`, `top` al `50%` e `left` al `40%`.
# --hints--

View File

@@ -7,11 +7,11 @@ dashedName: step-56
# --description--
Below your `.blue` elements, add another `div`. Dagli un `id` con il valore `orange-character`.
Sotto gli elementi `.blue`, aggiungi un altro `div`. Dagli un `id` con il valore `orange-character`.
# --hints--
You should have a new `div` element within your `.characters` element.
Dovresti avere un nuovo elemento `div` all'interno del l'elemento `.characters`.
```js
assert(document.querySelectorAll('.characters > div')?.length === 5);

View File

@@ -7,11 +7,11 @@ dashedName: step-57
# --description--
Within that `#orange-character` element, add four `div` elements. Dai loro i valori `id` di `black-round-hat`, `eyes-div`, `triangles` e `guitar` (in ordine).
All'interno dell'elemento `#orange-character`, aggiungi quattro elementi `div`. Dai loro i valori `id` di `black-round-hat`, `eyes-div`, `triangles` e `guitar` (in ordine).
# --hints--
You should have four new `div` elements within your `#orange-character` element.
Dovresti avere quattro nuovi elementi `div` all'interno dell'elemento `#orange-character`.
```js
assert(document.querySelectorAll('#orange-character > div')?.length === 4);

View File

@@ -7,11 +7,11 @@ dashedName: step-58
# --description--
The `#eyes-div` element should hold some eyes. Aggiungi due elementi `div` al suo interno. Dai al primo un valore `class` di `eyes left`, e al secondo un valore `class` di `eyes right`.
L'elemento `#eyes-div` dovrebbe contenere degli occhi. Aggiungi due elementi `div` al suo interno. Dai al primo un valore `class` di `eyes left`, e al secondo un valore `class` di `eyes right`.
# --hints--
You should have two `div` elements nested in your `#eyes-div` element.
Dovresti avere due elementi `div` annidati nell'elemento `#eyes-div`.
```js
assert(document.querySelectorAll('#eyes-div > div')?.length === 2);

View File

@@ -7,11 +7,11 @@ dashedName: step-59
# --description--
Within the `#triangles` div, you will need to add the elements that will become your triangles. Crea trenta elementi `div` e dai a ciascuno di loro la classe `triangle`.
All'interno del div `#triangles`, dovrai aggiungere gli elementi che diventeranno i tuoi triangoli. Crea trenta elementi `div` e dai a ciascuno di loro la classe `triangle`.
# --hints--
You should have 30 `div` elements within your `#triangles` element.
Dovresti avere 30 elementi `div` all'interno dell'elemento `#triangles`.
```js
assert(document.querySelectorAll('#triangles > div')?.length === 30);

View File

@@ -7,13 +7,13 @@ dashedName: step-60
# --description--
Within the `#guitar` element, create three `div` elements. Dai ai primi due una proprietà `class` con valore di `guitar`. Poi dai al primo un attributo `id` con valore di `guitar-left` e al secondo un `id` con valore di `guitar-right`. Aggiungi un `id` al terzo `div` con un valore di `guitar-neck`.
All'interno dell'elemento `#guitar`, crea tre elementi `div`. Dai ai primi due una proprietà `class` con valore di `guitar`. Poi dai al primo un attributo `id` con valore di `guitar-left` e al secondo un `id` con valore di `guitar-right`. Aggiungi un `id` al terzo `div` con un valore di `guitar-neck`.
Il terzo `div` non dovrebbe avere la classe `guitar`.
# --hints--
You should have three new `div` elements within your `#guitar` element.
Dovresti avere tre nuovi elementi `div` dentro l'elemento `#guitar`.
```js
assert(document.querySelectorAll('#guitar > div')?.length === 3);

View File

@@ -7,17 +7,17 @@ dashedName: step-61
# --description--
Use another FontAwesome icon for your `.guitar`. Inside both the `#guitar-left` and `#guitar-right` elements, add an `i` element and give it a `class` of `fas fa-bars`.
Usa un'altra icona FontAwesome per l'elemento `.guitar`. All'interno degli elementi `#guitar-left` e `#guitar-right`, aggiungi un elemento `i` e assegnagli un attributo `class` con il valore `fas fa-bars`.
# --hints--
Within your `#guitar-left` element, you should add an `i` element.
All'interno dell'elemento `#guitar-left`, dovresti aggiungere un elemento `i`.
```js
assert(document.querySelectorAll('#guitar-left > i')?.length === 1);
```
Within your `#guitar-right` element, you should add an `i` element.
All'interno dell'elemento `#guitar-right`, dovresti aggiungere un elemento `i`.
```js
assert(document.querySelectorAll('#guitar-right > i')?.length === 1);

View File

@@ -7,7 +7,7 @@ dashedName: step-62
# --description--
Select your `orange-character` element with an id selector. Imposta `width` a `250px`, `height` a `550px` e `background-color` su `rgb(240, 78, 42)`.
Seleziona l'elemento `orange-character` con un selettore di id. Imposta `width` a `250px`, `height` a `550px` e `background-color` su `rgb(240, 78, 42)`.
# --hints--

View File

@@ -7,7 +7,7 @@ dashedName: step-63
# --description--
Give the `#orange-character` element a `position` of `absolute`, a `top` of `25%`, and a `left` of `40%`.
Per l'elemento `#orange-character`, imposta `position` su `absolute`, `top` al `25%` e `left` al `40%`.
# --hints--

View File

@@ -7,7 +7,7 @@ dashedName: step-64
# --description--
Style the element with the id `black-round-hat` using an id selector. Imposta `width` a `180px`, `height` a `150px` e `background-color` su `rgb(45, 31, 19)`.
Definisci lo stile dell'elemento con l'id `black-round-hat` usando un selettore di id. Imposta `width` a `180px`, `height` a `150px` e `background-color` su `rgb(45, 31, 19)`.
# --hints--

View File

@@ -7,7 +7,7 @@ dashedName: step-65
# --description--
The `#black-round-hat` element should probably be round. Dagli una proprietà `border-radius` del `50%` per arrotondarlo.
L'elemento `#black-round-hat` dovrebbe essere rotondo. Dagli una proprietà `border-radius` del `50%` per arrotondarlo.
# --hints--

View File

@@ -7,7 +7,7 @@ dashedName: step-66
# --description--
Move the `#black-round-hat` element into place with a `position` of `absolute`, a `top` of `-100px`, and a `left` of `5px`.
Posiziona l'elemento `#black-round-hat` impostando `position` su `absolute`, `top` a `-100px` e `left` a `5px`.
# --hints--

View File

@@ -7,7 +7,7 @@ dashedName: step-67
# --description--
Put the `#black-round-hat` element on the correct layer with a `z-index` of `-1`.
Posiziona sul livello corretto l'elemento `#black-round-hat` impostando `z-index` a `-1`.
# --hints--

View File

@@ -7,7 +7,7 @@ dashedName: step-68
# --description--
Use an id selector to create a rule for the element with the id `eyes-div`. Imposta `width` a `180px` e `height` a `50px`.
Usa un selettore di id per creare una regola per l'elemento con l'id `eyes-div`. Imposta `width` a `180px` e `height` a `50px`.
# --hints--

View File

@@ -7,7 +7,7 @@ dashedName: step-69
# --description--
Now move the `#eyes-div` element into position with `position` set to `absolute`, `top` set to `-40px`, and `left` set to `20px`.
Adesso posiziona l'elemento `#eyes-div`impostando `position` su `absolute`, `top` a `-40px` e `left` a `20px`.
# --hints--

View File

@@ -7,7 +7,7 @@ dashedName: step-70
# --description--
Give the `#eyes-div` element a `z-index` of `3`.
Assegna all'elemento `#eyes-div` una proprietà `z-index` di `3`.
# --hints--

View File

@@ -7,7 +7,7 @@ dashedName: step-79
# --description--
Now use a class selector to target `guitar`. In questo modo, agirai sullo stile delle due "metà" della chitarra. Imposta `width` a `150px`, `height` a `120px`, `background-color` su `Goldenrod` e `border-radius` al `50%`.
Ora usa un selettore di classe per selezionare `guitar`. In questo modo, agirai sullo stile delle due "metà" della chitarra. Imposta `width` a `150px`, `height` a `120px`, `background-color` su `Goldenrod` e `border-radius` al `50%`.
# --hints--

View File

@@ -7,7 +7,7 @@ dashedName: step-82
# --description--
Ora hai bisogno di sistemare le icone delle barre. Create a class selector for the `fa-bars` class. Imposta `display` su `block`, `margin-top` al `30%` e `margin-left` al `40%`.
Ora hai bisogno di sistemare le icone delle barre. Crea un selettore di classe per la classe `fa-bars`. Imposta `display` su `block`, `margin-top` al `30%` e `margin-left` al `40%`.
# --hints--

View File

@@ -7,7 +7,7 @@ dashedName: step-83
# --description--
Use an id selector to create a rule for the id `guitar-neck`. Imposta `width` a `200px`, `height` a `30px` e `background-color` su `#D2691E`.
Usa un selettore id per creare una regola per l'id `guitar-neck`. Imposta `width` a `200px`, `height` a `30px` e `background-color` su `#D2691E`.
# --hints--

View File

@@ -7,7 +7,7 @@ dashedName: step-84
# --description--
Now move the `#guitar-neck` element with a `position` of `absolute`, a `top` value of `45px`, and a `left` value of `200px`.
Ora sposta l'elemento `#guitar-neck` impostando `position` su `absolute`, `top` a `45px` e `left` a `200px`.
# --hints--

View File

@@ -7,7 +7,7 @@ dashedName: step-85
# --description--
Give the `#guitar-neck` element a `z-index` of `3`.
Dai all'elemento `#guitar-neck` una proprietà `z-index` di `3`.
# --hints--

View File

@@ -7,7 +7,7 @@ dashedName: step-86
# --description--
Time to style the elements with the `eyes` class. Use a class selector to set the `width` to `35px`, the `height` to `20px`, the `background-color` to `#8B4513`, and the `border-radius` to `20px 50%`.
È tempo di definire lo stile degli elementi con la classe `eyes`. Usa un selettore di classe per impostare `width` a `35px`, `height` a `20px`, `background-color` su `#8B4513` e `border-radius` su `20px 50%`.
# --hints--

View File

@@ -7,7 +7,7 @@ dashedName: step-89
# --description--
Ecco l'ultimo step. Le icone FontAwesome sono un po' troppo piccole. Target all of them with a class selector for `fas`, and set the `font-size` to `30px`.
Ecco l'ultimo step. Le icone FontAwesome sono un po' troppo piccole. Selezionale tutte con un selettore di classe per `fas`, e imposta la proprietà `font-size` a `30px`.
E con questo, il tuo Picasso è completo!

View File

@@ -7,7 +7,7 @@ dashedName: step-75
# --description--
Adjust the layout of the `.triangle` elements with a `display` of `inline-block`.
Regola il layout degli elementi `.triangle` con una proprietà `display` impostata su `inline-block`.
# --hints--

View File

@@ -7,7 +7,7 @@ dashedName: step-74
# --description--
Give your `.triangle` elements the correct color. Imposta `border-top-color`, `border-bottom-color` e `border-left-color` su `transparent`. Imposta `border-right-color` su `Gold`.
Assegna agli elementi `.triangle` il colore corretto. Imposta `border-top-color`, `border-bottom-color` e `border-left-color` su `transparent`. Imposta `border-right-color` su `Gold`.
# --hints--

View File

@@ -7,7 +7,7 @@ dashedName: step-73
# --description--
Style the border of your `.triangle` elements. Imposta `border-style` su `solid` e `border-width` su `42px 45px 45px 0`.
Cambia lo stile del bordo degli elementi `.triangle`. Imposta `border-style` su `solid` e `border-width` su `42px 45px 45px 0`.
# --hints--

View File

@@ -7,7 +7,7 @@ dashedName: step-72
# --description--
Create a class selector for the elements with the `triangle` class. Imposta `width` a `0` e `height` a `0`.
Crea un selettore di classe per gli elementi con la classe `triangle`. Imposta `width` a `0` e `height` a `0`.
# --hints--

View File

@@ -7,7 +7,7 @@ dashedName: step-71
# --description--
Target the element with the id `triangles` using an id selector. Imposta `width` a `250px` e `height` a `550px`.
Seleziona l'elemento con l'id `triangles` usando un selettore di id. Imposta `width` a `250px` e `height` a `550px`.
# --hints--

View File

@@ -7,7 +7,7 @@ dashedName: step-76
# --description--
Now use an id selector for `guitar`. Imposta `width` al `100%` e `height` su `100px`.
Ora usa un selettore di id per `guitar`. Imposta `width` al `100%` e `height` su `100px`.
# --hints--

View File

@@ -7,7 +7,7 @@ dashedName: step-41
# --description--
Set the `border-width` of the `#black-hat` to `150px 0 0 300px`.
Imposta la proprietà `border-width` di `#black-hat` a `150px 0 0 300px`.
# --hints--

View File

@@ -7,7 +7,7 @@ dashedName: step-56
# --description--
La differenza principale tra `tr[class="total"]` e `tr.total` è che il primo seleziona gli elementi `tr` in cui l'attributo class ha *solo* il valore `total`. The second will select `tr` elements where the class *includes* `total`.
La differenza principale tra `tr[class="total"]` e `tr.total` è che il primo seleziona gli elementi `tr` in cui l'attributo class ha *solo* il valore `total`. Il secondo selezionerà gli elementi `tr` in cui il valore dell'attributo class *include* `total`.
Nel tuo caso, `tr.total` funzionerà. È possibile utilizzare questo selettore per selezionare tutti gli elementi `td` all'interno delle righe `.total`. Allinea il testo a destra e assegna loro un padding di `0 0.25rem`.

View File

@@ -7,7 +7,7 @@ isPrivate: true
tests:
-
id: 587d8249367417b2b2512c41
title: Конвертер метрично-британських величин
title: Метрично-імперський конвертер
-
id: 587d8249367417b2b2512c42
title: Система відстеження помилок
@@ -19,5 +19,5 @@ tests:
title: Програма для розв'язування судоку
-
id: 5e601c0d5ac9d0ecd8b94afe
title: Перекладач американської та британської англійської
title: Перекладач з американської на британську

View File

@@ -1,6 +1,6 @@
---
id: 5e601c0d5ac9d0ecd8b94afe
title: Перекладач американської та британської англійської мови
title: Перекладач з американської на британську
challengeType: 4
forumTopicId: 462358
dashedName: american-british-translator
@@ -24,48 +24,48 @@ dashedName: american-british-translator
# --instructions--
- All logic can go into `/components/translator.js`
- Complete the `/api/translate` route in `/routes/api.js`
- Create all of the unit/functional tests in `tests/1_unit-tests.js` and `tests/2_functional-tests.js`
- See the JavaScript files in `/components` for the different spelling and terms your application should translate
- To run the tests on Replit, set `NODE_ENV` to `test` without quotes in the `.env` file
- To run the tests in the console, use the command `npm run test`. To open the Replit console, press Ctrl+Shift+P (Cmd if on a Mac) and type "open shell"
- Уся логіка може перейти до `/components/translator.js`
- Завершіть маршрут `/api/translate` в `/routes/api.js`
- Створіть усі модульні/функціональні тести у `tests/1_unit-tests.js` та `tests/2_functional-tests.js`
- Перегляньте файли JavaScript у `/components` для правопису та термінів, які повинен перекласти ваш додаток
- Щоб запустити тести на Replit, встановіть `NODE_ENV` на `test` без лапок у файлі `.env`
- Щоб запустити тести на консолі, використайте команду `npm run test`. Щоб відкрити консоль Replit, натисніть Ctrl+Shift+P (Cmd на Mac) та введіть «open shell»
Напишіть наступні тести в `tests/1_unit-tests.js`:
- Translate `Mangoes are my favorite fruit.` to British English
- Translate `I ate yogurt for breakfast.` to British English
- Translate `We had a party at my friend's condo.` to British English
- Translate `Can you toss this in the trashcan for me?` to British English
- Translate `The parking lot was full.` to British English
- Translate `Like a high tech Rube Goldberg machine.` to British English
- Translate `To play hooky means to skip class or work.` to British English
- Translate `No Mr. Bond, I expect you to die.` to British English
- Translate `Dr. Grosh will see you now.` to British English
- Translate `Lunch is at 12:15 today.` to British English
- Translate `We watched the footie match for a while.` to American English
- Translate `Paracetamol takes up to an hour to work.` to American English
- Translate `First, caramelise the onions.` to American English
- Translate `I spent the bank holiday at the funfair.` to American English
- Translate `I had a bicky then went to the chippy.` to American English
- Translate `I've just got bits and bobs in my bum bag.` to American English
- Translate `The car boot sale at Boxted Airfield was called off.` to American English
- Translate `Have you met Mrs Kalyani?` to American English
- Translate `Prof Joyner of King's College, London.` to American English
- Translate `Tea time is usually around 4 or 4.30.` to American English
- Highlight translation in `Mangoes are my favorite fruit.`
- Highlight translation in `I ate yogurt for breakfast.`
- Highlight translation in `We watched the footie match for a while.`
- Highlight translation in `Paracetamol takes up to an hour to work.`
- Перекладіть `Mangoes are my favorite fruit.` на британську англійську
- Перекладіть `I ate yogurt for breakfast.` на британську англійську
- Перекладіть `We had a party at my friend's condo.` на британську англійську
- Перекладіть `Can you toss this in the trashcan for me?` на британську англійську
- Перекладіть `The parking lot was full.` на британську англійську
- Перекладіть `Like a high tech Rube Goldberg machine.` на британську англійську
- Перекладіть `To play hooky means to skip class or work.` на британську англійську
- Перекладіть `No Mr. Bond, I expect you to die.` на британську англійську
- Перекладіть `Dr. Grosh will see you now.` на британську англійську
- Перекладіть `Lunch is at 12:15 today.` на британську англійську
- Перекладіть `We watched the footie match for a while.` на американську англійську
- Перекладіть `Paracetamol takes up to an hour to work.` на американську англійську
- Перекладіть `First, caramelise the onions.` на американську англійську
- Перекладіть `I spent the bank holiday at the funfair.` на американську англійську
- Перекладіть `I had a bicky then went to the chippy.` на американську англійську
- Перекладіть `I've just got bits and bobs in my bum bag.` на американську англійську
- Перекладіть `The car boot sale at Boxted Airfield was called off.` на американську англійську
- Перекладіть `Have you met Mrs Kalyani?` на американську англійську
- Перекладіть `Prof Joyner of King's College, London.` на американську англійську
- Перекладіть `Tea time is usually around 4 or 4.30.` на американську англійську
- Виділіть переклад у `Mangoes are my favorite fruit.`
- Виділіть переклад у `I ate yogurt for breakfast.`
- Виділіть переклад у `We watched the footie match for a while.`
- Виділіть переклад у `Paracetamol takes up to an hour to work.`
Напишіть наступні тести в `tests/2_functional-tests.js`:
- Translation with text and locale fields: POST request to `/api/translate`
- Translation with text and invalid locale field: POST request to `/api/translate`
- Translation with missing text field: POST request to `/api/translate`
- Translation with missing locale field: POST request to `/api/translate`
- Translation with empty text: POST request to `/api/translate`
- Translation with text that needs no translation: POST request to `/api/translate`
- Переклад із полями тексту та локалі: запит POST до `/api/translate`
- Переклад із полями тексту та недійсної локалі: запит POST до `/api/translate`
- Переклад із відсутнім полем тексту: запит POST до `/api/translate`
- Переклад із відсутнім полем локалі: запит POST до `/api/translate`
- Переклад із порожнім текстом: запит POST до `/api/translate`
- Переклад із текстом, якому не потрібен переклад: запит POST до `/api/translate`
# --hints--
@@ -81,7 +81,7 @@ dashedName: american-british-translator
};
```
You can `POST` to `/api/translate` with a body containing `text` with the text to translate and `locale` with either `american-to-british` or `british-to-american`. The returned object should contain the submitted `text` and `translation` with the translated text.
Ви можете надіслати запит `POST` до `/api/translate` із тілом, що містить `text` з текстом для перекладу та `locale` з `american-to-british` або `british-to-american`. Повернений об'єкт міститиме наданий `text` та `translation` з перекладеним текстом.
```js
async (getUserInput) => {
@@ -109,7 +109,7 @@ async (getUserInput) => {
};
```
The `/api/translate` route should handle the way time is written in American and British English. For example, ten thirty is written as "10.30" in British English and "10:30" in American English. The `span` element should wrap the entire time string, i.e. `<span class="highlight">10:30</span>`.
Маршрут `/api/translate` повинен обробляти те, як написаний час американською та британською англійською. Наприклад, пів на десяту пишеться «10.30» британською та «10:30» американською. Елемент `span` повинен повністю обгорнути рядок часу, тобто `<span class="highlight">10:30</span>`.
```js
async (getUserInput) => {
@@ -136,7 +136,7 @@ async (getUserInput) => {
};
```
The `/api/translate` route should also handle the way titles/honorifics are abbreviated in American and British English. For example, Doctor Wright is abbreviated as "Dr Wright" in British English and "Dr. Wright" in American English. See `/components/american-to-british-titles.js` for the different titles your application should handle.
Маршрут `/api/translate` також повинен обробляти скорочення титулів та гоноративів американською та британською. Наприклад, Доктор Райт пишеться «Dr Wright» британською та «Dr. Wright» американською. Перегляньте `/components/american-to-british-titles.js` для різних титулів, які повинен обробляти ваш додаток.
```js
async (getUserInput) => {
@@ -163,7 +163,7 @@ async (getUserInput) => {
};
```
Wrap any translated spelling or terms with `<span class="highlight">...</span>` tags so they appear in green.
Обгорніть будь-які перекладені правописи чи терміни тегами `<span class="highlight">...</span>`, щоб вони були зеленими.
```js
async (getUserInput) => {
@@ -191,7 +191,7 @@ async (getUserInput) => {
};
```
If one or more of the required fields is missing, return `{ error: 'Required field(s) missing' }`.
Якщо одне чи більше необхідних полів відсутні, поверніть `{ error: 'Required field(s) missing' }`.
```js
async (getUserInput) => {
@@ -212,7 +212,7 @@ async (getUserInput) => {
};
```
If `text` is empty, return `{ error: 'No text to translate' }`
Якщо `text` порожній, поверніть `{ error: 'No text to translate' }`
```js
async (getUserInput) => {
@@ -233,7 +233,7 @@ async (getUserInput) => {
};
```
If `locale` does not match one of the two specified locales, return `{ error: 'Invalid value for locale field' }`.
Якщо `locale` не відповідає одній із вказаних локалей, поверніть `{ error: 'Invalid value for locale field' }`.
```js
async (getUserInput) => {
@@ -255,7 +255,7 @@ async (getUserInput) => {
};
```
If `text` requires no translation, return `"Everything looks good to me!"` for the `translation` value.
Якщо `text` не потрібен переклад, поверніть `"Everything looks good to me!"` для значення `translation`.
```js
async (getUserInput) => {
@@ -282,7 +282,7 @@ async (getUserInput) => {
};
```
All 24 unit tests are complete and passing. See `/tests/1_unit-tests.js` for the expected behavior you should write tests for.
Усі 24 модульних тестів завершено та успішно пройдено. Перегляньте `/tests/1_unit-tests.js` очікуваної поведінки, для якої ви пишете тести.
```js
async (getUserInput) => {
@@ -307,7 +307,7 @@ async (getUserInput) => {
};
```
Усі 6 функціональних тестів завершено та успішно пройдено. See `/tests/2_functional-tests.js` for the functionality you should write tests for.
Усі 6 функціональних тестів завершено та успішно пройдено. Перегляньте `/tests/2_functional-tests.js` функціональності, для якої ви пишете тести.
```js
async (getUserInput) => {

View File

@@ -28,7 +28,7 @@ dashedName: issue-tracker
- Create all of the functional tests in `tests/2_functional-tests.js`
- Copy the `sample.env` file to `.env` and set the variables appropriately
- To run the tests uncomment `NODE_ENV=test` in your `.env` file
- To run the tests in the console, use the command `npm run test`. To open the Replit console, press Ctrl+Shift+P (Cmd if on a Mac) and type "open shell"
- Щоб запустити тести на консолі, використайте команду `npm run test`. Щоб відкрити консоль Replit, натисніть Ctrl+Shift+P (Cmd на Mac) та введіть «open shell»
Напишіть наступні тести в `tests/2_functional-tests.js`:

View File

@@ -28,34 +28,34 @@ dashedName: metric-imperial-converter
- Complete the necessary routes in `/routes/api.js`
- Copy the `sample.env` file to `.env` and set the variables appropriately
- To run the tests uncomment `NODE_ENV=test` in your `.env` file
- To run the tests in the console, use the command `npm run test`. To open the Replit console, press Ctrl+Shift+P (Cmd if on a Mac) and type "open shell"
- Щоб запустити тести на консолі, використайте команду `npm run test`. Щоб відкрити консоль Replit, натисніть Ctrl+Shift+P (Cmd на Mac) та введіть «open shell»
Напишіть наступні тести в `tests/1_unit-tests.js`:
- `convertHandler` should correctly read a whole number input.
- `convertHandler` should correctly read a decimal number input.
- `convertHandler` should correctly read a fractional input.
- `convertHandler` should correctly read a fractional input with a decimal.
- `convertHandler` повинен правильно читати введення цілого числа.
- `convertHandler` повинен правильно читати введення десяткового числа.
- `convertHandler` повинен правильно читати введення дробу.
- `convertHandler` повинен правильно читати введення десяткового дробу.
- `convertHandler` should correctly return an error on a double-fraction (i.e. `3/2/3`).
- `convertHandler` should correctly default to a numerical input of `1` when no numerical input is provided.
- `convertHandler` should correctly read each valid input unit.
- `convertHandler` should correctly return an error for an invalid input unit.
- `convertHandler` should return the correct return unit for each valid input unit.
- `convertHandler` should correctly return the spelled-out string unit for each valid input unit.
- `convertHandler` should correctly convert `gal` to `L`.
- `convertHandler` should correctly convert `L` to `gal`.
- `convertHandler` should correctly convert `mi` to `km`.
- `convertHandler` should correctly convert `km` to `mi`.
- `convertHandler` should correctly convert `lbs` to `kg`.
- `convertHandler` should correctly convert `kg` to `lbs`.
- `convertHandler` повинен правильно перетворювати `gal` у `L`.
- `convertHandler` повинен правильно перетворювати `L` у `gal`.
- `convertHandler` повинен правильно перетворювати `mi` у `km`.
- `convertHandler` повинен правильно перетворювати `km` у `mi`.
- `convertHandler` повинен правильно перетворювати `lbs` у `kg`.
- `convertHandler` повинен правильно перетворювати `kg` у `lbs`.
Напишіть наступні тести в `tests/2_functional-tests.js`:
- Convert a valid input such as `10L`: `GET` request to `/api/convert`.
- Convert an invalid input such as `32g`: `GET` request to `/api/convert`.
- Convert an invalid number such as `3/7.2/4kg`: `GET` request to `/api/convert`.
- Convert an invalid number AND unit such as `3/7.2/4kilomegagram`: `GET` request to `/api/convert`.
- Convert with no number such as `kg`: `GET` request to `/api/convert`.
- Перетворення дійсного вводу, наприклад `10L`: запит `GET` до `/api/convert`.
- Перетворення недійсного вводу, наприклад `32g`: запит `GET` до `/api/convert`.
- Перетворення недійсного числа, наприклад `3/7.2/4kg`: запит `GET` до `/api/convert`.
- Перетворення недійсного числа ТА одиниці, наприклад `3/7.2/4kilomegagram`: запит `GET` до `/api/convert`.
- Перетворення без числа, наприклад `kg`: запит `GET` до `/api/convert`.
# --hints--
@@ -71,13 +71,13 @@ getUserInput => {
};
```
You can `GET` `/api/convert` with a single parameter containing an accepted number and unit and have it converted. (Hint: Split the input by looking for the index of the first character which will mark the start of the unit)
Ви можете надіслати запит `GET` до `/api/convert` з параметром, що містить прийняті число та одиницю і отримати їх перетвореними. (Підказка: розділіть вхідні дані, знайшовши індекс першого символу, що позначить початок одиниці)
```js
```
You can convert `'gal'` to `'L'` and vice versa. (1 gal to 3.78541 L)
Ви можете перетворити `'gal'` у `'L'` і навпаки. (1 гал = 3.78541 л)
```js
async getUserInput => {
@@ -100,7 +100,7 @@ async getUserInput => {
};
```
You can convert `'lbs'` to `'kg'` and vice versa. (1 lbs to 0.453592 kg)
Ви можете перетворити `'lbs'` у `'kg'` і навпаки. (1 фунт = 0.453592 кг)
```js
async getUserInput => {
@@ -123,7 +123,7 @@ async getUserInput => {
};
```
You can convert `'mi'` to `'km'` and vice versa. (1 mi to 1.60934 km)
Ви можете перетворити `'mi'` у `'km'` і навпаки. (1 миля = 1.60934 км)
```js
async getUserInput => {
@@ -146,7 +146,7 @@ async getUserInput => {
};
```
All incoming units should be accepted in both upper and lower case, but should be returned in both the `initUnit` and `returnUnit` in lower case, except for liter, which should be represented as an uppercase `'L'`.
Усі вхідні одиниці повинні прийматись в верхньому та нижньому регістрах, однак повинні повертатись в `initUnit` та `returnUnit` в нижньому регістрі; винятком є літри, які повинні бути у верхньому регістрі `'L'`.
```js
async getUserInput => {
@@ -169,7 +169,7 @@ async getUserInput => {
};
```
If the unit of measurement is invalid, returned will be `'invalid unit'`.
Якщо одиниця виміру недійсна, поверненим буде `'invalid unit'`.
```js
async getUserInput => {
@@ -182,7 +182,7 @@ async getUserInput => {
};
```
If the number is invalid, returned will be `'invalid number'`.
Якщо число недійсне, поверненим буде `'invalid number'`.
```js
async getUserInput => {
@@ -197,7 +197,7 @@ async getUserInput => {
};
```
If both the unit and number are invalid, returned will be `'invalid number and unit'`.
Якщо одиниця та число недійсні, поверненим буде `'invalid number and unit'`.
```js
async getUserInput => {
@@ -215,7 +215,7 @@ async getUserInput => {
};
```
You can use fractions, decimals or both in the parameter (ie. 5, 1/2, 2.5/6), but if nothing is provided it will default to 1.
Ви можете використовувати дроби в параметрі (тобто 5, 1/2, 2.5/6), але якщо нічого не вказано, за замовчуванням буде 1.
```js
async getUserInput => {
@@ -246,7 +246,7 @@ async getUserInput => {
};
```
Your return will consist of the `initNum`, `initUnit`, `returnNum`, `returnUnit`, and `string` spelling out units in the format `'{initNum} {initUnitString} converts to {returnNum} {returnUnitString}'` with the result rounded to 5 decimals.
Повернений об'єкт міститиме `initNum`, `initUnit`, `returnNum`, `returnUnit` та `string`, прописуючи одиниці у форматі `'{initNum} {initUnitString} converts to {returnNum} {returnUnitString}'` із результатом, заокругленим до 5-ти символів після коми.
```js
async getUserInput => {
@@ -263,7 +263,7 @@ async getUserInput => {
};
```
All 16 unit tests are complete and passing.
Усі 16 модульних тестів завершено та успішно пройдено.
```js
async getUserInput => {

View File

@@ -31,7 +31,7 @@ dashedName: sudoku-solver
- All routing logic can go into `/routes/api.js`
- See the `puzzle-strings.js` file in `/controllers` for some sample puzzles your application should solve
- To run the challenge tests on this page, set `NODE_ENV` to `test` without quotes in the `.env` file
- To run the tests in the console, use the command `npm run test`. To open the Replit console, press Ctrl+Shift+P (Cmd if on a Mac) and type "open shell"
- Щоб запустити тести на консолі, використайте команду `npm run test`. Щоб відкрити консоль Replit, натисніть Ctrl+Shift+P (Cmd на Mac) та введіть «open shell»
Напишіть наступні тести в `tests/1_unit-tests.js`:
@@ -352,7 +352,7 @@ async (getUserInput) => {
};
```
All 12 unit tests are complete and passing. See `/tests/1_unit-tests.js` for the expected behavior you should write tests for.
Усі 12 модульних тестів завершено та успішно пройдено. See `/tests/1_unit-tests.js` for the expected behavior you should write tests for.
```js
async (getUserInput) => {

View File

@@ -30,7 +30,7 @@ bcrypt.compare(myPlaintextPassword, hash, (err, res) => {
});
```
Додайте це до наявної функції хешування (оскільки вам необхідно очікувати закінчення процесу перед тим як запускати функцію порівняння) після того, як ви записали про завершене хешування та ввели 'res' на консолі. На консолі з'являться дані перетворення та значення 'true'! Якщо ви зміните 'myPlaintextPassword' в функції порівняння на 'someOtherPlaintextPassword' - це призведе до помилки.
Додайте це до своєї наявної хеш-функції (оскільки вам потрібно дочекатися завершення хешу перед викликом функції порівняння) після того, як ви записали повний хеш та ввели «res» на консоль в межах порівняння. На консолі з'являться хеш та значення «true»! Якщо ви зміните «myPlaintextPassword» у функції порівняння на «someOtherPlaintextPassword» з'явиться false.
```js
bcrypt.hash('passw0rd!', 13, (err, hash) => {
@@ -47,7 +47,7 @@ bcrypt.hash('passw0rd!', 13, (err, hash) => {
# --hints--
Асинхронне перетворення паролів на дані необхідно правильно згенерувати і правильно синхронізувати.
Асинхронне хешування повинне бути правильно згенероване та порівняне.
```js
(getUserInput) =>

Some files were not shown because too many files have changed in this diff Show More