chore(i18n,learn): processed translations (#44851)
This commit is contained in:
camperbot
GitHub
@@ -0,0 +1,47 @@
|
||||
---
|
||||
id: bd7158d8c242eddfaeb5bd13
|
||||
title: 個人ポートフォリオのウェブページを作成する
|
||||
challengeType: 3
|
||||
forumTopicId: 301143
|
||||
dashedName: build-a-personal-portfolio-webpage
|
||||
---
|
||||
|
||||
# --description--
|
||||
|
||||
**目標:** こちら <https://codepen.io/freeCodeCamp/full/zNBOYG> と同様の機能を持つ [CodePen.io](https://codepen.io) アプリを構築します。
|
||||
|
||||
以下の[ユーザーストーリー](https://en.wikipedia.org/wiki/User_story)を満たし、すべてのテストがパスするようにしてください。 あなた独自のスタイルを与えてください。
|
||||
|
||||
このプロジェクトを完了するために、HTML、JavaScript、CSS を使用することができます。 これまでのレッスンでカバーされた純粋な CSS の練習をするため、純粋な CSS の使用を推奨します。 Bootstrap や SASS を使用しても構いません。 このプロジェクトで追加のテクノロジー (jQuery、React、Angular、Vue など) を使用することは推奨されません。使用する場合は自己責任で使用してください。 React のようなさまざまな技術スタックで作業する機会は他のプロジェクトで得られます。 私達は、このプロジェクトの推奨技術スタックを使用している場合の問題報告は全て受け入れ、修正するように努めます。 ハッピーコーディング！
|
||||
|
||||
**ユーザーストーリー #1:** 私のポートフォリオには、`welcome-section` の id を持つウェルカムセクションがあります。
|
||||
|
||||
**ユーザーストーリー #2:** ウェルカムセクションにはテキストを含む `h1` 要素があります。
|
||||
|
||||
**ユーザーストーリー #3:** 私のポートフォリオには、`projects` の id を持つプロジェクトセクションがあります。
|
||||
|
||||
**ユーザーストーリー #4:** プロジェクトセクションには、プロジェクトを入れるために少なくとも 1 つの `project-tile` クラスの要素があります。
|
||||
|
||||
**ユーザーストーリー #5:** プロジェクトセクションには、少なくとも 1 つのプロジェクトへのリンクが含まれている必要があります。
|
||||
|
||||
**ユーザーストーリー #6:** 私のポートフォリオには、 `navbar` の id を持つナビゲーションバーがあります。
|
||||
|
||||
**ユーザーストーリー #7:** ナビゲーションバーには、クリックするとページ上の異なるセクションに移動できるリンクが少なくとも 1 つあります。
|
||||
|
||||
**ユーザーストーリー #8:** 私のポートフォリオには `profile-link` の id を持つリンクがあり、GitHub または FCC プロフィールを新しいタブで開くことができます。
|
||||
|
||||
**ユーザーストーリー #9:** 私のポートフォリオには、少なくとも 1 つのメディアクエリがあります。
|
||||
|
||||
**ユーザーストーリー #10:** ウェルカムセクションの高さはビューポートの高さと等しくなければなりません。
|
||||
|
||||
**ユーザーストーリー #11:** ナビゲーションバーは常にビューポートの上部に表示されている必要があります。
|
||||
|
||||
<a href='https://codepen.io/pen?template=MJjpwO' target='_blank' rel='nofollow'>この CodePen テンプレートを使用して</a>あなたのプロジェクトを構築することができます。`Save` をクリックすると、あなた用の pen を作成することができます。 または、この CDN リンクを使用して任意の環境でテストを実行できます: `https://cdn.freecodecamp.org/testable-projects-fcc/v1/bundle.js`
|
||||
|
||||
完了したら、すべてのテストがパスする状態の作業プロジェクトの URL を送信します。
|
||||
|
||||
# --solutions--
|
||||
|
||||
```html
|
||||
// solution required
|
||||
```
|
||||
@@ -0,0 +1,55 @@
|
||||
---
|
||||
id: 587d78af367417b2b2512b04
|
||||
title: プロダクトのランディングページを作成する
|
||||
challengeType: 3
|
||||
forumTopicId: 301144
|
||||
dashedName: build-a-product-landing-page
|
||||
---
|
||||
|
||||
# --description--
|
||||
|
||||
**目標:** こちら <https://codepen.io/freeCodeCamp/full/RKRbwL> と同様の機能を持つ [CodePen.io](https://codepen.io) アプリを構築します。
|
||||
|
||||
以下の[ユーザーストーリー](https://en.wikipedia.org/wiki/User_story)を満たし、すべてのテストがパスするようにしてください。 あなた独自のスタイルを与えてください。
|
||||
|
||||
このプロジェクトを完了するために、HTML、JavaScript、CSS を使用することができます。 これまでのレッスンでカバーされた純粋な CSS の練習をするため、純粋な CSS の使用を推奨します。 Bootstrap や SASS を使用しても構いません。 このプロジェクトで追加のテクノロジー (jQuery、React、Angular、Vue など) を使用することは推奨されません。使用する場合は自己責任で使用してください。 React のようなさまざまな技術スタックで作業する機会は他のプロジェクトで得られます。 私達は、このプロジェクトの推奨技術スタックを使用している場合の問題報告は全て受け入れ、修正するように努めます。 ハッピーコーディング！
|
||||
|
||||
**ユーザーストーリー #1:** 私のプロダクトランディングページには `id="header"` を持つ `header` 要素があります。
|
||||
|
||||
**ユーザーストーリー #2:** `header` 要素内には `id="header-img"` を持つ画像が表示されます。 会社のロゴがあればここでいいイメージを与えることができるでしょう。
|
||||
|
||||
**ユーザーストーリー #3:** `#header` 要素内に `id="nav-bar"` を持つ `nav` 要素があります。
|
||||
|
||||
**ユーザーストーリー #4:** `nav` 要素内に少なくとも 3 つのクリック可能な `nav-link` クラスの要素があります。
|
||||
|
||||
**ユーザーストーリー #5:** `nav` 要素内の `.nav-link` ボタンをクリックしたら、ランディングページの対応するセクションに移動します。
|
||||
|
||||
**ユーザーストーリー #6:** `id="video"` を持つプロダクトの埋め込み動画を見ることができます。
|
||||
|
||||
**ユーザーストーリー #7:** 私のランディングページには `id="form"` を持つ `form` 要素があります。
|
||||
|
||||
**ユーザーストーリー #8:** フォーム内には、E メールアドレスが入力可能な `id="email"` を持つ `input` フィールドがあります。
|
||||
|
||||
**ユーザーストーリー #9:** `#email` 入力フィールドには、フィールドの用途をユーザーに知らせるためのプレイスホルダ―テキストが必要です。
|
||||
|
||||
**ユーザーストーリー #10:** `#email` 入力フィールドは、入力されたテキストがメールアドレスであるか確認するために HTML5 のバリデーションを使用します。
|
||||
|
||||
**ユーザーストーリー #11:** フォーム内には、`id="submit"` を持つ送信ボタンの `input` があります。
|
||||
|
||||
**ユーザーストーリー #12:** `#submit` 要素をクリックすると、email の情報が静的ページに送信されます (このモック URL を使用してください: <https://www.freecodecamp.com/email-submit>)。
|
||||
|
||||
**ユーザーストーリー #13:** ナビゲーションバーは常にビューポートの上部に表示されている必要があります。
|
||||
|
||||
**ユーザーストーリー #14:** 私のプロダクトランディングページには、少なくとも 1 つのメディアクエリがあります。
|
||||
|
||||
**ユーザーストーリー #15:** 私のプロダクトランディングページは、少なくとも 1 つの CSS フレックスボックスを使用しています。
|
||||
|
||||
<a href='https://codepen.io/pen?template=MJjpwO' target='_blank' rel='nofollow'>この CodePen テンプレートを使用して</a>あなたのプロジェクトを構築することができます。`Save` をクリックすると、あなた用の pen を作成することができます。 または、この CDN リンクを使用して任意の環境でテストを実行できます: `https://cdn.freecodecamp.org/testable-projects-fcc/v1/bundle.js`
|
||||
|
||||
完了したら、すべてのテストがパスする状態の作業プロジェクトの URL を送信します。
|
||||
|
||||
# --solutions--
|
||||
|
||||
```html
|
||||
// solution required
|
||||
```
|
||||
@@ -0,0 +1,57 @@
|
||||
---
|
||||
id: 587d78af367417b2b2512b03
|
||||
title: アンケートフォームを作成する
|
||||
challengeType: 3
|
||||
forumTopicId: 301145
|
||||
dashedName: build-a-survey-form
|
||||
---
|
||||
|
||||
# --description--
|
||||
|
||||
**目標:** こちら <https://codepen.io/freeCodeCamp/full/VPaoNP> と同様の機能を持つ [CodePen.io](https://codepen.io) アプリを構築します。
|
||||
|
||||
以下の[ユーザーストーリー](https://en.wikipedia.org/wiki/User_story)を満たし、すべてのテストがパスするようにしてください。 あなた独自のスタイルを与えてください。
|
||||
|
||||
このプロジェクトを完了するために、HTML、JavaScript、CSS を使用することができます。 これまでのレッスンでカバーされた純粋な CSS の練習をするため、純粋な CSS の使用を推奨します。 Bootstrap や SASS を使用しても構いません。 このプロジェクトで追加のテクノロジー (jQuery、React、Angular、Vue など) を使用することは推奨されません。使用する場合は自己責任で使用してください。 React のようなさまざまな技術スタックで作業する機会は他のプロジェクトで得られます。 私達は、このプロジェクトの推奨技術スタックを使用している場合の問題報告は全て受け入れ、修正するように努めます。 ハッピーコーディング！
|
||||
|
||||
**ユーザーストーリー #1:** `id="title"` を持つ H1 サイズテキストのタイトルがあります。
|
||||
|
||||
**ユーザーストーリー #2:** `id="description"` を持つ P サイズテキストの短い説明文があります。
|
||||
|
||||
**ユーザーストーリー #3:** `id="survey-form"` を持つ `form` があります。
|
||||
|
||||
**ユーザーストーリー #4:** フォーム要素内では、`id="name"` を持つフィールドに名前入力が必須となっています。
|
||||
|
||||
**ユーザーストーリー #5:** フォーム要素内では、`id="email"` を持つフィールドにメールアドレスを入力することが必須となっています。
|
||||
|
||||
**ユーザーストーリー #6:** メールアドレスとして正しいフォーマットでない内容を入力すると、HTML5 のバリデーションエラーが表示されます。
|
||||
|
||||
**ユーザーストーリー #7: ** フォーム要素内では、`id="number"` を持つフィールドに数字を入力することができます。
|
||||
|
||||
**ユーザーストーリー #8:** 数字ではない内容を入力すると、HTML5 のバリデーションエラーが表示されます。
|
||||
|
||||
**ユーザーストーリー #9:** `min` と `max` 属性で定義した範囲外の数字を入力すると、HTML5 のバリデーションエラーが表示されます。
|
||||
|
||||
**ユーザーストーリー #10:** フォーム内の名前、メール、数字入力フィールドには、以下の id で各フィールドの目的を説明するラベルが含まれます: `id="name-label"`、`id="email-label"`、`id="number-label"`
|
||||
|
||||
**ユーザーストーリー #11:** 名前、メール、数値の入力フィールドには、各フィールドの説明や指示を示すプレイスホルダ―テキストが表示されます。
|
||||
|
||||
**ユーザーストーリー #12:** フォーム要素内では、対応する `id="dropdown"` を持つドロップダウンからオプションを選択できます。
|
||||
|
||||
**ユーザーストーリー #13:** フォーム要素内では、1 つ以上のグループからなるラジオボタンでフィールドを選択できます。 各グループは `name` 属性を使用してグループ化する必要があります。
|
||||
|
||||
**ユーザーストーリー #14:** フォーム要素内では、一連のチェックボックスからいくつかのフィールドを選択することができ、それぞれは `value` 属性を持つ必要があります。
|
||||
|
||||
**ユーザーストーリー #15:** フォーム要素内では、追加でコメントするために最後に `textarea` を表示します。
|
||||
|
||||
**ユーザーストーリー #16:** フォーム要素内では、すべての入力内容を送信するため `id="submit"` を持つボタンを表示します。
|
||||
|
||||
<a href='https://codepen.io/pen?template=MJjpwO' target='_blank' rel='nofollow'>この CodePen テンプレートを使用して</a>あなたのプロジェクトを構築することができます。`Save` をクリックすると、あなた用の pen を作成することができます。 または、この CDN リンクを使用して任意の環境でテストを実行できます: `https://cdn.freecodecamp.org/testable-projects-fcc/v1/bundle.js`
|
||||
|
||||
完了したら、すべてのテストがパスする状態の作業プロジェクトの URL を送信します。
|
||||
|
||||
# --solutions--
|
||||
|
||||
```html
|
||||
// solution required
|
||||
```
|
||||
@@ -0,0 +1,55 @@
|
||||
---
|
||||
id: 587d78b0367417b2b2512b05
|
||||
title: テクニカルドキュメントページを作成する
|
||||
challengeType: 3
|
||||
forumTopicId: 301146
|
||||
dashedName: build-a-technical-documentation-page
|
||||
---
|
||||
|
||||
# --description--
|
||||
|
||||
**目標:** こちら <https://codepen.io/freeCodeCamp/full/NdrKKL> と同様の機能を持つ [CodePen.io](https://codepen.io) アプリを構築します。
|
||||
|
||||
以下の[ユーザーストーリー](https://en.wikipedia.org/wiki/User_story)を満たし、すべてのテストがパスするようにしてください。 あなた独自のスタイルを与えてください。
|
||||
|
||||
このプロジェクトを完了するために、HTML、JavaScript、CSS を使用することができます。 これまでのレッスンでカバーされた純粋な CSS の練習をするため、純粋な CSS の使用を推奨します。 Bootstrap や SASS を使用しても構いません。 このプロジェクトで追加のテクノロジー (jQuery、React、Angular、Vue など) を使用することは推奨されません。使用する場合は自己責任で使用してください。 React のようなさまざまな技術スタックで作業する機会は他のプロジェクトで得られます。 私達は、このプロジェクトの推奨技術スタックを使用している場合の問題報告は全て受け入れ、修正するように努めます。 ハッピーコーディング！
|
||||
|
||||
**ユーザーストーリー #1:** `id="main-doc"` を持ち、ページのメインコンテンツ (テクニカルドキュメント) を含む `main` 要素があります。
|
||||
|
||||
**ユーザーストーリー #2:** `#main-doc` 要素内に、それぞれのクラスが `main-section` である複数の `section` 要素があります。 最低でも 5 個必要です。
|
||||
|
||||
**ユーザーストーリー #3:** 各 `.main-section` 内の最初の要素は、そのセクションの主なトピックを説明するテキストを含む `header` 要素でなければなりません。
|
||||
|
||||
**ユーザーストーリー #4:** クラスが `main-section` の各 `section` 要素は、それぞれの `header` のテキストに対応する id も持つ必要があります。 すべてのスペースはアンダースコアに置き換える必要があります (例: "JavaScript and Java" ヘッダーを含む `section` には対応する `id="JavaScript_and_Java"` が必要です)。
|
||||
|
||||
**ユーザーストーリー #5:** `.main-section` 要素は少なくとも (それぞれではなく) 合計で 10 個の `p` 要素を含む必要があります。
|
||||
|
||||
**ユーザーストーリー #6:** `.main-section` 要素は少なくとも (それぞれではなく) 合計で 5 個の `code` 要素を含む必要があります。
|
||||
|
||||
**ユーザーストーリー #7:** `.main-section` 要素は少なくとも (それぞれではなく) 合計で 5 個の `li` 要素を含む必要があります。
|
||||
|
||||
**ユーザーストーリー #8:** `id="navbar"` を持つ `nav` 要素があります。
|
||||
|
||||
**ユーザーストーリー #9:** navbar 要素には、テクニカルドキュメントのトピックを説明するテキストを含む `header` 要素が含まれている必要があります。
|
||||
|
||||
**ユーザーストーリー #10:** さらに、ナビゲーションバーには `nav-link` のクラスを持つリンク (`a`) 要素が含まれている必要があります。 これはクラス `main-section` の各要素ごとに一つ存在する必要があります。
|
||||
|
||||
**ユーザーストーリー #11:** ナビゲーションバーの `header` 要素は navbar のどのリンク (`a`) 要素よりも前に置かれなければなりません。
|
||||
|
||||
**ユーザーストーリー #12:** `nav-link` クラスの各要素には、各 `section` 内の `header` テキストに対応するテキストが含まれていなければなりません (例えば、もし "Hello world" セクション / ヘッダーがあるならば、ナビゲーションバーには "Hello world" テキストを含む要素が必要です) 。
|
||||
|
||||
**User Story #13:** When I click on a navbar element, the page should navigate to the corresponding section of the `main-doc` element (e.g. If I click on a `nav-link` element that contains the text "Hello world", the page navigates to a `section` element that has that id and contains the corresponding `header`.
|
||||
|
||||
**User Story #14:** On regular sized devices (laptops, desktops), the element with `id="navbar"` should be shown on the left side of the screen and should always be visible to the user.
|
||||
|
||||
**User Story #15:** My Technical Documentation page should use at least one media query.
|
||||
|
||||
You can build your project by <a href='https://codepen.io/pen?template=MJjpwO' target='_blank' rel='nofollow'>using this CodePen template</a> and clicking `Save` to create your own pen. Or you can use this CDN link to run the tests in any environment you like: `https://cdn.freecodecamp.org/testable-projects-fcc/v1/bundle.js`
|
||||
|
||||
Once you're done, submit the URL to your working project with all its tests passing.
|
||||
|
||||
# --solutions--
|
||||
|
||||
```html
|
||||
// solution required
|
||||
```
|
||||
@@ -0,0 +1,43 @@
|
||||
---
|
||||
id: bd7158d8c442eddfaeb5bd18
|
||||
title: トリビュートページを作成する
|
||||
challengeType: 3
|
||||
forumTopicId: 301147
|
||||
dashedName: build-a-tribute-page
|
||||
---
|
||||
|
||||
# --description--
|
||||
|
||||
**Objective:** Build a [CodePen.io](https://codepen.io) app that is functionally similar to this: <https://codepen.io/freeCodeCamp/full/zNqgVx>.
|
||||
|
||||
Fulfill the below [user stories](https://en.wikipedia.org/wiki/User_story) and get all of the tests to pass. Give it your own personal style.
|
||||
|
||||
You can use HTML, JavaScript, and CSS to complete this project. Plain CSS is recommended because that is what the lessons have covered so far and you should get some practice with plain CSS. You can use Bootstrap or SASS if you choose. Additional technologies (just for example jQuery, React, Angular, or Vue) are not recommended for this project, and using them is at your own risk. Other projects will give you a chance to work with different technology stacks like React. We will accept and try to fix all issue reports that use the suggested technology stack for this project. Happy coding!
|
||||
|
||||
**User Story #1:** My tribute page should have an element with a corresponding `id="main"`, which contains all other elements.
|
||||
|
||||
**User Story #2:** I should see an element with a corresponding `id="title"`, which contains a string (i.e. text) that describes the subject of the tribute page (e.g. "Dr. Norman Borlaug").
|
||||
|
||||
**User Story #3:** I should see either a `figure` or a `div` element with a corresponding `id="img-div"`.
|
||||
|
||||
**User Story #4:** Within the `img-div` element, I should see an `img` element with a corresponding `id="image"`.
|
||||
|
||||
**User Story #5:** Within the `img-div` element, I should see an element with a corresponding `id="img-caption"` that contains textual content describing the image shown in `img-div`.
|
||||
|
||||
**User Story #6:** I should see an element with a corresponding `id="tribute-info"`, which contains textual content describing the subject of the tribute page.
|
||||
|
||||
**User Story #7:** I should see an `a` element with a corresponding `id="tribute-link"`, which links to an outside site that contains additional information about the subject of the tribute page. HINT: You must give your element an attribute of `target` and set it to `_blank` in order for your link to open in a new tab (i.e. `target="_blank"`).
|
||||
|
||||
**User Story #8:** The `img` element should responsively resize, relative to the width of its parent element, without exceeding its original size.
|
||||
|
||||
**User Story #9:** The `img` element should be centered within its parent element.
|
||||
|
||||
You can build your project by <a href='https://codepen.io/pen?template=MJjpwO' target='_blank' rel='nofollow'>using this CodePen template</a> and clicking `Save` to create your own pen. Or you can use this CDN link to run the tests in any environment you like: `https://cdn.freecodecamp.org/testable-projects-fcc/v1/bundle.js`.
|
||||
|
||||
Once you're done, submit the URL to your working project with all its tests passing.
|
||||
|
||||
# --solutions--
|
||||
|
||||
```html
|
||||
// solution required
|
||||
```
|
||||
Reference in New Issue
Block a user