Berkeley Martinez
GitHub
10
.github/PULL_REQUEST_TEMPLATE.md
vendored
10
.github/PULL_REQUEST_TEMPLATE.md
vendored
@ -5,23 +5,23 @@
|
||||
<!-- Make sure that your PR is not a duplicate -->
|
||||
|
||||
#### Pre-Submission Checklist
|
||||
<!-- Go over all points below, and put an `x` in all the boxes that apply. -->
|
||||
<!-- All points should be checked, otherwise, read the CONTRIBUTING guidelines from above-->
|
||||
<!-- Go over all points below, and after creating the PR, tick all the checkboxes that apply. -->
|
||||
<!-- All points should be verified, otherwise, read the CONTRIBUTING guidelines from above-->
|
||||
<!-- If you're unsure about any of these, don't hesitate to ask. We're here to help! -->
|
||||
- [ ] Your pull request targets the `staging` branch of FreeCodeCamp.
|
||||
- [ ] Branch starts with either `fix/`, `feature/`, or `translate/` (e.g. `fix/signin-issue`)
|
||||
- [ ] You have only one commit (if not, [squash](https://github.com/FreeCodeCamp/FreeCodeCamp/wiki/git-rebase#squashing-multiple-commits-into-one) them into one commit).
|
||||
- [ ] You have only one commit (if not, [squash](https://github.com/FreeCodeCamp/FreeCodeCamp/wiki/Git-Squash) them into one commit).
|
||||
- [ ] All new and existing tests pass the command `npm run test-challenges`. Use `git commit --amend` to amend any fixes.
|
||||
|
||||
#### Type of Change
|
||||
<!-- What type of change does your code introduce? Put an `x` in the box that applies. -->
|
||||
<!-- What type of change does your code introduce? After creating the PR, tick the checkboxes that apply. -->
|
||||
- [ ] Small bug fix (non-breaking change which fixes an issue)
|
||||
- [ ] New feature (non-breaking change which adds new functionality)
|
||||
- [ ] Breaking change (fix or feature that would change existing functionality)
|
||||
- [ ] Add new translation (feature adding new translations)
|
||||
|
||||
#### Checklist:
|
||||
<!-- Go over all points below, and put an `x` in all the boxes that apply. -->
|
||||
<!-- Go over all points below, and after creating the PR, tick the checkboxes that apply. -->
|
||||
<!-- If you're unsure about any of these, don't hesitate to ask in the Help Contributors room linked above. We're here to help! -->
|
||||
- [ ] Tested changes locally.
|
||||
- [ ] Closes currently open issue (replace XXXX with an issue no): Closes #XXXX
|
||||
|
||||
@ -87,7 +87,9 @@ main = (function(main, global) {
|
||||
return null;
|
||||
}
|
||||
mainChatTitleAdded = true;
|
||||
|
||||
if ($('body').hasClass('night')) {
|
||||
$('#chat-embed-main').addClass('night');
|
||||
}
|
||||
$('#chat-embed-main > .gitter-chat-embed-action-bar').prepend(
|
||||
'<div class="chat-embed-main-title">' +
|
||||
'<span>Free Code Camp\'s Main Chat</span>' +
|
||||
@ -303,6 +305,9 @@ $(document).ready(function() {
|
||||
frameBorder: '0'
|
||||
});
|
||||
$('.map-aside').append(mapAside);
|
||||
if ($('body').hasClass('night')) {
|
||||
mapAside.addClass('night');
|
||||
}
|
||||
main.isMapAsideLoad = true;
|
||||
}
|
||||
$('.map-aside').removeClass('is-collapsed');
|
||||
@ -370,6 +375,9 @@ $(document).ready(function() {
|
||||
});
|
||||
$('.wiki-aside').append(wikiAside);
|
||||
main.isWikiAsideLoad = true;
|
||||
if ($('body').hasClass('night')) {
|
||||
wikiAside.addClass('night');
|
||||
}
|
||||
}
|
||||
$('.wiki-aside').removeClass('is-collapsed');
|
||||
}
|
||||
|
||||
@ -1 +0,0 @@
|
||||
simply-hired-verification: c7979f1c69945c59.html
|
||||
@ -51,19 +51,19 @@
|
||||
""
|
||||
],
|
||||
[
|
||||
"//i.imgur.com/k8btNUB.jpg",
|
||||
"//i.imgur.com/akGfLoa.jpg",
|
||||
"A screenshot of our Front End Development Certificate",
|
||||
"To earn our verified Front End Development Certification, you'll build 10 projects using HTML, CSS, jQuery, and JavaScript.",
|
||||
""
|
||||
],
|
||||
[
|
||||
"//i.imgur.com/Et3iD74.jpg",
|
||||
"//i.imgur.com/ocEL0D3.jpg",
|
||||
"A screenshot of our Data Visualization Certificate",
|
||||
"To earn our Data Visualization Certification, you'll build 10 projects using React, Sass and D3.js.",
|
||||
""
|
||||
],
|
||||
[
|
||||
"//i.imgur.com/8v3t84p.jpg",
|
||||
"//i.imgur.com/8HCk1Od.jpg",
|
||||
"A screenshot of our Back End Development Certificate",
|
||||
"To earn our Back End Development Certification, you'll build 10 projects using Node.js, Express, and MongoDB. You'll use Git and Heroku to deploy them to the cloud.",
|
||||
""
|
||||
@ -130,19 +130,19 @@
|
||||
""
|
||||
],
|
||||
[
|
||||
"//i.imgur.com/k8btNUB.jpg",
|
||||
"//i.imgur.com/akGfLoa.jpg",
|
||||
"Une capture d'écran de notre certificat développeur Front-End",
|
||||
"Pour réussir notre certificat Front-End vérifié, vous allez construire 10 projets utilisant HTML , CSS , jQuery et JavaScript.",
|
||||
""
|
||||
],
|
||||
[
|
||||
"//i.imgur.com/Et3iD74.jpg",
|
||||
"//i.imgur.com/ocEL0D3.jpg",
|
||||
"Une capture d'écran de notre certificat de visualisation de données",
|
||||
"Pour gagner notre certification de visualisation de données , vous allez construire 10 projets utilisant Réagir, Sass et D3.js.",
|
||||
""
|
||||
],
|
||||
[
|
||||
"//i.imgur.com/8v3t84p.jpg",
|
||||
"//i.imgur.com/8HCk1Od.jpg",
|
||||
"Une capture d'écran de notre certificat Back-End",
|
||||
"Pour gagner notre certification de développeur Back-End, vous allez construire 10 projets utilisant Node.js , Express, et MongoDB . Vous allez utiliser Git et Heroku de les déployer dans le cloud.",
|
||||
""
|
||||
@ -205,19 +205,19 @@
|
||||
""
|
||||
],
|
||||
[
|
||||
"//i.imgur.com/k8btNUB.jpg",
|
||||
"//i.imgur.com/akGfLoa.jpg",
|
||||
"Una imagen de nuestro Certificado de Desarrollo de Interfaces",
|
||||
"Para obtener nuestra certificación verificada de Desarrollo de Interfaces, construirás 10 proyectos usando HTML, CSS, jQuery y JavaScript.",
|
||||
""
|
||||
],
|
||||
[
|
||||
"//i.imgur.com/Et3iD74.jpg",
|
||||
"//i.imgur.com/ocEL0D3.jpg",
|
||||
"Una imagen de nuestro Certificado de Visualización de Datos",
|
||||
"Para obtener nuestra certificación en Visualización de Datos, construirás 10 proyectos usando React, Sass y D3.js.",
|
||||
""
|
||||
],
|
||||
[
|
||||
"//i.imgur.com/8v3t84p.jpg",
|
||||
"//i.imgur.com/8HCk1Od.jpg",
|
||||
"Una imagen de nuestro Certificado de Desarrollo al Lado del Servidor",
|
||||
"Para obtener nuestro Certificado de Desarrollo al Lado del Servidor, construirás 10 proyectos empleando Node.js, Express y MongoDB. Usarás Git y Heroku para desplegarlos en la nube.",
|
||||
""
|
||||
@ -280,19 +280,19 @@
|
||||
""
|
||||
],
|
||||
[
|
||||
"//i.imgur.com/k8btNUB.jpg",
|
||||
"//i.imgur.com/akGfLoa.jpg",
|
||||
"Ein Screenshot von unserem Frontendzertifikat",
|
||||
"Um sich unser geprüftes Frontend-Entwicklungszertifikat zu verdienen, wirst du 10 Projekte mit HTML, CSS, jQuery und Javascript umsetzen.",
|
||||
""
|
||||
],
|
||||
[
|
||||
"//i.imgur.com/Et3iD74.jpg",
|
||||
"//i.imgur.com/ocEL0D3.jpg",
|
||||
"Ein Screenshot von unserem Datenvisualisierungszertifikat",
|
||||
"Für unser Datenvisualisierungszertifikat, wirst du 10 Projekte mit React, Sass und D3.js umsetzen.",
|
||||
""
|
||||
],
|
||||
[
|
||||
"//i.imgur.com/8v3t84p.jpg",
|
||||
"//i.imgur.com/8HCk1Od.jpg",
|
||||
"Ein Screenshot von unserem Backend-Entwicklungszertifikat",
|
||||
"Um unser Backend-Entwicklungszertifikat zu erhalten, wirst du 10 Projekte mit Node.js, Express und MongoDB umsetzen. Du wirst Git und Heroku verwenden um sie in der Cloud zu veröffentlichen.",
|
||||
""
|
||||
|
||||
@ -366,7 +366,7 @@
|
||||
},
|
||||
{
|
||||
"id": "afcc8d540bea9ea2669306b6",
|
||||
"title": "Repeat a string",
|
||||
"title": "Repeat a string repeat a string",
|
||||
"description": [
|
||||
"Repeat a given string (first argument) <code>num</code> times (second argument). Return an empty string if <code>num</code> is not a positive number.",
|
||||
"Remember to use <a href=\"//github.com/FreeCodeCamp/freecodecamp/wiki/FreeCodeCamp-Get-Help\" target=\"_blank\">Read-Search-Ask</a> if you get stuck. Write your own code."
|
||||
|
||||
@ -1036,14 +1036,14 @@
|
||||
"title": "Escape Sequences in Strings",
|
||||
"description": [
|
||||
"Quotes are not the only characters that can be <dfn>escaped</dfn> inside a string. Here is a table of common escape sequences:",
|
||||
"<table class=\"table table-striped\"><thead><tr><th>Code</th><th>Output</th></tr></thead><tbody><tr><td><code>\\'</code></td><td>single quote</td></tr><tr><td><code>\\\"</code></td><td>double quote</td></tr><tr><td><code>\\\\</code></td><td>backslash</td></tr><tr><td><code>\\n</code></td><td>new line</td></tr><tr><td><code>\\r</code></td><td>carriage return</td></tr><tr><td><code>\\t</code></td><td>tab</td></tr><tr><td><code>\\b</code></td><td>backspace</td></tr><tr><td><code>\\f</code></td><td>form feed</td></tr></tbody></table>",
|
||||
"<table class=\"table table-striped\"><thead><tr><th>Code</th><th>Output</th></tr></thead><tbody><tr><td><code>\\'</code></td><td>single quote</td></tr><tr><td><code>\\\"</code></td><td>double quote</td></tr><tr><td><code>\\\\</code></td><td>backslash</td></tr><tr><td><code>\\n</code></td><td>newline</td></tr><tr><td><code>\\r</code></td><td>carriage return</td></tr><tr><td><code>\\t</code></td><td>tab</td></tr><tr><td><code>\\b</code></td><td>backspace</td></tr><tr><td><code>\\f</code></td><td>form feed</td></tr></tbody></table>",
|
||||
"<em>Note that the backslash itself must be escaped in order to display as a backslash.</em>",
|
||||
"<h4>Instructions</h4>",
|
||||
"Assign the following two lines of text into the single variable <code>myStr</code> using escape sequences.",
|
||||
"<blockquote>Here is a backslash: \\.<br> Here is a new line with two tabs.</blockquote>",
|
||||
"You will need to use escape sequences to insert special characters correctly. You will also need to follow the spacing as it looks above with no additional spaces between each escape sequence.",
|
||||
"Assign the following three lines of text into the single variable <code>myStr</code> using escape sequences.",
|
||||
"<blockquote>FirstLine<br>\\SecondLine\\<br>ThirdLine</blockquote>",
|
||||
"You will need to use escape sequences to insert special characters correctly. You will also need to follow the spacing as it looks above, with no spaces between escape sequences or words.",
|
||||
"Here is the text with the escape sequences written out.",
|
||||
"<q>Here is a backslash: <code>backslash</code>.<code>newline</code> <code>tab</code> <code>tab</code> Here is a new line with two tabs.</q>"
|
||||
"<q>FirstLine<code>newline</code><code>backslash</code>SecondLine<code>backslash</code><code>carriage-return</code>ThirdLine</q>"
|
||||
],
|
||||
"releasedOn": "January 1, 2016",
|
||||
"challengeSeed": [
|
||||
@ -1058,14 +1058,13 @@
|
||||
"else{return null;}})();"
|
||||
],
|
||||
"solutions": [
|
||||
"var myStr = \"Here is a backslash: \\\\.\\n\\t\\tHere is a new line with two tabs.\";"
|
||||
"var myStr = \"FirstLine\\n\\\\SecondLine\\\\\\rThirdLine\";"
|
||||
],
|
||||
"tests": [
|
||||
"assert(myStr === \"Here is a backslash: \\\\.\\n\\t\\tHere is a new line with two tabs.\", 'message: <code>myStr</code> should have encoded text with the proper escape sequences and spacing.');",
|
||||
"assert(myStr.match(/\\t/g).length == 2, 'message: <code>myStr</code> should have two tab characters <code>\\t</code>');",
|
||||
"assert(myStr === \"FirstLine\\n\\\\SecondLine\\\\\\rThirdLine\", 'message: <code>myStr</code> should have encoded text with the proper escape sequences and no spacing.');",
|
||||
"assert(myStr.match(/\\n/g).length == 1, 'message: <code>myStr</code> should have one newline character <code>\\n</code>');",
|
||||
"assert(myStr.match(/\\\\/g).length == 1, 'message: <code>myStr</code> should have a correctly escaped backslash character <code>\\\\</code>');",
|
||||
"assert(myStr === \"Here is a backslash: \\\\.\\n\\t\\tHere is a new line with two tabs.\", 'message: <code>myStr</code> should not have any spaces in between consecutive escape sequences.');"
|
||||
"assert(myStr.match(/\\r/g).length == 1, 'message: <code>myStr</code> should have one carriage return character <code>\\r</code>');",
|
||||
"assert(myStr.match(/\\\\/g).length == 2, 'message: <code>myStr</code> should have two correctly escaped backslash characters <code>\\\\</code>');"
|
||||
],
|
||||
"type": "waypoint",
|
||||
"challengeType": 1,
|
||||
@ -2845,7 +2844,7 @@
|
||||
"assert(testStrictNotEqual(\"17\") === \"Not Equal\", 'message: <code>testStrictNotEqual(\"17\")</code> should return \"Not Equal\"');",
|
||||
"assert(testStrictNotEqual(12) === \"Not Equal\", 'message: <code>testStrictNotEqual(12)</code> should return \"Not Equal\"');",
|
||||
"assert(testStrictNotEqual(\"bob\") === \"Not Equal\", 'message: <code>testStrictNotEqual(\"bob\")</code> should return \"Not Equal\"');",
|
||||
"assert(code.match(/val\\s*!==\\s*\\d+/g).length > 0, 'message: You should use the <code>!==</code> operator');"
|
||||
"assert(code.match(/(val\\s*!==\\s*\\d+)|(\\d+\\s*!==\\s*val)/g).length > 0, 'message: You should use the <code>!==</code> operator');"
|
||||
],
|
||||
"type": "waypoint",
|
||||
"challengeType": 1,
|
||||
@ -3669,7 +3668,7 @@
|
||||
"You may recall from <a href=\"waypoint-comparison-with-the-equality-operator\" target=\"_blank\">Comparison with the Equality Operator</a> that all comparison operators return a boolean <code>true</code> or <code>false</code> value.",
|
||||
"A common <dfn>anti-pattern</dfn> is to use an <code>if/else</code> statement to do a comparison and then <code>return</code> <code>true</code>/<code>false</code>:",
|
||||
"<blockquote>function isEqual(a,b) {<br> if (a === b) {<br> return true;<br> } else {<br> return false;<br> }<br>}</blockquote>",
|
||||
"Since <code>===</code> returns <code>true</code> or <code>false</code>, we can simply return the result of the comparison:",
|
||||
"Since <code>===</code> returns <code>true</code> or <code>false</code>, we can return the result of the comparison:",
|
||||
"<blockquote>function isEqual(a,b) {<br> return a === b;<br>}</blockquote>",
|
||||
"<h4>Instructions</h4>",
|
||||
"Fix the function <code>isLess</code> to remove the <code>if/else</code> statements."
|
||||
@ -4197,7 +4196,7 @@
|
||||
"var ourDog = {\n \"name\": \"Camper\",\n \"legs\": 4,\n \"tails\": 1,\n \"friends\": [\"everything!\"],\n \"bark\": \"bow-wow\"\n};\nvar myDog = {\n \"name\": \"Happy Coder\",\n \"legs\": 4,\n \"tails\": 1,\n \"friends\": [\"Free Code Camp Campers\"],\n \"bark\": \"woof\"\n};\ndelete myDog.tails;"
|
||||
],
|
||||
"tests": [
|
||||
"assert(myDog.tails === undefined, 'message: Delete the property <code>\"tails\"</code> from <code>myDog</code>.');",
|
||||
"assert(typeof myDog === \"object\" && myDog.tails === undefined, 'message: Delete the property <code>\"tails\"</code> from <code>myDog</code>.');",
|
||||
"assert(code.match(/\"tails\": 1/g).length > 1, 'message: Do not modify the <code>myDog</code> setup');"
|
||||
],
|
||||
"type": "waypoint",
|
||||
@ -4517,14 +4516,14 @@
|
||||
"id": "56533eb9ac21ba0edf2244cf",
|
||||
"title": "Record Collection",
|
||||
"description": [
|
||||
"You are given a JSON object representing (a small part of) your record collection. Each album is identified by a unique id number (its key) and has several properties. Not all albums have complete information.",
|
||||
"Write a function which takes an <code>id</code>, a property (<code>prop</code>), and a <code>value</code>.",
|
||||
"For the given <code>id</code> in <code>collection</code>:",
|
||||
"If <code>prop</code> does not contain the key <code>\"tracks\"</code>, then update or set the <code>value</code> for that incomplete <code>prop</code>.",
|
||||
"If <code>prop</code> does not contain the key <code>\"tracks\"</code> before you update it, create an empty array before pushing a track to it.",
|
||||
"If <code>prop</code> does contain the key <code>\"tracks\"</code> and its <code>value</code> is non-blank, then push the <code>value</code> onto the end of its existing <code>tracks</code> array.",
|
||||
"If <code>value</code> is blank, delete that <code>prop</code>.",
|
||||
"Always return the entire collection object.",
|
||||
"You are given a JSON object representing a part of your musical album collection. Each album has several properties and a unique id number as its key. Not all albums have complete information.",
|
||||
"Write a function which takes an album's <code>id</code> (like <code>2548</code>), a property <code>prop</code> (like <code>\"artist\"</code> or <code>\"tracks\"</code>), and a <code>value</code> (like <code>\"Addicted to Love\"</code>) to modify the data in this collection.",
|
||||
"If <code>prop</code> isn't <code>\"tracks\"</code> and <code>value</code> isn't blank, update or set the <code>value</code> for that record album's property.",
|
||||
"Your function must always return the entire collection object.",
|
||||
"There are several rules for handling incomplete data:",
|
||||
"If <code>prop</code> is <code>\"tracks\"</code> but the album doesn't have a <code>\"tracks\"</code> property, create an empty array before adding the new value to the album's corresponding property.",
|
||||
"If <code>prop</code> is <code>\"tracks\"</code> and <code>value</code> isn't blank, push the <code>value</code> onto the end of the album's existing <code>tracks</code> array.",
|
||||
"If <code>value</code> is blank, delete that property from the album.",
|
||||
"<strong>Hints</strong><br>Use <code>bracket notation</code> when <a href=\"accessing-objects-properties-with-variables\" target=\"_blank\">accessing object properties with variables</a>.",
|
||||
"Push is an array method you can read about on <a href=\"https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/push\">Mozilla Developer Network</a>.",
|
||||
"You may refer back to <a href=\"manipulating-complex-objects\">Manipulating Complex Objects</a>Introducing JavaScript Object Notation (JSON)</a> for a refresher."
|
||||
@ -4991,7 +4990,7 @@
|
||||
"description": [
|
||||
"Random numbers are useful for creating random behavior.",
|
||||
"JavaScript has a <code>Math.random()</code> function that generates a random decimal number between <code>0</code> (inclusive) and not quite up to <code>1</code> (exclusive). Thus <code>Math.random()</code> can return a <code>0</code> but never quite return a <code>1</code>",
|
||||
"<strong>Note</strong><br>Like <a href='storing-values-with-the-assignment-operator' target='_blank'>Storing Values with the Equal Operator</a>, all function calls will be resolved before the <code>return</code> executes, so we can simply <code>return</code> the value of the <code>Math.random()</code> function.",
|
||||
"<strong>Note</strong><br>Like <a href='storing-values-with-the-assignment-operator' target='_blank'>Storing Values with the Equal Operator</a>, all function calls will be resolved before the <code>return</code> executes, so we can <code>return</code> the value of the <code>Math.random()</code> function.",
|
||||
"<h4>Instructions</h4>",
|
||||
"Change <code>randomFraction</code> to return a random number instead of returning <code>0</code>."
|
||||
],
|
||||
|
||||
@ -123,7 +123,7 @@
|
||||
},
|
||||
{
|
||||
"id": "a8e512fbe388ac2f9198f0fa",
|
||||
"title": "Where art thou"
|
||||
"title": "Wherefore art thou"
|
||||
},
|
||||
{
|
||||
"id": "a0b5010f579e69b815e7c5d6",
|
||||
|
||||
@ -44,6 +44,20 @@
|
||||
"Каждое испытание имеет функцию проверки решения, которую вы можете запустить в любой момент нажатием на кнопку \"Run tests\". Как только ваше решение будет удовлетворять всем требованиям, вы сможете перейти к следующему испытанию.",
|
||||
"Для прохождения этого испытания измените текст элемента <code>h1</code> с \"Hello\" на \"Hello World\". Затем нажмите кнопку \"Run tests\"."
|
||||
],
|
||||
"titleFR": "Dites bonjour aux éléments HTML",
|
||||
"descriptionFR": [
|
||||
"Bienvenue au premier défi de code de Free Code Camp.",
|
||||
"Vous pouvez modifier le <code>code</code> dans votre <code>éditeur texte</code>, lequel est disponible dans cette page.",
|
||||
"Voyez-vous le code dans l'éditeur texte qui dit <code><h1>Hello</h1></code>? C'est un <code>élément</code> HTML.",
|
||||
"La plupart des éléments HTML ont une <code>balise ouvrante</code> et une <code>balise fermante</code>",
|
||||
"Les balises ouvrantes ont cette apparence :",
|
||||
"<code><h1></code>",
|
||||
"Les balises fermantes ont cette apparence :",
|
||||
"<code></h1></code>",
|
||||
"Notez que la seule différence entre une balise ouvrante et fermante est que la balise fermante a une barre oblique après son chevron ouvrant.",
|
||||
"Chaque défi contient des tests que vous pouvez éxécuter en cliquant sur le bouton \"Run tests\". Lorsque tous les tests sont réussis, vous pouvez poursuivre avec le défi suivant.",
|
||||
"Pour réussir le test de ce défi, changez le texte de l'élément <code>h1</code> pour \"Hello World\" plutôt que \"Hello\". Cliquez ensuite sur le bouton \"Run tests\"."
|
||||
],
|
||||
"title": "Say Hello to HTML Elements",
|
||||
"description": [
|
||||
"Welcome to Free Code Camp's first coding challenge.",
|
||||
@ -108,6 +122,14 @@
|
||||
"Этот элемент сообщает браузеру о структуре вашего web-сайта. Элементы <code>h1</code> часто применяют в качестве главных заголовков, в то время как элементы <code>h2</code> обычно используют для обозначения позаголовков. Также существуют элементы <code>h3</code>, <code>h4</code>, <code>h5</code> и <code>h6</code> для обозначения отдельных секций.",
|
||||
"Добавьте метку <code>h2</code> с текстом \"CatPhotoApp\" для создания второго HTML <code>элемента</code> под вашим элементом <code>h1</code> с текстом \"Hello World\"."
|
||||
],
|
||||
"titleFR": "Un titre avec l'élément h2",
|
||||
"descriptionFR": [
|
||||
"Pour les quelques prochains défis, nous construirons une application HTML5 qui ressemblera à ceci :",
|
||||
"<a href=\"//i.imgur.com/jOc1JF1.png\" data-lightbox=\"img-enlarge\"><img class=\"img-responsive\" src=\"//i.imgur.com/jOc1JF1.png\" title=\"Cliquez pour agrandir\" alt=\"Une capture écran de notre application de photo de chats\"></a>",
|
||||
"L'élément <code>h2</code> que vous entrerez créera un élément <code>h2</code> sur le site.",
|
||||
"Cet élément renseigne votre navigateur sur la structure de votre site. Les éléments <code>h1</code> sont souvent utilisés comme titre, tandis que les éléments <code>h2</code> sont généralement utilisés comme sous-titres. Il existe également les éléments <code>h3</code>, <code>h4</code>, <code>h5</code> et <code>h6</code> qui indiquent une nouvelle et différente section.",
|
||||
"Ajoutez une balise <code>h2</code> contenant \"CatPhotoApp\" pour créer un second <code>élément</code> HTML sous l'élément <code>h1</code> contenant \"Hello World\"."
|
||||
],
|
||||
"title": "Headline with the h2 Element",
|
||||
"description": [
|
||||
"Over the next few challenges, we'll build an HTML5 app that will look something like this:",
|
||||
@ -160,6 +182,13 @@
|
||||
"<code><p>Я метка p!</p></code>",
|
||||
"Создайте элемент <code>p</code> под вашим элементом <code>h2</code> и присвойте ему текст \"Hello Paragraph\"."
|
||||
],
|
||||
"titleFR": "Informez avec l'élément paragraphe",
|
||||
"descriptionFR": [
|
||||
"L'élément <code>p</code> est le préféré pour les textes de paragraphes de taille normale. P est l'acronyme de \"paragraphe\",",
|
||||
"Vous pouvez créer un élément <code>p</code> comme ceci :",
|
||||
"<code><p>Je suis une balise p!</p></code>",
|
||||
"Créez un élément <code>p</code> sous votre élément <code>h2</code> et inscrivez-y le texte \"Hello Paragraph\"."
|
||||
],
|
||||
"title": "Inform with the Paragraph Element",
|
||||
"description": [
|
||||
"<code>p</code> elements are the preferred element for normal-sized paragraph text on websites. P is short for \"paragraph\".",
|
||||
@ -209,6 +238,13 @@
|
||||
"Вы можете начать комментарий с <code><!--</code> и закончить его <code>--></code>",
|
||||
"Раскомментируйте свои элементы <code>h1</code>, <code>h2</code> и <code>p</code>."
|
||||
],
|
||||
"titleFR": "Décommenter du HTML",
|
||||
"descriptionFR": [
|
||||
"Commenter est une façon de laisser des commentaires dans votre code sans affecter le fonctionnement du code.",
|
||||
"Commenter est aussi un moyen pratique de rendre du code inactif sans devoir le supprimer entièrement.",
|
||||
"Vous pouvez débuter un commentaire avec <code><!--</code> et le terminer avec <code>--></code>.",
|
||||
"Décommenter vos éléments <code>h1</code>, <code>h2</code> et <code>p</code>."
|
||||
],
|
||||
"title": "Uncomment HTML",
|
||||
"description": [
|
||||
"Commenting is a way that you can leave comments within your code without affecting the code itself.",
|
||||
@ -261,6 +297,12 @@
|
||||
"Тут вам необходимо завершить комментарий до начала вашего элемента <code>h2</code>.",
|
||||
"Закомментируйте ваши элементы <code>h1</code> и <code>p</code>, но оставьте ваш элемент <code>h2</code> раскомментированным."
|
||||
],
|
||||
"titleFR": "Commentez du HTML",
|
||||
"descriptionFR": [
|
||||
"Souvenez-vous que pour débuter un commentaire, vous devez utiliser <code><!--</code> et que pour le terminer, vous devez utiliser <code>--></code>.",
|
||||
"Ici vous devrez terminer le commentaire juste avant que l'élément <code>h2</code> commence.",
|
||||
"Commentez les éléments <code>h1</code> et <code>p</code>, mais laissez l'élément <code>h2</code> tel quel."
|
||||
],
|
||||
"title": "Comment out HTML",
|
||||
"description": [
|
||||
"Remember that in order to start a comment, you need to use <code><!--</code> and to end a comment, you need to use <code>--></code>",
|
||||
@ -315,6 +357,13 @@
|
||||
"5 веков довольно долгий период. Так как мы строим приложение CatPhotoApp, давайте используем нечто называемое текстом <code>kitty ipsum</code>.",
|
||||
"Замените текст внутри вашего элемента <code>p</code> первыми двумя словами текста <code>kitty ipsum</code>: <code>Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff.</code>"
|
||||
],
|
||||
"titleFR": "Remplissez les blancs avec du faux-texte",
|
||||
"descriptionFR": [
|
||||
"Les développeurs Web utilisent traditionnellement du <code>lorem ipsum</code> comme texte de substitution. Le texte lorem ipsum provient d'un extrait de Cicero, de la Rome antique.",
|
||||
"Le texte lorem ipsum a été utilisé comme faux-texte par des typographes depuis le 16<sup>ème</sup> siècle et cette tradition se poursuit sur le Web.",
|
||||
"Enfin, 5 siècles est suffisament long. Étant donné que nous fabriquons une application de photos de chats, utilisons plutôt du texte <code>Kitty ipsum</code>.",
|
||||
"Remplacez le texte à l'intérieur des éléments <code>p</code> avec ces quelques mots du texte Kitty ipsum : <code>Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff.</code>"
|
||||
],
|
||||
"title": "Fill in the Blank with Placeholder Text",
|
||||
"description": [
|
||||
"Web developers traditionally use <code>lorem ipsum text</code> as placeholder text. The 'lorem ipsum' text is randomly scraped from a famous passage by Cicero of Ancient Rome.",
|
||||
@ -362,6 +411,12 @@
|
||||
"Давайте удалим некоторые ненужные элементы, чтобы мы могли приступить к созданию приложения CatPhotoApp.",
|
||||
"Удалите ваш <code>h1</code> элемент, чтобы упростить общий вид."
|
||||
],
|
||||
"titleFR": "Supprimer des éléments HTML",
|
||||
"descriptionFR": [
|
||||
"Notre téléphone n'a pas beaucoup d'espace vertical.",
|
||||
"Enlevons les éléments superflus pour débuter la construction de notre application de photos de chats.",
|
||||
"Supprimez l'élément <code>h1</code> afin de simplifier l'affichage."
|
||||
],
|
||||
"title": "Delete HTML Elements",
|
||||
"description": [
|
||||
"Our phone doesn't have much vertical space.",
|
||||
@ -418,6 +473,15 @@
|
||||
"<code><h2 style=\"color: blue\">CatPhotoApp</h2></code>",
|
||||
"Измените стиль вашего элемента <code>h2</code> таким образом, чтобы текст элемента стал красным."
|
||||
],
|
||||
"titleFR": "Changer la couleur du texte",
|
||||
"descriptionFR": [
|
||||
"Changeons maintenant la couleur de quelques-uns de nos textes.",
|
||||
"Nous pouvons le faire en changeant le <code>style</code> de votre élément <code>h2</code>.",
|
||||
"Le style responsable de la couleur de texte d'un élément est \"color\".",
|
||||
"Voici comment changer en bleu la couleur du texte de votre élément <code>h2</code> :",
|
||||
"<code><h2 style=\"color: blue\">CatPhotoApp</h2></code>",
|
||||
"Changez le style de votre élément <code>h2</code> pour que son texte soit de couleur rouge."
|
||||
],
|
||||
"title": "Change the Color of Text",
|
||||
"description": [
|
||||
"Now let's change the color of some of our text.",
|
||||
@ -486,6 +550,18 @@
|
||||
"Обратите внимание, что важно наличие открывающих и закрывающих фигурных скобок (<code>{</code> и <code>}</code>) вокруг стиля каждого элемента. Также вам необходимо убедиться в том, что стиль элемента присвоен внутри элемента <code>style</code>. В завершении, убедитесь, что строка объявления каждого элемента стиля должна заканчиваться точкой с запятой.",
|
||||
"Удалите атрибут стиль вашего элемента <code>h2</code> и взамен создайте CSS-элемент <code>style</code>. Добавьте необходимый CSS, чтобы все элементы <code>h2</code> стали синими."
|
||||
],
|
||||
"titleFR": "Utiliser les sélecteurs CSS pour styliser des éléments",
|
||||
"descriptionFR": [
|
||||
"Avec CSS, il y a des centaines de <code>propriétés</code> que vous pouvez utliser pour changer l'apparence d'un élément dans votre page.",
|
||||
"Quand vous avez entré <code><h2 style=\"color: red\">CatPhotoApp</h2></code>, vous donniez à cet élément <code>h2</code> uniquement, un style <code>inline</code>.",
|
||||
"C'est une des façons d'ajouter un style à un élément, mais une meilleure approche est d'utiliser <code>CSS</code>, acronyme de <code>Cascading Style Sheets</code>.",
|
||||
"Au sommet de votre code, créez un élément <code>style</code> comme ceci :",
|
||||
"<blockquote><style><br></style></blockquote>",
|
||||
"À l'intérieur de cet élément style, vous pouvez créer des <code>sélecteurs CSS</code> pour tous les éléments <code>h2</code>. Par exemple, si vous voulez que tous les éléments <code>h2</code> soient en rouge, votre élément style ressemblerait à ceci :",
|
||||
"<blockquote><style><br> h2 {color: red;}<br></style></blockquote>",
|
||||
"Prenez note qu'il est important d'avoir les accolades ouvrantes et fermantes (<code>{</code> and <code>}</code>) autour de chaque élément de style. Vous devez aussi vous assurer que vos styles se retrouvent entre une balise style ouvrante et fermante. Finalement, assurez-vous d'ajouter un point-virgule â la fin de chacun des styles d'éléments.",
|
||||
"Supprimez les attributs de styles de votre élément <code>h2</code> et créez plutôt un élément de <code>style</code> CSS. Ajoutez le CSS nécessaire pour rendre tous vos éléments <code>h2</code> de couleur bleu."
|
||||
],
|
||||
"title": "Use CSS Selectors to Style Elements",
|
||||
"description": [
|
||||
"With CSS, there are hundreds of CSS <code>properties</code> that you can use to change the way an element looks on your page.",
|
||||
@ -1094,7 +1170,9 @@
|
||||
"<p class=\"red-text\">Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched.</p>"
|
||||
],
|
||||
"tests": [
|
||||
"assert($(\"img\").hasClass(\"smaller-image\"), 'message: Your <code>img</code> element should have the class <code>smaller-image</code>.');",
|
||||
"assert($(\"img\").length === 1, 'message: Your code should only have 1 <code>img</code> tag.');",
|
||||
"assert($(\"img\").attr(\"src\") && $(\"img\").attr(\"src\") === \"https://bit.ly/fcc-relaxing-cat\", 'message: Your <code>img</code> should have a <code>src</code> attribute with a value of <code>https://bit.ly/fcc-relaxing-cat</code>.');",
|
||||
"assert($('img').attr(\"class\") && $(\"img\").attr(\"class\").match(/(^|\\s)smaller-image($|\\s)/), 'message: Your <code>img</code> element should have the class <code>smaller-image</code>.');",
|
||||
"assert($(\"img\").width() === 100, 'message: Your image should be 100 pixels wide. Browser zoom should be at 100%.');"
|
||||
],
|
||||
"type": "waypoint",
|
||||
@ -1634,6 +1712,7 @@
|
||||
"Nest your image within an <code>a</code> element. Here's an example:",
|
||||
"<code><a href=\"#\"><img src=\"https://bit.ly/fcc-running-cats\"></a></code>",
|
||||
"Remember to use <code>#</code> as your <code>a</code> element's <code>href</code> property in order to turn it into a dead link.",
|
||||
"Place the existing image element within an anchor element.",
|
||||
"Once you've done this, hover over your image with your cursor. Your cursor's normal pointer should become the link clicking pointer. The photo is now a link."
|
||||
],
|
||||
"challengeSeed": [
|
||||
@ -4266,7 +4345,7 @@
|
||||
"assert($(\"h1\").hasClass(\"blue-text\"), 'message: Your <code>h1</code> element should have the class <code>blue-text</code>.');",
|
||||
"assert($(\"h1\").attr(\"id\") === \"orange-text\", 'message: Your <code>h1</code> element should have the id of <code>orange-text</code>.');",
|
||||
"assert(code.match(/<h1.*style/gi) && code.match(/<h1.*style.*color\\s*?:/gi), 'message: Your <code>h1</code> element should have the inline style of <code>color: white</code>.');",
|
||||
"assert(code.match(/\\.pink-text\\s*?\\{\\s+color:.*pink.*!important;\\s+\\}/gi), 'message: Your <code>pink-text</code> class declaration should have the <code>!important</code> keyword to override all other declarations.');",
|
||||
"assert(code.match(/\\.pink-text\\s*?\\{[\\s\\S]*?color:.*pink.*!important;[^\\.]*\\}/g), 'message: Your <code>pink-text</code> class declaration should have the <code>!important</code> keyword to override all other declarations.');",
|
||||
"assert($(\"h1\").css(\"color\") === \"rgb(255, 192, 203)\", 'message: Your <code>h1</code> element should be pink.');"
|
||||
],
|
||||
"descriptionPtBR": [
|
||||
|
||||
@ -69,6 +69,16 @@
|
||||
"Füge innerhalb deines <code>script</code> Elements folgenden Code hinzu: <code>$(document).ready(function() {</code>. Schließe ihn danach in der nächsten Zeile (noch immer innerhalb deines <code>script</code> Elements) mit: <code>});</code>",
|
||||
"Wir werden später noch mehr über <code>Funktionen</code> lernen. Wichtig zu wissen ist, dass der Code innerhalb der <code>Funktion</code> ausgeführt wird, sobald der Browser die Seite geladen hat.",
|
||||
"Das ist wichtig, denn ohne deine <code>Document Ready Funktion</code> könnte dein Code ausgeführt werden, bevor das HTML gerendert wurde - was zu Fehlern führen kann."
|
||||
],
|
||||
"titleFr" : "Apprendre comment fonctionnent les balises Script et Document Ready",
|
||||
"descriptionFr": [
|
||||
"Nous sommes maintenant prêt à apprendre jQuery, l'outil Javascript le plus populaire de tout les temps. Ne vous inquiétez pas à propos de JavaScript lui-même, nous y viendrons bientôt.",
|
||||
"Avant de pouvoir utiliser jQuery, nous avons besoin d'ajouter certaines choses à notre HTML.",
|
||||
"Premièrement, ajoutez un élément <code>script</code> en haut de votre page. Assurez-vous de le fermer à la ligne suivante.",
|
||||
"Votre navigateur exécutera JavaScript à l'intérieur de l'élement <code>script</code>, y compris jQuery.",
|
||||
"Á l'intérieur de votre élement <code>script</code>, ajoutez ce code : <code>$(document).ready(function() {</code> à votre <code>script</code>. Puis fermez-le à la ligne suivante (toujours à l'intérieur de votre élement <code>script</code> avec: <code>});</code>",
|
||||
"Nous en apprendrons plus sur les <code>functions</code> plus tard. Le plus important à savoir est que le code à l'intérieur de cette <code>function</code> sera exécuté dès que le navigateur aura chargé votre page.",
|
||||
"Ceci est important car sans votre <code>document ready function</code>, votre code pourrait être exécuté avant que votre HTML soit affiché, ce qui pourrait causer des problèmes."
|
||||
]
|
||||
},
|
||||
{
|
||||
@ -76,11 +86,12 @@
|
||||
"title": "Target HTML Elements with Selectors Using jQuery",
|
||||
"description": [
|
||||
"Now we have a <code>document ready function</code>.",
|
||||
"Now let's write our first jQuery statement. All jQuery functions start with a <code>$</code>, usually referred to as a <code>dollar sign operator</code>, or simply as <code>bling</code>.",
|
||||
"Now let's write our first jQuery statement. All jQuery functions start with a <code>$</code>, usually referred to as a <code>dollar sign operator</code>, or as <code>bling</code>.",
|
||||
"jQuery often selects an HTML element with a <code>selector</code>, then does something to that element.",
|
||||
"For example, let's make all of your <code>button</code> elements bounce. Just add this code inside your document ready function:",
|
||||
"<code>$(\"button\").addClass(\"animated bounce\");</code>",
|
||||
"Note that we've already included both the jQuery library and the Animate.css library in the background so that you can use them in the editor. So you are using jQuery to apply the Animate.css <code>bounce</code> class to your <code>button</code> elements."
|
||||
"Note that we've already included both the jQuery library and the Animate.css library in the background so that you can use them in the editor. So you are using jQuery to apply the Animate.css <code>bounce</code> class to your <code>button</code> elements.",
|
||||
"Additionally make sure to use <code>$(\"button\").addClass(\"animated bounce\");</code> instead of <code>$('button').addClass(\"animated bounce\");</code> since single-quote selectors will not pass our tests."
|
||||
],
|
||||
"challengeSeed": [
|
||||
"fccss",
|
||||
@ -136,6 +147,16 @@
|
||||
"Zum Beispiel, lasse alle deine <code>Button</code> Elemente hüpfen. Dazu musst du nur folgenden Code in deine <code>Document Ready Funktion</code> hinzufügen:",
|
||||
"<code>$(\"button\").addClass(\"animated bounce\");</code>",
|
||||
"Beachte, dass wir bereits jQuery und Animate.css im Hintergrund hinzugefügt haben, damit du diese im Editor nutzen kannst. Du nutzt also jQuery um die <code>bounce</code> Klasse von Animate.css zu deinen <code>Button</code> Elementen hinzuzufügen."
|
||||
],
|
||||
"titleFr": "Cibler des élements HTML par sélecteurs avec jQuery",
|
||||
"descriptionFr" : [
|
||||
"Nous avons maintenant un <code>document ready function</code>.",
|
||||
"Nous allons à présent écrire notre première expression jQuery. Chaque fonction jQuery commence avec un <code>$</code>, habituellement nommé <code>opérateur dollar</code>, ou <code>bling</code>.",
|
||||
"jQuery sélectionne souvent un élément HTML à l'aide d'un <code>selector</code>, puis fait quelque chose à cet élement.",
|
||||
"Par exemple, faisons en sorte que tous nos <code>button</code> rebondissent. Ajoutez juste ce code à l'intérieur de votre <code>$(document).ready(function(){</code>:",
|
||||
"<code>$(\"button\").addClass(\"animated bounce\");</code>",
|
||||
"Notez que nous avons déjà inclus à la fois la librairie jQuery et la librairie Animate.css en amont donc nous pouvons les utiliser dans l'éditeur. Donc, vous utilisez jQuery pour appliquer la classe <code>bounce</code> d'Animate.css à vos éléments <code>button</code>.",
|
||||
"De plus, assurez-vous d'utiliser <code>$(\"button\").addClass(\"animated bounce\");</code> et non <code>$('button').addClass(\"animated bounce\");</code> car les apostrophes ne passeront pas nos tests."
|
||||
]
|
||||
},
|
||||
{
|
||||
@ -206,6 +227,16 @@
|
||||
"Dann nutze die jQuery Funktion <code>.addClass()</code> um die Klassen <code>animated</code> und <code>shake</code> hinzuzufügen.",
|
||||
"Zum Beispiel könntest du alle Elemente mit der Klasse <code>text-primary</code> schütteln lassen, indem du folgendes zu deiner <code>Document Ready Funktion</code> hinzufügst:",
|
||||
"<code>$(\".text-primary\").addClass(\"animated shake\");</code>"
|
||||
],
|
||||
"titleFr" : "Cibler les élements par Classe avec jQuery",
|
||||
"descriptionFr" : [
|
||||
"Voyez comment nous avons fait rebondir tous nos éléments <code>button</code>? Nous les avons sélectionné avec <code>$(\"button\")</code>, puis nous leur avons ajouté des classes CSS avec <code>.addClass(\"animated bounce\");</code>.",
|
||||
"Vous venez d'utiliser la fonction jQuery <code>.addClass()</code>, ce qui nous permet d'ajouter des classes aux éléments.",
|
||||
"Tout d'abord, ciblons nos éléments <code>div</code> qui ont la classe <code>well</code> en utilisant le sélecteur <code>$(\".well\")</code>.",
|
||||
"Notez que, tout comme les expressions CSS, vous ajoutez un <code>.</code> avant le nom de la classe.",
|
||||
"Puis, vous utilisez la fonction jQuery <code>.addClass()</code> pour ajouter les classes <code>animated</code> et <code>shake</code>.",
|
||||
"Par exemple, vous pouvez faire en sorte que tous les éléments avec la classe <code>text-primary</code> s'agitent en ajoutant le code suivant à votre <code>document ready function</code>:",
|
||||
"<code>$(\".text-primary\").addClass(\"animated shake\");</code>"
|
||||
]
|
||||
},
|
||||
{
|
||||
@ -276,6 +307,15 @@
|
||||
"Dann nutze die jQuery Funktion <code>.addClass()</code> um die Klassen <code>animated</code> und <code>fadeOut</code> hinzuzufügen.",
|
||||
"So könntest du das <code>Button</code> Element mit der ID <code>target6</code> ausblenden lassen:",
|
||||
"<code>$(\"#target6\").addClass(\"animated fadeOut\")</code>."
|
||||
],
|
||||
"titleFr" : "Cibler les éléments par ID avec jQuery",
|
||||
"descriptionFr" : [
|
||||
"Vous pouvez également cibler les éléments à l'aide de leurs attributs id.",
|
||||
"Premièrement, cibler votre élément <code>button</code> avec l'id <code>target3</code> en utilisant le sélecteur <code>$(\"#target\")</code>.",
|
||||
"Notez que, tout comme les expressions CSS, vous ajoutez un <code>#</code> avant le nom de l'id.",
|
||||
"Puis, utilisez la fonction jQuery <code>.addClass()</code> afin d'ajouter les classes <code>animated</code> et <code>fadeOut</code>.",
|
||||
"Voici comment vous pouvez faire en sorte que l'élément <code>button</code> avec l'id <code>target6</code> disparaisse en fondu:",
|
||||
"<code>$(\"#target6\").addClass(\"animated fadeOut\")</code>."
|
||||
]
|
||||
},
|
||||
{
|
||||
@ -337,6 +377,11 @@
|
||||
"descriptionDe": [
|
||||
"Anfangs waren diese Animationen noch cool, jetzt sind sie aber ein wenig störend.",
|
||||
"Lösche alle drei jQuery Funktionen deiner <code>Document Ready Funktion</code>, aber lasse die <code>Document Ready Funktion</code> selbst intakt."
|
||||
],
|
||||
"titleFr" : "Effacer vos fonctions jQuery",
|
||||
"descriptionFr" : [
|
||||
"Ces animations sont sympathiques à première vue, mais maintenant elles deviennent plutôt distrayantes.",
|
||||
"Effacez les trois fonctions jQuery de votre <code>document ready function</code>, mais laissez votre <code>document ready function</code> lui-même intact."
|
||||
]
|
||||
},
|
||||
{
|
||||
@ -344,10 +389,12 @@
|
||||
"title": "Target the same element with multiple jQuery Selectors",
|
||||
"description": [
|
||||
"Now you know three ways of targeting elements: by type: <code>$(\"button\")</code>, by class: <code>$(\".btn\")</code>, and by id <code>$(\"#target1\")</code>.",
|
||||
"Although it is possible to add multiple classes in a single <code>.addClass()</code> call, let's add them to the same element in <em>three separate ways</em>.",
|
||||
"Using <code>.addClass()</code>, add only one class at a time to the same element, three different ways:",
|
||||
"Add the <code>animated</code> class to all elements with type <code>button</code>.",
|
||||
"Add the <code>shake</code> class to all the buttons with class <code>.btn</code>.",
|
||||
"Add the <code>btn-primary</code> class to the button with id <code>#target1</code>."
|
||||
"Add the <code>btn-primary</code> class to the button with id <code>#target1</code>.",
|
||||
"<strong>Note</strong><br>You should only be targeting one element and adding only one class at a time. Altogether, your three individual selectors will end up adding the three classes <code>shake</code>, <code>animated</code>, and <code>btn-primary</code> to <code>#target1</code>."
|
||||
],
|
||||
"challengeSeed": [
|
||||
"fccss",
|
||||
@ -407,6 +454,14 @@
|
||||
"Füge die Klasse <code>animated</code> zu allen Elementen des Typs <code>button</code> hinzu.",
|
||||
"Füge die Klasse <code>shake</code> zu allen Buttons mit der Klasse <code>.btn</code> hinzu.",
|
||||
"Füge die Klasse <code>btn-primary</code> zu dem Button mit der ID <code>#target1</code> hinzu."
|
||||
],
|
||||
"titleFr" : "Cibler le même élément avec plusieurs sélecteurs jQuery",
|
||||
"descriptionFr" : [
|
||||
"À présent, vous connaissez trois façons de cibler les éléments: par type: <code>$(\"button\")</code>, par classe: <code>$(\".btn\")</code>, et par id <code>$(\"#target1\")</code>.",
|
||||
"En utilisant <code>.addClass()</code>, ajoutez uniquement une classe à la fois au même élément, de trois façons différentes:",
|
||||
"Ajoutez la classe <code>animated</code> à tous les éléments de type <code>button</code>.",
|
||||
"Ajoutez la classe <code>shake</code> à tous les boutons qui ont la classe <code>.btn</code>.",
|
||||
"Ajoutez la classe <code>btn-primary</code> au bouton qui a l'id <code>#target1</code>."
|
||||
]
|
||||
},
|
||||
{
|
||||
@ -472,6 +527,13 @@
|
||||
"So könntest du das bei einem spezifischen Button machen:",
|
||||
"<code>$(\"#target2\").removeClass(\"btn-default\");</code>",
|
||||
"Lass uns alle <code>btn-default</code> Klassen von unseren <code>Button</code> Elementen entfernen."
|
||||
],
|
||||
"titleFr" : "Supprimer des classes d'un élément avec jQuery",
|
||||
"descriptionFr" : [
|
||||
"De la même façon que vous pouvez ajouter des classes à un élément avec la fonction jQuery <code>addClass()</code>, vous pouvez les supprimer avec la fonction jQuery <code>removeClass()</code>.",
|
||||
"Voici comment procéder pour un bouton spécifique:",
|
||||
"<code>$(\"#target2\").removeClass(\"btn-default\");",
|
||||
"Supprimons la classe <code>btn-default</code> de tous nos éléments <code>button</code>."
|
||||
]
|
||||
},
|
||||
{
|
||||
@ -546,6 +608,16 @@
|
||||
"Das ist ein wenig anders als eine normale CSS-Deklaration, weil die CSS-Eigenschaft und deren Wert in Anführungszeichen sind und durch ein Komma anstatt eines Doppelpunkts getrennt werden.",
|
||||
"Lösche deine jQuery Selektoren, damit eine leere <code>Document Ready Funktion</code> übrig bleibt.",
|
||||
"Wähle <code>target1</code> und ändere dessen Farbe zu Rot."
|
||||
],
|
||||
"titleFr" : "Changer le CSS d'un élément en utilisant jQuery",
|
||||
"descriptionFr" : [
|
||||
"Nous pouvons aussi changer le CSS d'un élément HTML directement avec jQuery.",
|
||||
"jQuery dispose d'une fonction appelée <code>.css()</code> qui vous permet de changer le CSS d'un élément.",
|
||||
"Voici comment changer sa couleur en bleu:",
|
||||
"<code>$(\"#target1\").css(\"color\", \"blue\");",
|
||||
"Ceci est légèrement différent d'une expression CSS normale, car la propriété CSS et sa valeur sont entre guillemets, et separées par une virgule au lieu de deux points.",
|
||||
"Effacez vos sélecteurs jQuery, laissant votre <code>document ready function</code> vide.",
|
||||
"Sélectionnez <code>target1</code> et changez sa couleur en rouge."
|
||||
]
|
||||
},
|
||||
{
|
||||
@ -615,6 +687,24 @@
|
||||
"So kannst du alle <code>Buttons</code> deaktivieren:",
|
||||
"<code>$(\"button\").prop(\"disabled\", true);</code>",
|
||||
"Deaktiviere nur den <code>target1</code> Button."
|
||||
],
|
||||
"titleFr" : "Désactivez un élément en utilisant jQuery",
|
||||
"descriptionFr" : [
|
||||
"Vous pouvez également changer les propriétés non-CSS des éléments HTML avec jQuery. Par exemple, vous pouvez désactiver les boutons.",
|
||||
"Lorsque vous désactivez un bouton, il devient gris et on ne peut plus cliquer dessus.",
|
||||
"jQuery dispose d'une fonction appelée <code>.prop()</code> qui vous permet de modifier les propriétés des éléments.",
|
||||
"Voici comment vous pouvez désactiver tous les boutons:",
|
||||
"<code>$(\"button\").prop(\"disabled\", true);</code>",
|
||||
"Désactivez uniquement le bouton <code>target1</code>"
|
||||
],
|
||||
"titleFr" : "Changer le texte à l'intérieur d'un élément en utilisant jQuery",
|
||||
"descriptionFr" : [
|
||||
"En utilisant jQuery, vous pouvez changer le texte entre les balises ouvrante et fermante d'un élément. Vous pouvez même changer les balises HTML.",
|
||||
"jQuery dispose d'une fonction appelée <code>.html()</code> qui vous permet d'ajouter des balises HTML et du texte à l'intérieur d'un élément. Tout le contenu de l'élément sera alors remplacé par le contenu que vous indiquerez en utilisant la fonction.",
|
||||
"Voici comment vous pourriez ré-écrire et mettre en italique le texte de notre titre:",
|
||||
"<code>$(\"h3\").html(\"<em>jQuery Playground</em>\");",
|
||||
"jQuery dispose également d'une fonction similaire appelée <code>.text()</code> qui change uniquement le texte sans ajouter de balises. Autrement dit, cette fonction n'évaluera aucune balise HTML que vous lui donnez, mais les traitera comme du texte que vous désirez ajouter à votre élément.",
|
||||
"Changez le bouton avec l'id <code>target4</code> en mettant en italique son texte."
|
||||
]
|
||||
},
|
||||
{
|
||||
|
||||
@ -175,11 +175,11 @@
|
||||
"</div>"
|
||||
],
|
||||
"tests": [
|
||||
"assert(code.match(/\\$\\s*?\\(\\s*?(\\\"|\\')\\#getMessage(\\\"|\\')\\s*?\\)\\s*?\\.\\s*?on\\s*?\\(\\s*?(\\\"|\\')click(\\\"|\\')\\s*?\\,\\s*?function\\s*?\\(\\s*?\\)\\s*?\\{/gi), 'message: You should have a click handler on the <code>getMessage</code> button to trigger the AJAX request.');",
|
||||
"assert(code.match(/\\s*?\\}\\s*?\\)\\s*?\\;/gi), 'message: You should have at least one closing set of brackets and parenthesis.');",
|
||||
"assert(code.match(/\\s*?\\}\\s*?\\)\\s*?\\;/gi) && code.match(/\\,\\s*?function\\s*?\\(\\s*?\\w*?\\s*?\\)\\s*?\\{/gi) && code.match(/\\s*?\\}\\s*?\\)\\s*?\\;/gi).length === code.match(/\\s*?function\\s*?\\(\\s*?\\w*?\\s*?\\)\\s*?\\{/gi).length, 'message: Each callback function should have a closing set of brackets and parenthesis.');",
|
||||
"assert(code.match(/\\$\\s*?\\.\\s*?getJSON\\s*?\\(\\s*?(\\\"|\\')\\/json\\/cats\\.json(\\\"|\\')\\s*?\\,\\s*?function\\s*?\\(\\s*?json\\s*?\\)\\s*?\\{/gi), 'message: You should be making use of the <code>getJSON</code> method given in the description to load data from the JSON file.');",
|
||||
"assert(code.match(/\\$\\s*?\\(\\s*?(\\\"|\\')\\.message(\\\"|\\')\\s*?\\)\\s*?\\.\\s*?html\\s*?\\(\\s*?JSON\\s*?\\.\\s*?stringify\\s*?\\(\\s*?json\\s*?\\)\\s*?\\)/gi), 'message: Don't forget to make the <code>.html</code> change the contents of the message box so that it contains the result of the <code>getJSON</code>.');"
|
||||
"assert(code.match(/\\$\\s*?\\(\\s*?(\\\"|\\')\\#getMessage(\\\"|\\')\\s*?\\)\\s*?\\.\\s*?on\\s*?\\(\\s*?(\\\"|\\')click(\\\"|\\')\\s*?\\,\\s*?function\\s*?\\(\\s*?\\)\\s*?\\{/g), 'message: You should have a click handler on the <code>getMessage</code> button to trigger the AJAX request.');",
|
||||
"assert(code.match(/\\s*?\\}\\s*?\\)\\s*?\\;/g), 'message: You should have at least one closing set of brackets and parenthesis.');",
|
||||
"assert(code.match(/\\s*?\\}\\s*?\\)\\s*?\\;/g) && code.match(/\\,\\s*?function\\s*?\\(\\s*?[A-Za-z_\\$]?\\w*?\\s*?\\)\\s*?\\{/g) && code.match(/\\s*?\\}\\s*?\\)\\s*?\\;/g).length === code.match(/\\s*?function\\s*?\\(\\s*?[A-Za-z_\\$]?\\w*?\\s*?\\)\\s*?\\{/g).length, 'message: Each callback function should have a closing set of brackets and parenthesis.');",
|
||||
"assert(code.match(/\\$\\s*?\\.\\s*?getJSON\\s*?\\(\\s*?(\\\"|\\')\\/json\\/cats\\.json(\\\"|\\')\\s*?\\,\\s*?function\\s*?\\(\\s*?[A-Za-z_\\$]\\w*\\s*?\\)\\s*?\\{/g), 'message: You should be making use of the <code>getJSON</code> method given in the description to load data from the JSON file.');",
|
||||
"assert(code.match(/\\$\\s*?\\.\\s*?getJSON\\s*?\\(\\s*?(\\\"|\\')\\/json\\/cats\\.json(\\\"|\\')\\s*?\\,\\s*?function\\s*?\\(\\s*?([A-Za-z_\\$]\\w*)\\s*?\\)\\s*?{/g) && /\\$\\s*?\\.\\s*?getJSON\\s*?\\(\\s*?(\\\"|\\')\\/json\\/cats\\.json(\\\"|\\')\\s*?,\\s*?function\\s*?\\(([A-Za-z_\\$]\\w*)\\s*?\\)/g.exec(code)[3] === /\\$\\(\\s*?(\\\"|\\')\\.message\\s*?(\\\"|\\')\\s*?\\)\\s*?\\.html\\s*?\\(\\s*?JSON\\s*?\\.\\s*?stringify\\s*?\\(\\s*?([A-Za-z_\\$]\\w*)\\s*?\\)\\s*?\\)/g.exec(code)[3], 'message: Don't forget to make the <code>.html</code> change the contents of the message box so that it contains the result of the <code>getJSON</code>.');"
|
||||
],
|
||||
"type": "waypoint",
|
||||
"challengeType": 0,
|
||||
@ -447,7 +447,8 @@
|
||||
"You will see a prompt to allow or block this site from knowing your current location. The challenge can be completed either way, as long as the code is correct.",
|
||||
"By selecting allow you will see the text on the output phone change to your latitude and longitude",
|
||||
"Here's some code that does this:",
|
||||
"<blockquote>if (navigator.geolocation) {<br> navigator.geolocation.getCurrentPosition(function(position) {<br> $(\"#data\").html(\"latitude: \" + position.coords.latitude + \"<br>longitude: \" + position.coords.longitude);<br> });<br>}</blockquote>"
|
||||
"<blockquote>if (navigator.geolocation) {<br> navigator.geolocation.getCurrentPosition(function(position) {<br> $(\"#data\").html(\"latitude: \" + position.coords.latitude + \"<br>longitude: \" + position.coords.longitude);<br> });<br>}</blockquote>",
|
||||
"Don't forget to use double quotes around selectors as mentioned <a href='/challenges/target-html-elements-with-selectors-using-jquery'>here.</a>"
|
||||
],
|
||||
"challengeSeed": [
|
||||
"fccss",
|
||||
|
||||
@ -104,7 +104,9 @@ export default function commit(app) {
|
||||
req.flash('info', {
|
||||
msg: dedent`
|
||||
Looks like you already have a pledge to ${pledge.displayName}.
|
||||
Hitting commit here will replace your old commitment.
|
||||
Clicking "Commit" here will replace your old commitment. If you
|
||||
do change your commitment, please remember to cancel your
|
||||
previous recurring donation directly with ${pledge.displayName}.
|
||||
`
|
||||
});
|
||||
}
|
||||
@ -169,7 +171,8 @@ export default function commit(app) {
|
||||
msg: dedent`
|
||||
Congratulations, you have committed to giving
|
||||
${displayName} $${amount} each month until you have completed
|
||||
your ${goal}.
|
||||
your ${goal}. Please remember to cancel your pledge directly
|
||||
with ${displayName} once you finish.
|
||||
`
|
||||
});
|
||||
res.redirect('/' + user.username);
|
||||
@ -217,11 +220,18 @@ export default function commit(app) {
|
||||
})
|
||||
.subscribe(
|
||||
pledge => {
|
||||
let msg = 'You have successfully stopped your pledge.';
|
||||
let msg = dedent`
|
||||
You have successfully stopped your pledge. Please
|
||||
rememberto cancel your recurring donation directly
|
||||
with the nonprofit if you haven't already done so.
|
||||
`;
|
||||
if (!pledge) {
|
||||
msg = `No pledge found for user ${user.username}.`;
|
||||
msg = dedent`
|
||||
It doesn't look like you had an active pledge, so
|
||||
there's no pledge to stop.
|
||||
`;
|
||||
}
|
||||
req.flash('errors', { msg });
|
||||
req.flash('info', { msg });
|
||||
return res.redirect(`/${user.username}`);
|
||||
},
|
||||
next
|
||||
|
||||
@ -164,12 +164,16 @@ block content
|
||||
td.col-xs-2.hidden-xs= challenge.completedDate ? challenge.completedDate : 'Not Available'
|
||||
td.col-xs-2.hidden-xs= challenge.lastUpdated ? challenge.lastUpdated : ''
|
||||
td.col-xs-2.hidden-xs
|
||||
if (challenge.solution)
|
||||
if (challenge.solution && challenge.name)
|
||||
a(href='/challenges/' + removeOldTerms(challenge.name) + '?solution=' + encodeURIComponent(encodeFcc(challenge.solution)), target='_blank') View solution
|
||||
else
|
||||
else if (challenge.name)
|
||||
a(href='/challenges/' + removeOldTerms(challenge.name)) View this challenge
|
||||
td.col-xs-12.visible-xs
|
||||
if (challenge.solution)
|
||||
a(href='/challenges/' + removeOldTerms(challenge.name) + '?solution=' + encodeURIComponent(encodeFcc(challenge.solution)), target='_blank')= removeOldTerms(challenge.name)
|
||||
else
|
||||
span N/A
|
||||
td.col-xs-12.visible-xs
|
||||
if (challenge.solution && challenge.name)
|
||||
a(href='/challenges/' + removeOldTerms(challenge.name) + '?solution=' + encodeURIComponent(encodeFcc(challenge.solution)), target='_blank')= removeOldTerms(challenge.name)
|
||||
else if (challenge.name)
|
||||
a(href='/challenges/' + removeOldTerms(challenge.name))= removeOldTerms(challenge.name)
|
||||
else
|
||||
span N/A
|
||||
|
||||
@ -6,7 +6,7 @@ block content
|
||||
link(rel='stylesheet', href='/css/ubuntu.css')
|
||||
include ../partials/flyer
|
||||
.row
|
||||
.col-md-4.col-lg-3
|
||||
.col-md-4
|
||||
.scroll-locker(id = "scroll-locker")
|
||||
.innerMarginFix(style=' width: 99%')
|
||||
#testCreatePanel
|
||||
@ -56,7 +56,7 @@ block content
|
||||
#testSuite
|
||||
br
|
||||
|
||||
.col-md-8.col-lg-9
|
||||
.col-md-8
|
||||
.editorScrollDiv(style = "overflow-y: auto; overflow-x: hidden;")
|
||||
#mainEditorPanel
|
||||
form.code
|
||||
|
||||
@ -6,7 +6,7 @@ block content
|
||||
link(rel='stylesheet', href='/css/ubuntu.css')
|
||||
include ../partials/flyer
|
||||
.row
|
||||
.col-md-4.col-lg-3
|
||||
.col-md-4
|
||||
.scroll-locker(id = "scroll-locker")
|
||||
.innerMarginFix(style = "width: 99%;")
|
||||
#testCreatePanel
|
||||
@ -56,7 +56,7 @@ block content
|
||||
br
|
||||
#testSuite
|
||||
br
|
||||
.col-md-8.col-lg-9
|
||||
.col-md-8
|
||||
.editorScrollDiv(style = "overflow-y: auto; overflow-x: hidden;")
|
||||
#mainEditorPanel
|
||||
form.code
|
||||
|
||||
@ -1,40 +1,38 @@
|
||||
extends layout
|
||||
block content
|
||||
.text-center
|
||||
h1.landing-heading Learn to code and help nonprofits.
|
||||
.spacer
|
||||
.row
|
||||
h1.landing-heading Learn to code and help nonprofits
|
||||
.big-break
|
||||
.big-break
|
||||
.big-break
|
||||
.col-xs-12.col-sm-12.col-md-3
|
||||
.col-xs-12.col-sm-12.col-md-4
|
||||
img.img-responsive.landing-icon.img-center(src= 'https://s3.amazonaws.com/freecodecamp/landingIcons_connect.svg', alt='Get great references and connections to start your software engineer career')
|
||||
p.large-p Join a community of 400,000+ developers.
|
||||
.col-xs-12.col-sm-12.col-md-3
|
||||
img.img-responsive.landing-icon.img-center(src= 'https://s3.amazonaws.com/freecodecamp/landingIcons_learn.svg', alt='Learn to code and learn full stack JavaScript')
|
||||
p.large-p Work on coding challenges together.
|
||||
.col-xs-12.col-sm-12.col-md-3
|
||||
img.img-responsive.landing-icon.img-center(src= 'https://s3.amazonaws.com/freecodecamp/landingIcons_portfolio.svg', alt='Build a portfolio of apps for nonprofits')
|
||||
p.large-p Build a portfolio of apps that solve real problems.
|
||||
.col-xs-12.col-sm-12.col-md-3
|
||||
img.img-responsive.landing-icon.img-center(src= 'https://s3.amazonaws.com/freecodecamp/landingIcons_nonprofits.svg', alt='Empower nonprofits with code')
|
||||
p.large-p Empower nonprofits with code.
|
||||
.big-break
|
||||
.big-break
|
||||
p.large-p
|
||||
a(href='/map') 17,000,000+
|
||||
|  coding challenges solved
|
||||
.col-xs-12.col-sm-12.col-md-4
|
||||
img.img-responsive.landing-icon.img-center(src= 'https://s3.amazonaws.com/freecodecamp/landingIcons_nonprofits.svg', alt='Help nonprofits with bro bono code projects')
|
||||
p.large-p
|
||||
a(href='/nonprofits') $1,000,000+
|
||||
|  in donated development work
|
||||
.col-xs-12.col-sm-12.col-md-4
|
||||
img.img-responsive.landing-icon.img-center(src= 'https://s3.amazonaws.com/freecodecamp/landingIcons_portfolio.svg', alt='Get hired as a developer and start your software engineer career')
|
||||
p.large-p
|
||||
a(href='/stories') 2,000+
|
||||
|  campers now have developer jobs
|
||||
.big-break
|
||||
.big-break
|
||||
.row
|
||||
.col-xs-12.col-sm-8.col-sm-offset-2
|
||||
a.btn.btn-cta.signup-btn.btn-block(href="/signin") Start coding (it's free)
|
||||
.button-spacer
|
||||
a.btn.btn-lg.btn-primary.btn-primary-ghost.btn-block(href="/nonprofits") My nonprofit needs coding help
|
||||
.spacer
|
||||
h2 As featured in:
|
||||
img.img-center.img-responsive(src='https://s3.amazonaws.com/freecodecamp/as-seen-on.png')
|
||||
.spacer
|
||||
hr
|
||||
.spacer
|
||||
h2 Launch your career as a software engineer:
|
||||
h2 Launch your developer career
|
||||
.spacer
|
||||
.row
|
||||
.col-xs-12.col-sm-12.col-md-4
|
||||
@ -50,14 +48,9 @@ block content
|
||||
p.testimonial-copy I started Free Code Camp with zero knowledge of web development. 6 months later, I landed my first job as a back end engineer.
|
||||
h3 - Maxim Orlov
|
||||
.spacer
|
||||
.row
|
||||
.col-xs-12.col-sm-8.col-sm-offset-2
|
||||
a.btn.btn-lg.btn-primary.btn-primary-ghost.btn-block(href='/stories') Hear from more of our campers
|
||||
.spacer
|
||||
.spacer
|
||||
hr
|
||||
.spacer
|
||||
h2 Skills you'll learn:
|
||||
h2 Learn powerful skills
|
||||
.spacer
|
||||
.row
|
||||
.text-center.negative-35
|
||||
|
||||
@ -4,7 +4,7 @@ html(lang='en')
|
||||
include partials/meta
|
||||
include partials/stylesheets
|
||||
if showAside
|
||||
body.map-aside-body
|
||||
body.map-aside-body(class=theme !== 'default' ? theme : '')
|
||||
include partials/scripts
|
||||
block content
|
||||
else
|
||||
|
||||
@ -3,7 +3,7 @@ html(lang='en')
|
||||
head
|
||||
include partials/meta
|
||||
include partials/stylesheets
|
||||
body.top-and-bottom-margins
|
||||
body.top-and-bottom-margins(class=theme !== 'default' ? theme : '')
|
||||
include partials/scripts
|
||||
include partials/navbar
|
||||
include partials/flash
|
||||
|
||||
@ -23,7 +23,7 @@ block content
|
||||
| to nonprofits
|
||||
.row
|
||||
.col-xs-12.col-sm-10.col-sm-offset-1.col-md-6.col-md-offset-3
|
||||
h2.text-center Certifications
|
||||
h2.text-center Certificates
|
||||
hr
|
||||
ul.population-table
|
||||
li.nowrap
|
||||
@ -117,7 +117,7 @@ block content
|
||||
td.text-center
|
||||
i.fa.fa-comment
|
||||
td
|
||||
a(href="/stories") Stories from campers who've become professional software engineers
|
||||
a(href="/stories") Stories from campers who've become professional software developers
|
||||
.spacer
|
||||
.row
|
||||
.col-xs-12.col-sm-10.col-sm-offset-1.col-md-6.col-md-offset-3
|
||||
@ -127,35 +127,31 @@ block content
|
||||
<h4>What is Free Code Camp?</h4>
|
||||
<p class="negative-15">We’re an open source community that helps you learn to code.</p>
|
||||
<h4>How do you help me learn to code?</h4>
|
||||
<p class="negative-15">You can work through our self-paced coding challenges, build projects, and earn certifications. We also connect you with people in your city so you can code together.</p>
|
||||
<h4>Can Free Code Camp help me get a job as a software engineer?</h4>
|
||||
<p class="negative-15">Yes. Hundreds of people have gotten software engineering jobs after completing our coding challenges.</p>
|
||||
<p class="negative-15">You can work through our self-paced coding challenges, build projects, and earn certificates. We also connect you with people in your city so you can code together.</p>
|
||||
<h4>Can Free Code Camp help me get a job as a software developer?</h4>
|
||||
<p class="negative-15">Yes. Thousands of people have gotten software developer jobs after joining our open source community.</p>
|
||||
<h4>Is Free Code Camp a coding bootcamp?</h4>
|
||||
<p class="negative-15">No. A lot of coding bootcamps use Free Code Camp as part of their curriculum, though.</p>
|
||||
<h4>Is Free Code Camp really free?</h4>
|
||||
<p class="negative-15">Yes. Our curriculum, nonprofit projects, and verified certifications are all free.</p>
|
||||
<h4>Which certifications does Free Code Camp offer?</h4>
|
||||
<p class="negative-15">We offer four free verified certifications: front end development, back end development, data visualization, and full stack development.</p>
|
||||
<p class="negative-15">Yes. Our curriculum, nonprofit projects, and verified certificates are all free.</p>
|
||||
<h4>How can I help nonprofits through Free Code Camp?</h4>
|
||||
<p class="negative-15">Once you finish the first three certifications, you’ll get to build a series of solutions for nonprofits. You’ll work in pairs, under the supervision of a volunteer project manager and a stakeholder from the nonprofit.</p>
|
||||
<p class="negative-15">Once you finish the first 1,200 hours of challenges, you’ll get to build a series of solutions for nonprofits. You’ll work in pairs, under the supervision of a volunteer project manager and a stakeholder from the nonprofit.</p>
|
||||
<h4>How much money has Free Code Camp saved nonprofits?</h4>
|
||||
<p class="negative-15">Our community has done nearly a million dollars worth of pro-bono coding for nonprofits so far.</p>
|
||||
<h4>Is there a way I can help nonprofits before I earn my certifications?</h4>
|
||||
<p class="negative-15">Yes. You can <a href="/commit">pledge a monthly donation to a nonprofit of your choosing</a> while you learn.</p>
|
||||
<p class="negative-15">Our community has donated more than a million dollars worth of pro-bono coding for nonprofits so far.</p>
|
||||
<h4>Is there a way I can help nonprofits before I earn my certificates?</h4>
|
||||
<p class="negative-15">Yes. You can <a href="/commit">pledge a monthly donation</a> to a nonprofit of your choosing while you learn.</p>
|
||||
<h4>How long does Free Code Camp take?</h4>
|
||||
<p class="negative-15">It takes about 2,080 hours to earn all four of our certifications. This translates into one year of full-time coding. We’re completely self-paced though, so take as long as you need.</p>
|
||||
<p class="negative-15">It takes about 2,080 hours to complete our Full Stack Developer certificate. This translates into one year of full-time coding. We’re completely self-paced though, so take as long as you need.</p>
|
||||
<h4>Is Free Code Camp a replacement for a 4-year degree?</h4>
|
||||
<p class="negative-15">No. Please don’t drop out of college just to pursue Free Code Camp. You can pursue both concurrently. Even though you don’t need a 4-year degree to work as a software engineer, it still helps a lot.</p>
|
||||
<p class="negative-15">No. Please don’t drop out of college just to pursue Free Code Camp. You can pursue both concurrently. Even though you don’t need a 4-year degree to work as a software developer, it still helps a lot.</p>
|
||||
<h4>I'm a teacher. Is Free Code Camp an appropriate resource for my class?</h4>
|
||||
<p class="negative-15">Yes. Many high school, college, and adult ed programs incorporate Free Code Camp into their coursework. We're open source, so no licenses or special permission from us is necessary. We're even building special tools for teachers.</p>
|
||||
<p class="negative-15">Yes. Many high school, college, and adult ed programs incorporate Free Code Camp into their coursework. We're open source, so no license or special permission from us is necessary. We're even building special tools for teachers.</p>
|
||||
<h4>Should I complete all of these challenges in order?</h4>
|
||||
<p class="negative-15">We’ve put a lot of thought into how we introduce concepts. But you’re free to jump around.</p>
|
||||
<h4>Do I have to use CodePen for the front end projects?</h4>
|
||||
<p class="negative-15">As long as your code is publicly viewable, and you have a live demo, you can use whatever you want.</p>
|
||||
<h4>When will you release the additional React, Sass, and D3 challenges?</h4>
|
||||
<p class="negative-15">We’ll release these in Summer 2016. In the meantime, other people have completed our React/Sass and D3 projects by referencing their official documentation.</p>
|
||||
<h4>How can I hire Free Code Camp alumni?</h4>
|
||||
<p class="negative-15">You can reach out to them through our <a href="https://www.linkedin.com/edu/school?id=166029" target="_blank">alumni network</a>.</p>
|
||||
<h4>How did Free Code Camp get started?</h4>
|
||||
<p class="negative-15"><a href="https://www.quora.com/profile/Quincy-Larson" target="_blank">Quincy</a> started our open source community in 2014. He is now just one of many active contributors.</p>
|
||||
<h4>How is Free Code Camp incorporated?</h4>
|
||||
@ -248,3 +244,7 @@ block content
|
||||
td Local groups
|
||||
td
|
||||
a(href='https://gitter.im/Hallaathrad' target='_blank') @Hallaathrad
|
||||
tr
|
||||
td Forum
|
||||
td
|
||||
a(href='https://gitter.im/m-henderson' target='_blank') @m-henderson
|
||||
|
||||
Reference in New Issue
Block a user