Merge pull request #3561 from FreeCodeCamp/remove-difficulty
remove vestigial difficulty attribute from challenges
This commit is contained in:
@ -5,7 +5,6 @@
|
|||||||
{
|
{
|
||||||
"id": "aff0395860f5d3034dc0bfc9",
|
"id": "aff0395860f5d3034dc0bfc9",
|
||||||
"title": "Validate US Telephone Numbers",
|
"title": "Validate US Telephone Numbers",
|
||||||
"difficulty": "4.01",
|
|
||||||
"description": [
|
"description": [
|
||||||
"Return true if the passed string is a valid US phone number",
|
"Return true if the passed string is a valid US phone number",
|
||||||
"The user may fill out the form field any way they choose as long as it is a valid US number. The following are all valid formats for US numbers:",
|
"The user may fill out the form field any way they choose as long as it is a valid US number. The following are all valid formats for US numbers:",
|
||||||
@ -71,7 +70,6 @@
|
|||||||
{
|
{
|
||||||
"id": "a3f503de51cf954ede28891d",
|
"id": "a3f503de51cf954ede28891d",
|
||||||
"title": "Symmetric Difference",
|
"title": "Symmetric Difference",
|
||||||
"difficulty": "4.02",
|
|
||||||
"description": [
|
"description": [
|
||||||
"Create a function that takes two or more arrays and returns an array of the symmetric difference of the provided arrays.",
|
"Create a function that takes two or more arrays and returns an array of the symmetric difference of the provided arrays.",
|
||||||
"The mathematical term symmetric difference refers to the elements in two sets that are in either the first or second set, but not in both.",
|
"The mathematical term symmetric difference refers to the elements in two sets that are in either the first or second set, but not in both.",
|
||||||
@ -110,7 +108,6 @@
|
|||||||
{
|
{
|
||||||
"id": "aa2e6f85cab2ab736c9a9b24",
|
"id": "aa2e6f85cab2ab736c9a9b24",
|
||||||
"title": "Exact Change",
|
"title": "Exact Change",
|
||||||
"difficulty": "4.03",
|
|
||||||
"description": [
|
"description": [
|
||||||
"Design a cash register drawer function that accepts purchase price as the first argument, payment as the second argument, and cash-in-drawer (cid) as the third argument.",
|
"Design a cash register drawer function that accepts purchase price as the first argument, payment as the second argument, and cash-in-drawer (cid) as the third argument.",
|
||||||
"cid is a 2d array listing available currency.",
|
"cid is a 2d array listing available currency.",
|
||||||
@ -166,7 +163,6 @@
|
|||||||
{
|
{
|
||||||
"id": "a56138aff60341a09ed6c480",
|
"id": "a56138aff60341a09ed6c480",
|
||||||
"title": "Inventory Update",
|
"title": "Inventory Update",
|
||||||
"difficulty": "4.04",
|
|
||||||
"description": [
|
"description": [
|
||||||
"Compare and update inventory stored in a 2d array against a second 2d array of a fresh delivery. Update current inventory item quantity, and if an item cannot be found, add the new item and quantity into the inventory array in alphabetical order.",
|
"Compare and update inventory stored in a 2d array against a second 2d array of a fresh delivery. Update current inventory item quantity, and if an item cannot be found, add the new item and quantity into the inventory array in alphabetical order.",
|
||||||
"Remember to use <a href='//github.com/FreeCodeCamp/freecodecamp/wiki/How-to-get-help-when-you-get-stuck' target='_blank'>Read-Search-Ask</a> if you get stuck. Try to pair program. Write your own code."
|
"Remember to use <a href='//github.com/FreeCodeCamp/freecodecamp/wiki/How-to-get-help-when-you-get-stuck' target='_blank'>Read-Search-Ask</a> if you get stuck. Try to pair program. Write your own code."
|
||||||
@ -221,7 +217,6 @@
|
|||||||
{
|
{
|
||||||
"id": "a7bf700cd123b9a54eef01d5",
|
"id": "a7bf700cd123b9a54eef01d5",
|
||||||
"title": "No repeats please",
|
"title": "No repeats please",
|
||||||
"difficulty": "4.05",
|
|
||||||
"description": [
|
"description": [
|
||||||
"Return the number of total permutations of the provided string that don't have repeated consecutive letters.",
|
"Return the number of total permutations of the provided string that don't have repeated consecutive letters.",
|
||||||
"For example, 'aab' should return 2 because it has 6 total permutations, but only 2 of them don't have the same letter (in this case 'a') repeating.",
|
"For example, 'aab' should return 2 because it has 6 total permutations, but only 2 of them don't have the same letter (in this case 'a') repeating.",
|
||||||
@ -264,7 +259,6 @@
|
|||||||
"id": "a19f0fbe1872186acd434d5a",
|
"id": "a19f0fbe1872186acd434d5a",
|
||||||
"title": "Friendly Date Ranges",
|
"title": "Friendly Date Ranges",
|
||||||
"dashedName": "bonfire-friendly-date-ranges",
|
"dashedName": "bonfire-friendly-date-ranges",
|
||||||
"difficulty": "4.06",
|
|
||||||
"description": [
|
"description": [
|
||||||
"Implement a way of converting two dates into a more friendly date range that could be presented to a user.",
|
"Implement a way of converting two dates into a more friendly date range that could be presented to a user.",
|
||||||
"It must not show any redundant information in the date range.",
|
"It must not show any redundant information in the date range.",
|
||||||
|
@ -5,7 +5,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bd7154d8c441eddfaeb5bdef",
|
"id": "bd7154d8c441eddfaeb5bdef",
|
||||||
"title": "Get Started with Angular.js",
|
"title": "Get Started with Angular.js",
|
||||||
"difficulty": 0.34,
|
|
||||||
"challengeSeed": ["114684726"],
|
"challengeSeed": ["114684726"],
|
||||||
"description": [
|
"description": [
|
||||||
"Code School has a short, free Angular.js course. This will give us a quick tour of Angular.js's mechanics and features.",
|
"Code School has a short, free Angular.js course. This will give us a quick tour of Angular.js's mechanics and features.",
|
||||||
@ -29,7 +28,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bd7155d8c441eddfaeb5bdef",
|
"id": "bd7155d8c441eddfaeb5bdef",
|
||||||
"title": "Apply Angular.js Directives",
|
"title": "Apply Angular.js Directives",
|
||||||
"difficulty": 0.35,
|
|
||||||
"challengeSeed": ["114684727"],
|
"challengeSeed": ["114684727"],
|
||||||
"description": [
|
"description": [
|
||||||
"Directives serve as markers in your HTML. When Angular.js compiles your HTML, it will alter the behavior of DOM elements based on the directives you've used.",
|
"Directives serve as markers in your HTML. When Angular.js compiles your HTML, it will alter the behavior of DOM elements based on the directives you've used.",
|
||||||
@ -53,7 +51,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bd7156d8c441eddfaeb5bdef",
|
"id": "bd7156d8c441eddfaeb5bdef",
|
||||||
"title": "Power Forms with Angular.js",
|
"title": "Power Forms with Angular.js",
|
||||||
"difficulty": 0.36,
|
|
||||||
"challengeSeed": ["114684729"],
|
"challengeSeed": ["114684729"],
|
||||||
"description": [
|
"description": [
|
||||||
"One area where Angular.js really shines is its powerful web forms.",
|
"One area where Angular.js really shines is its powerful web forms.",
|
||||||
@ -77,7 +74,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bd7157d8c441eddfaeb5bdef",
|
"id": "bd7157d8c441eddfaeb5bdef",
|
||||||
"title": "Customize Angular.js Directives",
|
"title": "Customize Angular.js Directives",
|
||||||
"difficulty": 0.37,
|
|
||||||
"challengeSeed": ["114685062"],
|
"challengeSeed": ["114685062"],
|
||||||
"description": [
|
"description": [
|
||||||
"Now we'll learn how to modify existing Angular.js directives, and even build directives of your own.",
|
"Now we'll learn how to modify existing Angular.js directives, and even build directives of your own.",
|
||||||
@ -100,7 +96,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bd7158d8c441eddfaeb5bdef",
|
"id": "bd7158d8c441eddfaeb5bdef",
|
||||||
"title": "Create Angular.js Services",
|
"title": "Create Angular.js Services",
|
||||||
"difficulty": 0.38,
|
|
||||||
"challengeSeed": ["114685060"],
|
"challengeSeed": ["114685060"],
|
||||||
"description": [
|
"description": [
|
||||||
"Services are functions that you can use and reuse throughout your Angular.js app to get things done.",
|
"Services are functions that you can use and reuse throughout your Angular.js app to get things done.",
|
||||||
|
@ -5,7 +5,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bd7158d8c443eddfaeb5bcef",
|
"id": "bd7158d8c443eddfaeb5bcef",
|
||||||
"title": "Get Set for Basejumps",
|
"title": "Get Set for Basejumps",
|
||||||
"difficulty": 2.00,
|
|
||||||
"challengeSeed": ["128451852"],
|
"challengeSeed": ["128451852"],
|
||||||
"description": [
|
"description": [
|
||||||
"<span class='text-info'>Objective:</span> Get the MEAN stack running on Cloud 9, push your code to GitHub, and deploy it to Heroku.",
|
"<span class='text-info'>Objective:</span> Get the MEAN stack running on Cloud 9, push your code to GitHub, and deploy it to Heroku.",
|
||||||
@ -66,7 +65,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bd7158d8c443eddfaeb5bdef",
|
"id": "bd7158d8c443eddfaeb5bdef",
|
||||||
"title": "Build a Voting App",
|
"title": "Build a Voting App",
|
||||||
"difficulty": 2.01,
|
|
||||||
"challengeSeed": ["133315786"],
|
"challengeSeed": ["133315786"],
|
||||||
"description": [
|
"description": [
|
||||||
"<span class='text-info'>Objective:</span> Build a full stack JavaScript app that successfully reverse-engineers this: <a href='http://votingapp.herokuapp.com/' target='_blank'>http://votingapp.herokuapp.com/</a> and deploy it to Heroku.",
|
"<span class='text-info'>Objective:</span> Build a full stack JavaScript app that successfully reverse-engineers this: <a href='http://votingapp.herokuapp.com/' target='_blank'>http://votingapp.herokuapp.com/</a> and deploy it to Heroku.",
|
||||||
@ -103,7 +101,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bd7158d8c443eddfaeb5bdff",
|
"id": "bd7158d8c443eddfaeb5bdff",
|
||||||
"title": "Build a Nightlife Coordination App",
|
"title": "Build a Nightlife Coordination App",
|
||||||
"difficulty": 2.02,
|
|
||||||
"challengeSeed": ["133315781"],
|
"challengeSeed": ["133315781"],
|
||||||
"description": [
|
"description": [
|
||||||
"<span class='text-info'>Objective:</span> Build a full stack JavaScript app that successfully reverse-engineers this: <a href='http://whatsgoinontonight.herokuapp.com/' target='_blank'>http://whatsgoinontonight.herokuapp.com/</a> and deploy it to Heroku.",
|
"<span class='text-info'>Objective:</span> Build a full stack JavaScript app that successfully reverse-engineers this: <a href='http://whatsgoinontonight.herokuapp.com/' target='_blank'>http://whatsgoinontonight.herokuapp.com/</a> and deploy it to Heroku.",
|
||||||
@ -137,7 +134,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bd7158d8c443eddfaeb5bd0e",
|
"id": "bd7158d8c443eddfaeb5bd0e",
|
||||||
"title": "Chart the Stock Market",
|
"title": "Chart the Stock Market",
|
||||||
"difficulty": 2.03,
|
|
||||||
"challengeSeed": ["133315787"],
|
"challengeSeed": ["133315787"],
|
||||||
"description": [
|
"description": [
|
||||||
"<span class='text-info'>Objective:</span> Build a full stack JavaScript app that successfully reverse-engineers this: <a href='http://stockstream.herokuapp.com/' target='_blank'>http://stockstream.herokuapp.com/</a> and deploy it to Heroku.",
|
"<span class='text-info'>Objective:</span> Build a full stack JavaScript app that successfully reverse-engineers this: <a href='http://stockstream.herokuapp.com/' target='_blank'>http://stockstream.herokuapp.com/</a> and deploy it to Heroku.",
|
||||||
@ -170,7 +166,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bd7158d8c443eddfaeb5bd0f",
|
"id": "bd7158d8c443eddfaeb5bd0f",
|
||||||
"title": "Manage a Book Trading Club",
|
"title": "Manage a Book Trading Club",
|
||||||
"difficulty": 2.04,
|
|
||||||
"challengeSeed": ["133316032"],
|
"challengeSeed": ["133316032"],
|
||||||
"description": [
|
"description": [
|
||||||
"<span class='text-info'>Objective:</span> Build a full stack JavaScript app that successfully reverse-engineers this: <a href='http://bookjump.herokuapp.com/' target='_blank'>http://bookjump.herokuapp.com/</a> and deploy it to Heroku.",
|
"<span class='text-info'>Objective:</span> Build a full stack JavaScript app that successfully reverse-engineers this: <a href='http://bookjump.herokuapp.com/' target='_blank'>http://bookjump.herokuapp.com/</a> and deploy it to Heroku.",
|
||||||
@ -203,7 +198,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bd7158d8c443eddfaeb5bdee",
|
"id": "bd7158d8c443eddfaeb5bdee",
|
||||||
"title": "Build a Pinterest Clone",
|
"title": "Build a Pinterest Clone",
|
||||||
"difficulty": 2.05,
|
|
||||||
"challengeSeed": ["133315784"],
|
"challengeSeed": ["133315784"],
|
||||||
"description": [
|
"description": [
|
||||||
"<span class='text-info'>Objective:</span> Build a full stack JavaScript app that successfully reverse-engineers this: <a href='http://stark-lowlands-3680.herokuapp.com/' target='_blank'>http://stark-lowlands-3680.herokuapp.com/</a> and deploy it to Heroku.",
|
"<span class='text-info'>Objective:</span> Build a full stack JavaScript app that successfully reverse-engineers this: <a href='http://stark-lowlands-3680.herokuapp.com/' target='_blank'>http://stark-lowlands-3680.herokuapp.com/</a> and deploy it to Heroku.",
|
||||||
|
@ -5,7 +5,6 @@
|
|||||||
{
|
{
|
||||||
"id": "ad7123c8c441eddfaeb5bdef",
|
"id": "ad7123c8c441eddfaeb5bdef",
|
||||||
"title": "Meet Bonfire",
|
"title": "Meet Bonfire",
|
||||||
"difficulty": "0",
|
|
||||||
"description": [
|
"description": [
|
||||||
"Your goal is to fix the failing test.",
|
"Your goal is to fix the failing test.",
|
||||||
"First, run all the tests by clicking \"Run tests\" or by pressing Control + Enter.",
|
"First, run all the tests by clicking \"Run tests\" or by pressing Control + Enter.",
|
||||||
@ -44,7 +43,6 @@
|
|||||||
{
|
{
|
||||||
"id": "a202eed8fc186c8434cb6d61",
|
"id": "a202eed8fc186c8434cb6d61",
|
||||||
"title": "Reverse a String",
|
"title": "Reverse a String",
|
||||||
"difficulty": "1.01",
|
|
||||||
"tests": [
|
"tests": [
|
||||||
"assert(typeof(reverseString(\"hello\")) === \"string\", 'message: <code>reverseString()</code> should return a string.');",
|
"assert(typeof(reverseString(\"hello\")) === \"string\", 'message: <code>reverseString()</code> should return a string.');",
|
||||||
"assert(reverseString(\"hello\") === \"olleh\", 'message: <code>reverseString(\"hello\")</code> should become <code>\"olleh\"</code>.');",
|
"assert(reverseString(\"hello\") === \"olleh\", 'message: <code>reverseString(\"hello\")</code> should become <code>\"olleh\"</code>.');",
|
||||||
@ -93,7 +91,6 @@
|
|||||||
"assert(factorialize(20) === 2432902008176640000, 'message: <code>factorialize(20)</code> should return 2432902008176640000.');",
|
"assert(factorialize(20) === 2432902008176640000, 'message: <code>factorialize(20)</code> should return 2432902008176640000.');",
|
||||||
"assert(factorialize(0) === 1, 'message: <code>factorialize(0)</code> should return 1.');"
|
"assert(factorialize(0) === 1, 'message: <code>factorialize(0)</code> should return 1.');"
|
||||||
],
|
],
|
||||||
"difficulty": "1.02",
|
|
||||||
"description": [
|
"description": [
|
||||||
"Return the factorial of the provided integer.",
|
"Return the factorial of the provided integer.",
|
||||||
"If the integer is represented with the letter n, a factorial is the product of all positive integers less than or equal to n.",
|
"If the integer is represented with the letter n, a factorial is the product of all positive integers less than or equal to n.",
|
||||||
@ -127,7 +124,6 @@
|
|||||||
{
|
{
|
||||||
"id": "aaa48de84e1ecc7c742e1124",
|
"id": "aaa48de84e1ecc7c742e1124",
|
||||||
"title": "Check for Palindromes",
|
"title": "Check for Palindromes",
|
||||||
"difficulty": "1.03",
|
|
||||||
"description": [
|
"description": [
|
||||||
"Return true if the given string is a palindrome. Otherwise, return false.",
|
"Return true if the given string is a palindrome. Otherwise, return false.",
|
||||||
"A palindrome is a word or sentence that's spelled the same way both forward and backward, ignoring punctuation, case, and spacing.",
|
"A palindrome is a word or sentence that's spelled the same way both forward and backward, ignoring punctuation, case, and spacing.",
|
||||||
@ -178,7 +174,6 @@
|
|||||||
{
|
{
|
||||||
"id": "a26cbbe9ad8655a977e1ceb5",
|
"id": "a26cbbe9ad8655a977e1ceb5",
|
||||||
"title": "Find the Longest Word in a String",
|
"title": "Find the Longest Word in a String",
|
||||||
"difficulty": "1.04",
|
|
||||||
"description": [
|
"description": [
|
||||||
"Return the length of the longest word in the provided sentence.",
|
"Return the length of the longest word in the provided sentence.",
|
||||||
"Your response should be a number.",
|
"Your response should be a number.",
|
||||||
@ -219,7 +214,6 @@
|
|||||||
{
|
{
|
||||||
"id": "ab6137d4e35944e21037b769",
|
"id": "ab6137d4e35944e21037b769",
|
||||||
"title": "Title Case a Sentence",
|
"title": "Title Case a Sentence",
|
||||||
"difficulty": "1.05",
|
|
||||||
"description": [
|
"description": [
|
||||||
"Return the provided string with the first letter of each word capitalized. Make sure the rest of the word is in lower case.",
|
"Return the provided string with the first letter of each word capitalized. Make sure the rest of the word is in lower case.",
|
||||||
"For the purpose of this exercise, you should also capitalize connecting words like \"the\" and \"of\".",
|
"For the purpose of this exercise, you should also capitalize connecting words like \"the\" and \"of\".",
|
||||||
@ -257,7 +251,6 @@
|
|||||||
{
|
{
|
||||||
"id": "a789b3483989747d63b0e427",
|
"id": "a789b3483989747d63b0e427",
|
||||||
"title": "Return Largest Numbers in Arrays",
|
"title": "Return Largest Numbers in Arrays",
|
||||||
"difficulty": "1.06",
|
|
||||||
"description": [
|
"description": [
|
||||||
"Return an array consisting of the largest number from each provided sub-array. For simplicity, the provided array will contain exactly 4 sub-arrays.",
|
"Return an array consisting of the largest number from each provided sub-array. For simplicity, the provided array will contain exactly 4 sub-arrays.",
|
||||||
"Remember, you can iterate through an array with a simple for loop, and access each member with array syntax arr[i] .",
|
"Remember, you can iterate through an array with a simple for loop, and access each member with array syntax arr[i] .",
|
||||||
@ -296,7 +289,6 @@
|
|||||||
{
|
{
|
||||||
"id": "acda2fb1324d9b0fa741e6b5",
|
"id": "acda2fb1324d9b0fa741e6b5",
|
||||||
"title": "Confirm the Ending",
|
"title": "Confirm the Ending",
|
||||||
"difficulty": "1.07",
|
|
||||||
"description": [
|
"description": [
|
||||||
"Check if a string (first argument) ends with the given target string (second argument).",
|
"Check if a string (first argument) ends with the given target string (second argument).",
|
||||||
"Remember to use <a href=\"//github.com/FreeCodeCamp/freecodecamp/wiki/How-to-get-help-when-you-get-stuck\" target=\"_blank\">Read-Search-Ask</a> if you get stuck. Write your own code."
|
"Remember to use <a href=\"//github.com/FreeCodeCamp/freecodecamp/wiki/How-to-get-help-when-you-get-stuck\" target=\"_blank\">Read-Search-Ask</a> if you get stuck. Write your own code."
|
||||||
@ -336,7 +328,6 @@
|
|||||||
{
|
{
|
||||||
"id": "afcc8d540bea9ea2669306b6",
|
"id": "afcc8d540bea9ea2669306b6",
|
||||||
"title": "Repeat a string repeat a string",
|
"title": "Repeat a string repeat a string",
|
||||||
"difficulty": "1.08",
|
|
||||||
"description": [
|
"description": [
|
||||||
"Repeat a given string (first argument) n times (second argument). Return an empty string if n is a negative number.",
|
"Repeat a given string (first argument) n times (second argument). Return an empty string if n is a negative number.",
|
||||||
"Remember to use <a href=\"//github.com/FreeCodeCamp/freecodecamp/wiki/How-to-get-help-when-you-get-stuck\" target=\"_blank\">Read-Search-Ask</a> if you get stuck. Write your own code."
|
"Remember to use <a href=\"//github.com/FreeCodeCamp/freecodecamp/wiki/How-to-get-help-when-you-get-stuck\" target=\"_blank\">Read-Search-Ask</a> if you get stuck. Write your own code."
|
||||||
@ -373,7 +364,6 @@
|
|||||||
{
|
{
|
||||||
"id": "ac6993d51946422351508a41",
|
"id": "ac6993d51946422351508a41",
|
||||||
"title": "Truncate a string",
|
"title": "Truncate a string",
|
||||||
"difficulty": "1.09",
|
|
||||||
"description": [
|
"description": [
|
||||||
"Truncate a string (first argument) if it is longer than the given maximum string length (second argument). Return the truncated string with a \"...\" ending.",
|
"Truncate a string (first argument) if it is longer than the given maximum string length (second argument). Return the truncated string with a \"...\" ending.",
|
||||||
"Note that the three dots at the end add to the string length.",
|
"Note that the three dots at the end add to the string length.",
|
||||||
@ -412,7 +402,6 @@
|
|||||||
{
|
{
|
||||||
"id": "a9bd25c716030ec90084d8a1",
|
"id": "a9bd25c716030ec90084d8a1",
|
||||||
"title": "Chunky Monkey",
|
"title": "Chunky Monkey",
|
||||||
"difficulty": "1.10",
|
|
||||||
"description": [
|
"description": [
|
||||||
"Write a function that splits an array (first argument) into groups the length of size (second argument) and returns them as a multidimensional array.",
|
"Write a function that splits an array (first argument) into groups the length of size (second argument) and returns them as a multidimensional array.",
|
||||||
"Remember to use <a href=\"//github.com/FreeCodeCamp/freecodecamp/wiki/How-to-get-help-when-you-get-stuck\" target=\"_blank\">Read-Search-Ask</a> if you get stuck. Write your own code."
|
"Remember to use <a href=\"//github.com/FreeCodeCamp/freecodecamp/wiki/How-to-get-help-when-you-get-stuck\" target=\"_blank\">Read-Search-Ask</a> if you get stuck. Write your own code."
|
||||||
@ -450,7 +439,6 @@
|
|||||||
{
|
{
|
||||||
"id": "ab31c21b530c0dafa9e241ee",
|
"id": "ab31c21b530c0dafa9e241ee",
|
||||||
"title": "Slasher Flick",
|
"title": "Slasher Flick",
|
||||||
"difficulty": "1.11",
|
|
||||||
"description": [
|
"description": [
|
||||||
"Return the remaining elements of an array after chopping off n elements from the head.",
|
"Return the remaining elements of an array after chopping off n elements from the head.",
|
||||||
"The head meaning the beginning of the array, or the zeroth index",
|
"The head meaning the beginning of the array, or the zeroth index",
|
||||||
@ -489,7 +477,6 @@
|
|||||||
{
|
{
|
||||||
"id": "af2170cad53daa0770fabdea",
|
"id": "af2170cad53daa0770fabdea",
|
||||||
"title": "Mutations",
|
"title": "Mutations",
|
||||||
"difficulty": "1.12",
|
|
||||||
"description": [
|
"description": [
|
||||||
"Return true if the string in the first element of the array contains all of the letters of the string in the second element of the array.",
|
"Return true if the string in the first element of the array contains all of the letters of the string in the second element of the array.",
|
||||||
"For example, <code>[\"hello\", \"Hello\"]</code>, should return true because all of the letters in the second string are present in the first, ignoring case.",
|
"For example, <code>[\"hello\", \"Hello\"]</code>, should return true because all of the letters in the second string are present in the first, ignoring case.",
|
||||||
@ -533,7 +520,6 @@
|
|||||||
{
|
{
|
||||||
"id": "adf08ec01beb4f99fc7a68f2",
|
"id": "adf08ec01beb4f99fc7a68f2",
|
||||||
"title": "Falsy Bouncer",
|
"title": "Falsy Bouncer",
|
||||||
"difficulty": "1.50",
|
|
||||||
"description": [
|
"description": [
|
||||||
"Remove all falsy values from an array.",
|
"Remove all falsy values from an array.",
|
||||||
"Falsy values in javascript are <code>false</code>, <code>null</code>, <code>0</code>, <code>\"\"</code>, <code>undefined</code>, and <code>NaN</code>.",
|
"Falsy values in javascript are <code>false</code>, <code>null</code>, <code>0</code>, <code>\"\"</code>, <code>undefined</code>, and <code>NaN</code>.",
|
||||||
@ -572,7 +558,6 @@
|
|||||||
{
|
{
|
||||||
"id": "a39963a4c10bc8b4d4f06d7e",
|
"id": "a39963a4c10bc8b4d4f06d7e",
|
||||||
"title": "Seek and Destroy",
|
"title": "Seek and Destroy",
|
||||||
"difficulty": "1.60",
|
|
||||||
"description": [
|
"description": [
|
||||||
"You will be provided with an initial array (the first argument in the destroyer function), followed by one or more arguments. Remove all elements from the initial array that are of the same value as these arguments.",
|
"You will be provided with an initial array (the first argument in the destroyer function), followed by one or more arguments. Remove all elements from the initial array that are of the same value as these arguments.",
|
||||||
"Remember to use <a href=\"//github.com/FreeCodeCamp/freecodecamp/wiki/How-to-get-help-when-you-get-stuck\" target=\"_blank\">Read-Search-Ask</a> if you get stuck. Write your own code."
|
"Remember to use <a href=\"//github.com/FreeCodeCamp/freecodecamp/wiki/How-to-get-help-when-you-get-stuck\" target=\"_blank\">Read-Search-Ask</a> if you get stuck. Write your own code."
|
||||||
@ -612,7 +597,6 @@
|
|||||||
{
|
{
|
||||||
"id": "a24c1a4622e3c05097f71d67",
|
"id": "a24c1a4622e3c05097f71d67",
|
||||||
"title": "Where do I belong",
|
"title": "Where do I belong",
|
||||||
"difficulty": "1.61",
|
|
||||||
"description": [
|
"description": [
|
||||||
"Return the lowest index at which a value (second argument) should be inserted into a sorted array (first argument).",
|
"Return the lowest index at which a value (second argument) should be inserted into a sorted array (first argument).",
|
||||||
"For example, where([1,2,3,4], 1.5) should return 1 because it is greater than 1 (0th index), but less than 2 (1st index).",
|
"For example, where([1,2,3,4], 1.5) should return 1 because it is greater than 1 (0th index), but less than 2 (1st index).",
|
||||||
|
@ -29,7 +29,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bd7123c9c441eddfaeb5bdef",
|
"id": "bd7123c9c441eddfaeb5bdef",
|
||||||
"title": "Understand Boolean Values",
|
"title": "Understand Boolean Values",
|
||||||
"difficulty": "9.98001",
|
|
||||||
"description": [
|
"description": [
|
||||||
"In computer science, <code>data structures</code> are things that hold data. JavaScript has seven of these. For example, the <code>Number</code> data structure holds numbers.",
|
"In computer science, <code>data structures</code> are things that hold data. JavaScript has seven of these. For example, the <code>Number</code> data structure holds numbers.",
|
||||||
"Let's learn about the most basic data structure of all: the <code>Boolean</code>. Booleans can only hold the value of either true or false. They are basically little on-off switches.",
|
"Let's learn about the most basic data structure of all: the <code>Boolean</code>. Booleans can only hold the value of either true or false. They are basically little on-off switches.",
|
||||||
@ -57,7 +56,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bd7123c9c443eddfaeb5bdef",
|
"id": "bd7123c9c443eddfaeb5bdef",
|
||||||
"title": "Declare JavaScript Variables",
|
"title": "Declare JavaScript Variables",
|
||||||
"difficulty": "9.9801",
|
|
||||||
"description": [
|
"description": [
|
||||||
"When we store data in a <code>data structure</code>, we call it a <code>variable</code>. These variables are no different from the x and y variables you use in math.",
|
"When we store data in a <code>data structure</code>, we call it a <code>variable</code>. These variables are no different from the x and y variables you use in math.",
|
||||||
"Let's create our first variable and call it \"myName\".",
|
"Let's create our first variable and call it \"myName\".",
|
||||||
@ -84,7 +82,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bd7123c9c444eddfaeb5bdef",
|
"id": "bd7123c9c444eddfaeb5bdef",
|
||||||
"title": "Declare String Variables",
|
"title": "Declare String Variables",
|
||||||
"difficulty": "9.9802",
|
|
||||||
"description": [
|
"description": [
|
||||||
"In the previous challenge, we used the code <code>var myName = \"your name\"</code>. This is what we call a <code>String</code> variable. It is nothing more than a \"string\" of characters. JavaScript strings are always wrapped in quotes.",
|
"In the previous challenge, we used the code <code>var myName = \"your name\"</code>. This is what we call a <code>String</code> variable. It is nothing more than a \"string\" of characters. JavaScript strings are always wrapped in quotes.",
|
||||||
"Now let's create two new string variables: <code>myFirstName</code>and <code>myLastName</code> and assign them the values of your first and last name, respectively."
|
"Now let's create two new string variables: <code>myFirstName</code>and <code>myLastName</code> and assign them the values of your first and last name, respectively."
|
||||||
@ -110,7 +107,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bd7123c9c448eddfaeb5bdef",
|
"id": "bd7123c9c448eddfaeb5bdef",
|
||||||
"title": "Check the Length Property of a String Variable",
|
"title": "Check the Length Property of a String Variable",
|
||||||
"difficulty": "9.9809",
|
|
||||||
"description": [
|
"description": [
|
||||||
"<code>Data structures</code> have <code>properties</code>. For example, <code>strings</code> have a property called <code>.length</code> that will tell you how many characters are in the string.",
|
"<code>Data structures</code> have <code>properties</code>. For example, <code>strings</code> have a property called <code>.length</code> that will tell you how many characters are in the string.",
|
||||||
"For example, if we created a variable <code>var firstName = \"Charles\"</code>, we could find out how long the string \"Charles\" is by using the <code>firstName.length</code> property.",
|
"For example, if we created a variable <code>var firstName = \"Charles\"</code>, we could find out how long the string \"Charles\" is by using the <code>firstName.length</code> property.",
|
||||||
@ -146,7 +142,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bd7123c9c549eddfaeb5bdef",
|
"id": "bd7123c9c549eddfaeb5bdef",
|
||||||
"title": "Use Bracket Notation to Find the First Character in a String",
|
"title": "Use Bracket Notation to Find the First Character in a String",
|
||||||
"difficulty": "9.9810",
|
|
||||||
"description": [
|
"description": [
|
||||||
"<code>Bracket notation</code> is a way to get a character at a specific <code>index</code> within a string.",
|
"<code>Bracket notation</code> is a way to get a character at a specific <code>index</code> within a string.",
|
||||||
"Computers don't start counting at 1 like humans do. They start at 0.",
|
"Computers don't start counting at 1 like humans do. They start at 0.",
|
||||||
@ -181,7 +176,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bd7123c9c450eddfaeb5bdef",
|
"id": "bd7123c9c450eddfaeb5bdef",
|
||||||
"title": "Use Bracket Notation to Find the Nth Character in a String",
|
"title": "Use Bracket Notation to Find the Nth Character in a String",
|
||||||
"difficulty": "9.9811",
|
|
||||||
"description": [
|
"description": [
|
||||||
"You can also use <code>bracket Notation</code>to get the character at other positions within a string.",
|
"You can also use <code>bracket Notation</code>to get the character at other positions within a string.",
|
||||||
"Remember that computers start counting at 0, so the first character is actually the zeroth character.",
|
"Remember that computers start counting at 0, so the first character is actually the zeroth character.",
|
||||||
@ -212,7 +206,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bd7123c9c451eddfaeb5bdef",
|
"id": "bd7123c9c451eddfaeb5bdef",
|
||||||
"title": "Use Bracket Notation to Find the Last Character in a String",
|
"title": "Use Bracket Notation to Find the Last Character in a String",
|
||||||
"difficulty": "9.9812",
|
|
||||||
"description": [
|
"description": [
|
||||||
"In order to get the last letter of a string, you can subtract one from the string's length.",
|
"In order to get the last letter of a string, you can subtract one from the string's length.",
|
||||||
"For example, if <code>var firstName = \"Charles\"</code>, you can get the value of the last letter of the string by using <code>firstName[firstName.length - 1]</code>.",
|
"For example, if <code>var firstName = \"Charles\"</code>, you can get the value of the last letter of the string by using <code>firstName[firstName.length - 1]</code>.",
|
||||||
@ -244,7 +237,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bd7123c9c452eddfaeb5bdef",
|
"id": "bd7123c9c452eddfaeb5bdef",
|
||||||
"title": "Use Bracket Notation to Find the Nth-to-Last Character in a String",
|
"title": "Use Bracket Notation to Find the Nth-to-Last Character in a String",
|
||||||
"difficulty": "9.9813",
|
|
||||||
"description": [
|
"description": [
|
||||||
"In order to get the last letter of a string, you can subtract one from the string's length.",
|
"In order to get the last letter of a string, you can subtract one from the string's length.",
|
||||||
"For example, you can get the value of the third-to-last letter of the <code>var firstName = \"Charles\"</code> string by using <code>firstName[firstName.length - 3]</code>.",
|
"For example, you can get the value of the third-to-last letter of the <code>var firstName = \"Charles\"</code> string by using <code>firstName[firstName.length - 3]</code>.",
|
||||||
@ -276,7 +268,6 @@
|
|||||||
{
|
{
|
||||||
"id": "cf1111c1c11feddfaeb3bdef",
|
"id": "cf1111c1c11feddfaeb3bdef",
|
||||||
"title": "Add Two Numbers with JavaScript",
|
"title": "Add Two Numbers with JavaScript",
|
||||||
"difficulty": "9.98141",
|
|
||||||
"description": [
|
"description": [
|
||||||
"Let's try to add two numbers using JavaScript.",
|
"Let's try to add two numbers using JavaScript.",
|
||||||
"JavaScript uses the <code>+</code> symbol for addition.",
|
"JavaScript uses the <code>+</code> symbol for addition.",
|
||||||
@ -299,7 +290,6 @@
|
|||||||
{
|
{
|
||||||
"id": "cf1111c1c11feddfaeb4bdef",
|
"id": "cf1111c1c11feddfaeb4bdef",
|
||||||
"title": "Subtract One Number from Another with JavaScript",
|
"title": "Subtract One Number from Another with JavaScript",
|
||||||
"difficulty": "9.98142",
|
|
||||||
"description": [
|
"description": [
|
||||||
"We can also subtract one number from another.",
|
"We can also subtract one number from another.",
|
||||||
"JavaScript uses the <code>-</code> symbol for subtraction.",
|
"JavaScript uses the <code>-</code> symbol for subtraction.",
|
||||||
@ -322,7 +312,6 @@
|
|||||||
{
|
{
|
||||||
"id": "cf1231c1c11feddfaeb5bdef",
|
"id": "cf1231c1c11feddfaeb5bdef",
|
||||||
"title": "Multiply Two Numbers with JavaScript",
|
"title": "Multiply Two Numbers with JavaScript",
|
||||||
"difficulty": "9.98143",
|
|
||||||
"description": [
|
"description": [
|
||||||
"We can also multiply one number by another.",
|
"We can also multiply one number by another.",
|
||||||
"JavaScript uses the <code>*</code> symbol for multiplication.",
|
"JavaScript uses the <code>*</code> symbol for multiplication.",
|
||||||
@ -345,7 +334,6 @@
|
|||||||
{
|
{
|
||||||
"id": "cf1111c1c11feddfaeb6bdef",
|
"id": "cf1111c1c11feddfaeb6bdef",
|
||||||
"title": "Divide One Number by Another with JavaScript",
|
"title": "Divide One Number by Another with JavaScript",
|
||||||
"difficulty": "9.9814",
|
|
||||||
"description": [
|
"description": [
|
||||||
"We can also divide one number by another.",
|
"We can also divide one number by another.",
|
||||||
"JavaScript uses the <code>/</code> symbol for division.",
|
"JavaScript uses the <code>/</code> symbol for division.",
|
||||||
@ -368,7 +356,6 @@
|
|||||||
{
|
{
|
||||||
"id": "cf1391c1c11feddfaeb4bdef",
|
"id": "cf1391c1c11feddfaeb4bdef",
|
||||||
"title": "Create Decimal Numbers with JavaScript",
|
"title": "Create Decimal Numbers with JavaScript",
|
||||||
"difficulty": "9.9815",
|
|
||||||
"description": [
|
"description": [
|
||||||
"JavaScript number variables can also have decimals.",
|
"JavaScript number variables can also have decimals.",
|
||||||
"Let's create a variable <code>myDecimal</code> and give it a decimal value."
|
"Let's create a variable <code>myDecimal</code> and give it a decimal value."
|
||||||
@ -393,7 +380,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bd7993c9c69feddfaeb7bdef",
|
"id": "bd7993c9c69feddfaeb7bdef",
|
||||||
"title": "Perform Arithmetic Operations on Decimals with JavaScript",
|
"title": "Perform Arithmetic Operations on Decimals with JavaScript",
|
||||||
"difficulty": "9.98151",
|
|
||||||
"description": [
|
"description": [
|
||||||
"In JavaScript, you can also perform calculations with decimal numbers, just like whole numbers.",
|
"In JavaScript, you can also perform calculations with decimal numbers, just like whole numbers.",
|
||||||
"Replace the <code>0.0</code> with the correct number so that you get the result mentioned in the comments."
|
"Replace the <code>0.0</code> with the correct number so that you get the result mentioned in the comments."
|
||||||
@ -418,7 +404,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bd7993c9c69feddfaeb8bdef",
|
"id": "bd7993c9c69feddfaeb8bdef",
|
||||||
"title": "Store Multiple Values in one Variable using JavaScript Arrays",
|
"title": "Store Multiple Values in one Variable using JavaScript Arrays",
|
||||||
"difficulty": "9.9816",
|
|
||||||
"description": [
|
"description": [
|
||||||
"With JavaScript <code>array</code> variables, we can store several pieces of data in one place.",
|
"With JavaScript <code>array</code> variables, we can store several pieces of data in one place.",
|
||||||
"You start an array declaration with an opening square bracket, end it with a closing square bracket, and put a comma between each entry, like this: <code>var sandwich = [\"peanut butter\", \"jelly\", \"bread\"]</code>.",
|
"You start an array declaration with an opening square bracket, end it with a closing square bracket, and put a comma between each entry, like this: <code>var sandwich = [\"peanut butter\", \"jelly\", \"bread\"]</code>.",
|
||||||
@ -536,7 +521,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bg9994c9c69feddfaeb9bdef",
|
"id": "bg9994c9c69feddfaeb9bdef",
|
||||||
"title": "Manipulate Arrays With pop()",
|
"title": "Manipulate Arrays With pop()",
|
||||||
"difficulty": "9.9818",
|
|
||||||
"description": [
|
"description": [
|
||||||
"Another way to change the data in an array is with the <code>.pop()</code> function.",
|
"Another way to change the data in an array is with the <code>.pop()</code> function.",
|
||||||
"<code>.pop()</code>is used to \"pop\" a value off of the end of an array. We can retrieve this value by performing <code>pop()</code> in a variable declaration.",
|
"<code>.pop()</code>is used to \"pop\" a value off of the end of an array. We can retrieve this value by performing <code>pop()</code> in a variable declaration.",
|
||||||
@ -570,7 +554,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bg9995c9c69feddfaeb9bdef",
|
"id": "bg9995c9c69feddfaeb9bdef",
|
||||||
"title": "Manipulate Arrays With push()",
|
"title": "Manipulate Arrays With push()",
|
||||||
"difficulty": "9.9818",
|
|
||||||
"description": [
|
"description": [
|
||||||
"Not only can you <code>pop()</code> data off of the end of an array, you can also <code>push()</code> data onto the end of an array.",
|
"Not only can you <code>pop()</code> data off of the end of an array, you can also <code>push()</code> data onto the end of an array.",
|
||||||
"Take the <code>myArray</code> array and <code>push()</code> this value to the end of it: <code>[\"dog\", 3]</code>."
|
"Take the <code>myArray</code> array and <code>push()</code> this value to the end of it: <code>[\"dog\", 3]</code>."
|
||||||
@ -601,7 +584,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bg9996c9c69feddfaeb9bdef",
|
"id": "bg9996c9c69feddfaeb9bdef",
|
||||||
"title": "Manipulate Arrays With shift()",
|
"title": "Manipulate Arrays With shift()",
|
||||||
"difficulty": "9.9817",
|
|
||||||
"description": [
|
"description": [
|
||||||
"<code>pop()</code> always removes the last element of an array. What if you want to remove the first? That's where <code>.shift()</code> comes in.",
|
"<code>pop()</code> always removes the last element of an array. What if you want to remove the first? That's where <code>.shift()</code> comes in.",
|
||||||
"Take the <code>myArray</code> array and <code>shift()</code> the first value off of it. Set <code>myRemoved</code> to the first value of <code>myArray</code> using <code>shift()</code>."
|
"Take the <code>myArray</code> array and <code>shift()</code> the first value off of it. Set <code>myRemoved</code> to the first value of <code>myArray</code> using <code>shift()</code>."
|
||||||
@ -632,7 +614,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bg9997c9c69feddfaeb9bdef",
|
"id": "bg9997c9c69feddfaeb9bdef",
|
||||||
"title": "Manipulate Arrays With unshift()",
|
"title": "Manipulate Arrays With unshift()",
|
||||||
"difficulty": "9.9818",
|
|
||||||
"description": [
|
"description": [
|
||||||
"Now that we've learned how to <code>shift</code>things from the start of the array, we need to learn how to <code>unshift</code>stuff back to the start.",
|
"Now that we've learned how to <code>shift</code>things from the start of the array, we need to learn how to <code>unshift</code>stuff back to the start.",
|
||||||
"Let's take the code we had last time and <code>unshift</code>this value to the start: <code>\"Paul\"</code>."
|
"Let's take the code we had last time and <code>unshift</code>this value to the start: <code>\"Paul\"</code>."
|
||||||
|
@ -5,7 +5,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bd7158d8c442eddfbeb5bd1f",
|
"id": "bd7158d8c442eddfbeb5bd1f",
|
||||||
"title": "Get Set for Ziplines",
|
"title": "Get Set for Ziplines",
|
||||||
"difficulty": 1.00,
|
|
||||||
"challengeSeed": ["125658022"],
|
"challengeSeed": ["125658022"],
|
||||||
"description": [
|
"description": [
|
||||||
"Now you're ready to start our Zipline challenges. These front-end development challenges will give you many opportunities to apply the HTML, CSS, jQuery and JavaScript you've learned to build static (database-less) applications.",
|
"Now you're ready to start our Zipline challenges. These front-end development challenges will give you many opportunities to apply the HTML, CSS, jQuery and JavaScript you've learned to build static (database-less) applications.",
|
||||||
@ -53,7 +52,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bd7158d8c242eddfaeb5bd13",
|
"id": "bd7158d8c242eddfaeb5bd13",
|
||||||
"title": "Build a Personal Portfolio Webpage",
|
"title": "Build a Personal Portfolio Webpage",
|
||||||
"difficulty": 1.01,
|
|
||||||
"challengeSeed": ["133315782"],
|
"challengeSeed": ["133315782"],
|
||||||
"description": [
|
"description": [
|
||||||
"<span class='text-info'>Objective:</span> Build a <a href='http://codepen.io' target='_blank'>CodePen.io</a> app that successfully reverse-engineers this: <a href='http://codepen.io/ThiagoFerreir4/full/eNMxEp' target='_blank'>http://codepen.io/ThiagoFerreir4/full/eNMxEp</a>.",
|
"<span class='text-info'>Objective:</span> Build a <a href='http://codepen.io' target='_blank'>CodePen.io</a> app that successfully reverse-engineers this: <a href='http://codepen.io/ThiagoFerreir4/full/eNMxEp' target='_blank'>http://codepen.io/ThiagoFerreir4/full/eNMxEp</a>.",
|
||||||
@ -107,7 +105,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bd7158d8c442eddfaeb5bd13",
|
"id": "bd7158d8c442eddfaeb5bd13",
|
||||||
"title": "Build a Random Quote Machine",
|
"title": "Build a Random Quote Machine",
|
||||||
"difficulty": 1.02,
|
|
||||||
"challengeSeed": ["126415122"],
|
"challengeSeed": ["126415122"],
|
||||||
"description": [
|
"description": [
|
||||||
"<span class='text-info'>Objective:</span> Build a <a href='http://codepen.io' target='_blank'>CodePen.io</a> app that successfully reverse-engineers this: <a href='http://codepen.io/AdventureBear/full/vEoVMw' target='_blank'>http://codepen.io/AdventureBear/full/vEoVMw</a>.",
|
"<span class='text-info'>Objective:</span> Build a <a href='http://codepen.io' target='_blank'>CodePen.io</a> app that successfully reverse-engineers this: <a href='http://codepen.io/AdventureBear/full/vEoVMw' target='_blank'>http://codepen.io/AdventureBear/full/vEoVMw</a>.",
|
||||||
@ -151,7 +148,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bd7158d8c442eddfaeb5bd10",
|
"id": "bd7158d8c442eddfaeb5bd10",
|
||||||
"title": "Show the Local Weather",
|
"title": "Show the Local Weather",
|
||||||
"difficulty": 1.03,
|
|
||||||
"challengeSeed": ["126415127"],
|
"challengeSeed": ["126415127"],
|
||||||
"description": [
|
"description": [
|
||||||
"<span class='text-info'>Objective:</span> Build a <a href='http://codepen.io' target='_blank'>CodePen.io</a> app that successfully reverse-engineers this: <a href='http://codepen.io/AdventureBear/full/yNBJRj' target='_blank'>http://codepen.io/AdventureBear/full/yNBJRj</a>.",
|
"<span class='text-info'>Objective:</span> Build a <a href='http://codepen.io' target='_blank'>CodePen.io</a> app that successfully reverse-engineers this: <a href='http://codepen.io/AdventureBear/full/yNBJRj' target='_blank'>http://codepen.io/AdventureBear/full/yNBJRj</a>.",
|
||||||
@ -197,7 +193,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bd7158d8c442eddfaeb5bd0f",
|
"id": "bd7158d8c442eddfaeb5bd0f",
|
||||||
"title": "Build a Pomodoro Clock",
|
"title": "Build a Pomodoro Clock",
|
||||||
"difficulty": 1.04,
|
|
||||||
"challengeSeed": ["126411567"],
|
"challengeSeed": ["126411567"],
|
||||||
"description": [
|
"description": [
|
||||||
"<span class='text-info'>Objective:</span> Build a <a href='http://codepen.io' target='_blank'>CodePen.io</a> app that successfully reverse-engineers this: <a href='http://codepen.io/GeoffStorbeck/full/RPbGxZ/' target='_blank'>http://codepen.io/GeoffStorbeck/full/RPbGxZ/</a>.",
|
"<span class='text-info'>Objective:</span> Build a <a href='http://codepen.io' target='_blank'>CodePen.io</a> app that successfully reverse-engineers this: <a href='http://codepen.io/GeoffStorbeck/full/RPbGxZ/' target='_blank'>http://codepen.io/GeoffStorbeck/full/RPbGxZ/</a>.",
|
||||||
@ -241,7 +236,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bd7158d8c442eddfaeb5bd1f",
|
"id": "bd7158d8c442eddfaeb5bd1f",
|
||||||
"title": "Use the Twitch.tv JSON API",
|
"title": "Use the Twitch.tv JSON API",
|
||||||
"difficulty": 1.05,
|
|
||||||
"challengeSeed": ["126411564"],
|
"challengeSeed": ["126411564"],
|
||||||
"description": [
|
"description": [
|
||||||
"<span class='text-info'>Objective:</span> Build a <a href='http://codepen.io' target='_blank'>CodePen.io</a> app that successfully reverse-engineers this: <a href='http://codepen.io/GeoffStorbeck/full/GJKRxZ' target='_blank'>http://codepen.io/GeoffStorbeck/full/GJKRxZ</a>.",
|
"<span class='text-info'>Objective:</span> Build a <a href='http://codepen.io' target='_blank'>CodePen.io</a> app that successfully reverse-engineers this: <a href='http://codepen.io/GeoffStorbeck/full/GJKRxZ' target='_blank'>http://codepen.io/GeoffStorbeck/full/GJKRxZ</a>.",
|
||||||
|
@ -5,7 +5,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bad87fee1348bd9acde08712",
|
"id": "bad87fee1348bd9acde08712",
|
||||||
"title": "Use Responsive Design with Bootstrap Fluid Containers",
|
"title": "Use Responsive Design with Bootstrap Fluid Containers",
|
||||||
"difficulty": 2.01,
|
|
||||||
"description": [
|
"description": [
|
||||||
"Now let's go back to our Cat Photo App. This time, we'll style it using the popular Bootstrap responsive CSS framework.",
|
"Now let's go back to our Cat Photo App. This time, we'll style it using the popular Bootstrap responsive CSS framework.",
|
||||||
"Bootstrap will figure out how wide your screen is and respond by resizing your HTML elements - hence the name <code>Responsive Design</code>.",
|
"Bootstrap will figure out how wide your screen is and respond by resizing your HTML elements - hence the name <code>Responsive Design</code>.",
|
||||||
@ -89,7 +88,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bad87fee1348bd9acde08812",
|
"id": "bad87fee1348bd9acde08812",
|
||||||
"title": "Make Images Mobile Responsive",
|
"title": "Make Images Mobile Responsive",
|
||||||
"difficulty": 2.02,
|
|
||||||
"description": [
|
"description": [
|
||||||
"First, add a new image below the existing one. Set it's <code>src</code> attribute to <code>http://bit.ly/fcc-running-cats</code>.",
|
"First, add a new image below the existing one. Set it's <code>src</code> attribute to <code>http://bit.ly/fcc-running-cats</code>.",
|
||||||
"It would be great if this image could be exactly the width of our phone's screen.",
|
"It would be great if this image could be exactly the width of our phone's screen.",
|
||||||
@ -174,7 +172,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bad87fee1348bd8acde08812",
|
"id": "bad87fee1348bd8acde08812",
|
||||||
"title": "Center Text with Bootstrap",
|
"title": "Center Text with Bootstrap",
|
||||||
"difficulty": 2.03,
|
|
||||||
"description": [
|
"description": [
|
||||||
"Now that we're using Bootstrap, we can center our heading element to make it look better. All we need to do is add the class <code>text-center</code> to our <code>h2</code> element.",
|
"Now that we're using Bootstrap, we can center our heading element to make it look better. All we need to do is add the class <code>text-center</code> to our <code>h2</code> element.",
|
||||||
"Remember that you can add several classes to the same element by separating each of them with a space, like this: <code><h2 class=\"red-text text-center\">your text</h2></code>."
|
"Remember that you can add several classes to the same element by separating each of them with a space, like this: <code><h2 class=\"red-text text-center\">your text</h2></code>."
|
||||||
@ -257,7 +254,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bad87fee1348cd8acdf08812",
|
"id": "bad87fee1348cd8acdf08812",
|
||||||
"title": "Create a Bootstrap Button",
|
"title": "Create a Bootstrap Button",
|
||||||
"difficulty": 2.04,
|
|
||||||
"description": [
|
"description": [
|
||||||
"Bootstrap has its own styles for <code>button</code> elements, which look much better than the plain HTML ones.",
|
"Bootstrap has its own styles for <code>button</code> elements, which look much better than the plain HTML ones.",
|
||||||
"Create a new <code>button</code> element below your large kitten photo. Give it the class <code>btn</code> and the text of \"Like\"."
|
"Create a new <code>button</code> element below your large kitten photo. Give it the class <code>btn</code> and the text of \"Like\"."
|
||||||
@ -343,7 +339,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bad87fee1348cd8acef08812",
|
"id": "bad87fee1348cd8acef08812",
|
||||||
"title": "Create a Block Element Bootstrap Button",
|
"title": "Create a Block Element Bootstrap Button",
|
||||||
"difficulty": 2.05,
|
|
||||||
"description": [
|
"description": [
|
||||||
"Normally, your <code>button</code> elements are only as wide as the text that they contain. By making them block elements, your button will stretch to fill your page's entire horizontal space.",
|
"Normally, your <code>button</code> elements are only as wide as the text that they contain. By making them block elements, your button will stretch to fill your page's entire horizontal space.",
|
||||||
"This image illustrates the difference between <code>inline</code> elements and <code>block-level</code> elements:",
|
"This image illustrates the difference between <code>inline</code> elements and <code>block-level</code> elements:",
|
||||||
@ -432,7 +427,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bad87fee1348cd8acef08811",
|
"id": "bad87fee1348cd8acef08811",
|
||||||
"title": "Taste the Bootstrap Button Color Rainbow",
|
"title": "Taste the Bootstrap Button Color Rainbow",
|
||||||
"difficulty": 2.06,
|
|
||||||
"description": [
|
"description": [
|
||||||
"The <code>btn-primary</code> class is the main color you'll use in your app. It is useful for highlighting actions you want your user to take.",
|
"The <code>btn-primary</code> class is the main color you'll use in your app. It is useful for highlighting actions you want your user to take.",
|
||||||
"Add Bootstrap's <code>btn-primary</code> class to your button.",
|
"Add Bootstrap's <code>btn-primary</code> class to your button.",
|
||||||
@ -519,7 +513,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bad87fee1348cd8acef08813",
|
"id": "bad87fee1348cd8acef08813",
|
||||||
"title": "Call out Optional Actions with Button Info",
|
"title": "Call out Optional Actions with Button Info",
|
||||||
"difficulty": 2.07,
|
|
||||||
"description": [
|
"description": [
|
||||||
"Bootstrap comes with several pre-defined colors for buttons. The <code>btn-info</code> class is used to call attention to optional actions that the user can take.",
|
"Bootstrap comes with several pre-defined colors for buttons. The <code>btn-info</code> class is used to call attention to optional actions that the user can take.",
|
||||||
"Create a new block-level Bootstrap button below your \"Like\" button with the text \"Info\", and add Bootstrap's <code>btn-info</code> and <code>btn-block</code> classes to it.",
|
"Create a new block-level Bootstrap button below your \"Like\" button with the text \"Info\", and add Bootstrap's <code>btn-info</code> and <code>btn-block</code> classes to it.",
|
||||||
@ -607,7 +600,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bad87fee1348ce8acef08814",
|
"id": "bad87fee1348ce8acef08814",
|
||||||
"title": "Warn your Users of a Dangerous Action",
|
"title": "Warn your Users of a Dangerous Action",
|
||||||
"difficulty": 2.08,
|
|
||||||
"description": [
|
"description": [
|
||||||
"Bootstrap comes with several pre-defined colors for buttons. The <code>btn-danger</code> class is the button color you'll use to notify users that the button performs a destructive action, such as deleting a cat photo.",
|
"Bootstrap comes with several pre-defined colors for buttons. The <code>btn-danger</code> class is the button color you'll use to notify users that the button performs a destructive action, such as deleting a cat photo.",
|
||||||
"Create a button with the text \"Delete\" and give it the class <code>btn-danger</code>.",
|
"Create a button with the text \"Delete\" and give it the class <code>btn-danger</code>.",
|
||||||
@ -696,7 +688,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bad88fee1348ce8acef08815",
|
"id": "bad88fee1348ce8acef08815",
|
||||||
"title": "Use the Bootstrap Grid to Put Elements Side By Side",
|
"title": "Use the Bootstrap Grid to Put Elements Side By Side",
|
||||||
"difficulty": 2.09,
|
|
||||||
"description": [
|
"description": [
|
||||||
"Bootstrap uses a responsive grid system, which makes it easy to put elements into rows and specify each element's relative width. Most of Bootstrap's classes can be applied to a <code>div</code> element.",
|
"Bootstrap uses a responsive grid system, which makes it easy to put elements into rows and specify each element's relative width. Most of Bootstrap's classes can be applied to a <code>div</code> element.",
|
||||||
"Here's a diagram of how Bootstrap's 12-column grid layout works:",
|
"Here's a diagram of how Bootstrap's 12-column grid layout works:",
|
||||||
@ -790,7 +781,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bad87fee1347bd9aedf08845",
|
"id": "bad87fee1347bd9aedf08845",
|
||||||
"title": "Ditch Custom CSS for Bootstrap",
|
"title": "Ditch Custom CSS for Bootstrap",
|
||||||
"difficulty": 2.10,
|
|
||||||
"description": [
|
"description": [
|
||||||
"We can clean up our code and make our Cat Photo App look more conventional by using Bootstrap's built-in styles instead of the custom styles we created earlier.",
|
"We can clean up our code and make our Cat Photo App look more conventional by using Bootstrap's built-in styles instead of the custom styles we created earlier.",
|
||||||
"Don't worry - there will be plenty of time to customize our CSS later.",
|
"Don't worry - there will be plenty of time to customize our CSS later.",
|
||||||
@ -891,7 +881,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bad87fee1348bd9aedf08845",
|
"id": "bad87fee1348bd9aedf08845",
|
||||||
"title": "Use Spans for Inline Elements",
|
"title": "Use Spans for Inline Elements",
|
||||||
"difficulty": 2.105,
|
|
||||||
"description": [
|
"description": [
|
||||||
"You can use spans to create inline elements. Remember when we used the <code>btn-block</code> class to make the button fill the entire row?",
|
"You can use spans to create inline elements. Remember when we used the <code>btn-block</code> class to make the button fill the entire row?",
|
||||||
"This image illustrates the difference between <code>inline</code> elements and <code>block-level</code> elements:",
|
"This image illustrates the difference between <code>inline</code> elements and <code>block-level</code> elements:",
|
||||||
@ -979,7 +968,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bad87fee1348bd9aede08845",
|
"id": "bad87fee1348bd9aede08845",
|
||||||
"title": "Create a Custom Heading",
|
"title": "Create a Custom Heading",
|
||||||
"difficulty": 2.11,
|
|
||||||
"description": [
|
"description": [
|
||||||
"We will make a simple heading for our Cat Photo App by putting them in the same row.",
|
"We will make a simple heading for our Cat Photo App by putting them in the same row.",
|
||||||
"Remember, Bootstrap uses a responsive grid system, which makes it easy to put elements into rows and specify each element's relative width. Most of Bootstrap's classes can be applied to a <code>div</code> element.",
|
"Remember, Bootstrap uses a responsive grid system, which makes it easy to put elements into rows and specify each element's relative width. Most of Bootstrap's classes can be applied to a <code>div</code> element.",
|
||||||
@ -1068,7 +1056,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bad87fee1348bd9aedd08845",
|
"id": "bad87fee1348bd9aedd08845",
|
||||||
"title": "Add Font Awesome Icons to our Buttons",
|
"title": "Add Font Awesome Icons to our Buttons",
|
||||||
"difficulty": 2.12,
|
|
||||||
"description": [
|
"description": [
|
||||||
"Font Awesome is a convenient library of icons. These icons are vector graphics, stored in the <code>.svg</code> file format. These icons are treated just like fonts. You can specify their size using pixels, and they will assume the font size of their parent HTML elements.",
|
"Font Awesome is a convenient library of icons. These icons are vector graphics, stored in the <code>.svg</code> file format. These icons are treated just like fonts. You can specify their size using pixels, and they will assume the font size of their parent HTML elements.",
|
||||||
"Use Font Awesome to add a <code>thumbs-up</code> icon to your like button by giving it a <code>i</code> element with the classes <code>fa</code> and <code>fa-thumbs-up</code>."
|
"Use Font Awesome to add a <code>thumbs-up</code> icon to your like button by giving it a <code>i</code> element with the classes <code>fa</code> and <code>fa-thumbs-up</code>."
|
||||||
@ -1153,7 +1140,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bad87fee1348bd9aedc08845",
|
"id": "bad87fee1348bd9aedc08845",
|
||||||
"title": "Add Font Awesome Icons to all of our Buttons",
|
"title": "Add Font Awesome Icons to all of our Buttons",
|
||||||
"difficulty": 2.13,
|
|
||||||
"description": [
|
"description": [
|
||||||
"Font Awesome is a convenient library of icons. These icons are vector graphics, stored in the <code>.svg</code> file format. These icons are treated just like fonts. You can specify their size using pixels, and they will assume the font size of their parent HTML elements.",
|
"Font Awesome is a convenient library of icons. These icons are vector graphics, stored in the <code>.svg</code> file format. These icons are treated just like fonts. You can specify their size using pixels, and they will assume the font size of their parent HTML elements.",
|
||||||
"Use Font Awesome to add a <code>info-circle</code> icon to your info button and a <code>trash</code> icon to your delete button."
|
"Use Font Awesome to add a <code>info-circle</code> icon to your info button and a <code>trash</code> icon to your delete button."
|
||||||
@ -1238,7 +1224,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bad87fee1348bd9aedb08845",
|
"id": "bad87fee1348bd9aedb08845",
|
||||||
"title": "Responsively Style Radio Buttons",
|
"title": "Responsively Style Radio Buttons",
|
||||||
"difficulty": 2.14,
|
|
||||||
"description": [
|
"description": [
|
||||||
"You can use Bootstrap's <code>col-xs-*</code> classes on <code>form</code> elements, too! This way, our radio buttons will be evenly spread out across the page, regardless of how wide the screen resolution is.",
|
"You can use Bootstrap's <code>col-xs-*</code> classes on <code>form</code> elements, too! This way, our radio buttons will be evenly spread out across the page, regardless of how wide the screen resolution is.",
|
||||||
"Nest all of your radio buttons within a <code><div class=\"row\"></code> element. Then nest each of them within a <code><div class=\"col-xs-6\"></code> element."
|
"Nest all of your radio buttons within a <code><div class=\"row\"></code> element. Then nest each of them within a <code><div class=\"col-xs-6\"></code> element."
|
||||||
@ -1323,7 +1308,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bad87fee1348bd9aeda08845",
|
"id": "bad87fee1348bd9aeda08845",
|
||||||
"title": "Responsively Style Checkboxes",
|
"title": "Responsively Style Checkboxes",
|
||||||
"difficulty": 2.15,
|
|
||||||
"description": [
|
"description": [
|
||||||
"You can use Bootstrap's <code>col-xs-*</code> classes on <code>form</code> elements, too! This way, our checkboxes will be evenly spread out across the page, regardless of how wide the screen resolution is.",
|
"You can use Bootstrap's <code>col-xs-*</code> classes on <code>form</code> elements, too! This way, our checkboxes will be evenly spread out across the page, regardless of how wide the screen resolution is.",
|
||||||
"Nest all your checkboxes in a <code><div class=\"row\"></code> element. Then nest each of them in a <code><div class=\"col-xs-4\"></code> element."
|
"Nest all your checkboxes in a <code><div class=\"row\"></code> element. Then nest each of them in a <code><div class=\"col-xs-4\"></code> element."
|
||||||
@ -1415,7 +1399,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bad87fee1348bd9aed908845",
|
"id": "bad87fee1348bd9aed908845",
|
||||||
"title": "Style Text Inputs as Form Controls",
|
"title": "Style Text Inputs as Form Controls",
|
||||||
"difficulty": 2.16,
|
|
||||||
"description": [
|
"description": [
|
||||||
"You can add the <code>fa-paper-plane</code> Font Awesome icon by adding <code><i class=\"fa fa-paper-plane\"></i></code> within your submit <code>button</code> element.",
|
"You can add the <code>fa-paper-plane</code> Font Awesome icon by adding <code><i class=\"fa fa-paper-plane\"></i></code> within your submit <code>button</code> element.",
|
||||||
"Give your form's text input field a class of <code>form-control</code>. Give your form's submit button the classes <code>btn btn-primary</code>. Also give this button the Font Awesome icon of <code>fa-paper-plane</code>."
|
"Give your form's text input field a class of <code>form-control</code>. Give your form's submit button the classes <code>btn btn-primary</code>. Also give this button the Font Awesome icon of <code>fa-paper-plane</code>."
|
||||||
@ -1516,7 +1499,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bad87fee1348bd9aec908845",
|
"id": "bad87fee1348bd9aec908845",
|
||||||
"title": "Line up Form Elements Responsively with Bootstrap",
|
"title": "Line up Form Elements Responsively with Bootstrap",
|
||||||
"difficulty": 2.17,
|
|
||||||
"description": [
|
"description": [
|
||||||
"Now let's get your form <code>input</code> and your submission <code>button</code> on the same line. We'll do this the same way we have previously: by using a <code>div</code> element with the class <code>row</code>, and other <code>div</code> elements within it using the <code>col-xs-*</code> class.",
|
"Now let's get your form <code>input</code> and your submission <code>button</code> on the same line. We'll do this the same way we have previously: by using a <code>div</code> element with the class <code>row</code>, and other <code>div</code> elements within it using the <code>col-xs-*</code> class.",
|
||||||
"Nest both your form's text <code>input</code> and submit <code>button</code> within a <code>div</code> with the class <code>row</code>. Nest your form's text <code>input</code> within a div with the class of <code>col-xs-7</code>. Nest your form's submit <code>button</code> in a <code>div</code> with the class <code>col-xs-5</code>.",
|
"Nest both your form's text <code>input</code> and submit <code>button</code> within a <code>div</code> with the class <code>row</code>. Nest your form's text <code>input</code> within a div with the class of <code>col-xs-7</code>. Nest your form's submit <code>button</code> in a <code>div</code> with the class <code>col-xs-5</code>.",
|
||||||
@ -1618,7 +1600,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bad87fee1348bd9aec908846",
|
"id": "bad87fee1348bd9aec908846",
|
||||||
"title": "Create a Bootstrap Headline",
|
"title": "Create a Bootstrap Headline",
|
||||||
"difficulty": 2.18,
|
|
||||||
"description": [
|
"description": [
|
||||||
"Now let's build something from scratch to practice our HTML, CSS and Bootstrap skills.",
|
"Now let's build something from scratch to practice our HTML, CSS and Bootstrap skills.",
|
||||||
"We'll build a jQuery playground, which we'll soon put to use in our jQuery challenges.",
|
"We'll build a jQuery playground, which we'll soon put to use in our jQuery challenges.",
|
||||||
@ -1653,7 +1634,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bad87fee1348bd9aec908746",
|
"id": "bad87fee1348bd9aec908746",
|
||||||
"title": "House our page within a Bootstrap Container Fluid Div",
|
"title": "House our page within a Bootstrap Container Fluid Div",
|
||||||
"difficulty": 2.18,
|
|
||||||
"description": [
|
"description": [
|
||||||
"Now let's make sure all the content on your page is mobile-responsive.",
|
"Now let's make sure all the content on your page is mobile-responsive.",
|
||||||
"Let's nest your <code>h3</code> element within a <code>div</code> element with the class <code>container-fluid</code>."
|
"Let's nest your <code>h3</code> element within a <code>div</code> element with the class <code>container-fluid</code>."
|
||||||
@ -1683,7 +1663,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bad87fee1348bd9bec908846",
|
"id": "bad87fee1348bd9bec908846",
|
||||||
"title": "Create a Bootstrap Row",
|
"title": "Create a Bootstrap Row",
|
||||||
"difficulty": 2.19,
|
|
||||||
"description": [
|
"description": [
|
||||||
"Now we'll create a Bootstrap row for our inline elements.",
|
"Now we'll create a Bootstrap row for our inline elements.",
|
||||||
"Create a <code>div</code> element with the class <code>row</code>."
|
"Create a <code>div</code> element with the class <code>row</code>."
|
||||||
@ -1716,7 +1695,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bad87fee1348bd9aec908847",
|
"id": "bad87fee1348bd9aec908847",
|
||||||
"title": "Split your Bootstrap Row",
|
"title": "Split your Bootstrap Row",
|
||||||
"difficulty": 2.20,
|
|
||||||
"description": [
|
"description": [
|
||||||
"Now that we have a Bootstrap Row, let's split it into two columns to house our elements.",
|
"Now that we have a Bootstrap Row, let's split it into two columns to house our elements.",
|
||||||
"Create two <code>div</code> elements within your row, both with the class <code>col-xs-6</code>."
|
"Create two <code>div</code> elements within your row, both with the class <code>col-xs-6</code>."
|
||||||
@ -1750,7 +1728,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bad87fee1348bd9aec908848",
|
"id": "bad87fee1348bd9aec908848",
|
||||||
"title": "Create Bootstrap Wells",
|
"title": "Create Bootstrap Wells",
|
||||||
"difficulty": 2.21,
|
|
||||||
"description": [
|
"description": [
|
||||||
"Bootstrap has a class called <code>well</code> that can create a visual sense of depth for your columns.",
|
"Bootstrap has a class called <code>well</code> that can create a visual sense of depth for your columns.",
|
||||||
"Nest one <code>div</code> element with the class <code>well</code> within each of your <code>col-xs-6</code> <code>div</code> elements."
|
"Nest one <code>div</code> element with the class <code>well</code> within each of your <code>col-xs-6</code> <code>div</code> elements."
|
||||||
@ -1789,7 +1766,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bad87fee1348bd9aec908849",
|
"id": "bad87fee1348bd9aec908849",
|
||||||
"title": "Add Elements within your Bootstrap Wells",
|
"title": "Add Elements within your Bootstrap Wells",
|
||||||
"difficulty": 2.22,
|
|
||||||
"description": [
|
"description": [
|
||||||
"Now we're several <code>div</code> elements deep on each column of our row. This is as deep as we'll need to go. Now we can add our <code>button</code> elements.",
|
"Now we're several <code>div</code> elements deep on each column of our row. This is as deep as we'll need to go. Now we can add our <code>button</code> elements.",
|
||||||
"Nest three <code>button</code> elements within each of your <code>well</code> <code>div</code> elements."
|
"Nest three <code>button</code> elements within each of your <code>well</code> <code>div</code> elements."
|
||||||
@ -1836,7 +1812,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bad87fee1348bd9aec908850",
|
"id": "bad87fee1348bd9aec908850",
|
||||||
"title": "Apply the Default Bootstrap Button Style",
|
"title": "Apply the Default Bootstrap Button Style",
|
||||||
"difficulty": 2.23,
|
|
||||||
"description": [
|
"description": [
|
||||||
"Bootstrap has another button class called <code>btn-default</code>.",
|
"Bootstrap has another button class called <code>btn-default</code>.",
|
||||||
"Apply both the <code>btn</code> and <code>btn-default</code> classes to each of your <code>button</code> elements."
|
"Apply both the <code>btn</code> and <code>btn-default</code> classes to each of your <code>button</code> elements."
|
||||||
@ -1882,7 +1857,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bad87fee1348bd9aec908852",
|
"id": "bad87fee1348bd9aec908852",
|
||||||
"title": "Create a Class to Target with jQuery Selectors",
|
"title": "Create a Class to Target with jQuery Selectors",
|
||||||
"difficulty": 2.24,
|
|
||||||
"description": [
|
"description": [
|
||||||
"Not every class needs to have corresponding CSS. Sometimes we create classes just for the purpose of selecting these elements more easily using jQuery.",
|
"Not every class needs to have corresponding CSS. Sometimes we create classes just for the purpose of selecting these elements more easily using jQuery.",
|
||||||
"Give each of your <code>button</code> elements the class <code>target</code>."
|
"Give each of your <code>button</code> elements the class <code>target</code>."
|
||||||
@ -1927,7 +1901,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bad87fee1348bd9aec908853",
|
"id": "bad87fee1348bd9aec908853",
|
||||||
"title": "Add ID Attributes to Bootstrap Elements",
|
"title": "Add ID Attributes to Bootstrap Elements",
|
||||||
"difficulty": 2.25,
|
|
||||||
"description": [
|
"description": [
|
||||||
"Recall that in addition to class attributes, you can give each of your elements an <code>id</code> attribute.",
|
"Recall that in addition to class attributes, you can give each of your elements an <code>id</code> attribute.",
|
||||||
"Each id should be unique to a specific element.",
|
"Each id should be unique to a specific element.",
|
||||||
@ -1976,7 +1949,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bad87fee1348bd9aec908854",
|
"id": "bad87fee1348bd9aec908854",
|
||||||
"title": "Label Bootstrap Wells",
|
"title": "Label Bootstrap Wells",
|
||||||
"difficulty": 2.26,
|
|
||||||
"description": [
|
"description": [
|
||||||
"For the sake of clarity, let's label both of our wells with their ids.",
|
"For the sake of clarity, let's label both of our wells with their ids.",
|
||||||
"Above your left-well, inside its <code>col-xs-6</code> <code>div</code> element, add a <code>h4</code> element with the text <code>#left-well</code>.",
|
"Above your left-well, inside its <code>col-xs-6</code> <code>div</code> element, add a <code>h4</code> element with the text <code>#left-well</code>.",
|
||||||
@ -2027,7 +1999,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bad87fee1348bd9aec908855",
|
"id": "bad87fee1348bd9aec908855",
|
||||||
"title": "Give Each Element a Unique ID",
|
"title": "Give Each Element a Unique ID",
|
||||||
"difficulty": 2.27,
|
|
||||||
"description": [
|
"description": [
|
||||||
"We will also want to be able to use jQuery to target each button by its unique id.",
|
"We will also want to be able to use jQuery to target each button by its unique id.",
|
||||||
"Give each of your buttons a unique id like, starting with <code>target1</code> and ending with <code>target6</code>."
|
"Give each of your buttons a unique id like, starting with <code>target1</code> and ending with <code>target6</code>."
|
||||||
@ -2079,7 +2050,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bad87fee1348bd9aec908856",
|
"id": "bad87fee1348bd9aec908856",
|
||||||
"title": "Label Bootstrap Buttons",
|
"title": "Label Bootstrap Buttons",
|
||||||
"difficulty": 2.28,
|
|
||||||
"description": [
|
"description": [
|
||||||
"Just like we labeled our wells, we want to label our buttons.",
|
"Just like we labeled our wells, we want to label our buttons.",
|
||||||
"Give each of your <code>button</code> elements text that corresponds to their <code>id</code>."
|
"Give each of your <code>button</code> elements text that corresponds to their <code>id</code>."
|
||||||
@ -2131,7 +2101,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bad87fee1348bd9aec908857",
|
"id": "bad87fee1348bd9aec908857",
|
||||||
"title": "Use Comments to Clarify Code",
|
"title": "Use Comments to Clarify Code",
|
||||||
"difficulty": 2.29,
|
|
||||||
"description": [
|
"description": [
|
||||||
"When we start using jQuery, we will modify HTML elements without needing to actually change them in HTML.",
|
"When we start using jQuery, we will modify HTML elements without needing to actually change them in HTML.",
|
||||||
"Let's make sure that everyone knows they shouldn't actually modify any of this code directly.",
|
"Let's make sure that everyone knows they shouldn't actually modify any of this code directly.",
|
||||||
|
@ -5,7 +5,6 @@
|
|||||||
{
|
{
|
||||||
"id": "560add10cb82ac38a17513be",
|
"id": "560add10cb82ac38a17513be",
|
||||||
"title": "Learn how Free Code Camp Works",
|
"title": "Learn how Free Code Camp Works",
|
||||||
"difficulty": 0.00,
|
|
||||||
"challengeSeed": [],
|
"challengeSeed": [],
|
||||||
"description": [
|
"description": [
|
||||||
[
|
[
|
||||||
@ -62,7 +61,6 @@
|
|||||||
{
|
{
|
||||||
"id": "560add37cb82ac38a17513bf",
|
"id": "560add37cb82ac38a17513bf",
|
||||||
"title": "Create a GitHub Account and Join our Chat Rooms",
|
"title": "Create a GitHub Account and Join our Chat Rooms",
|
||||||
"difficulty": 0.01,
|
|
||||||
"challengeSeed": [],
|
"challengeSeed": [],
|
||||||
"description": [
|
"description": [
|
||||||
[
|
[
|
||||||
@ -137,7 +135,6 @@
|
|||||||
{
|
{
|
||||||
"id": "560add56cb82ac38a17513c0",
|
"id": "560add56cb82ac38a17513c0",
|
||||||
"title": "Configure your Public Profile",
|
"title": "Configure your Public Profile",
|
||||||
"difficulty": 0.02,
|
|
||||||
"challengeSeed": [],
|
"challengeSeed": [],
|
||||||
"description": [
|
"description": [
|
||||||
[
|
[
|
||||||
@ -170,7 +167,6 @@
|
|||||||
{
|
{
|
||||||
"id": "560add65cb82ac38a17513c1",
|
"id": "560add65cb82ac38a17513c1",
|
||||||
"title": "Try our Wiki and Camper News",
|
"title": "Try our Wiki and Camper News",
|
||||||
"difficulty": 0.03,
|
|
||||||
"challengeSeed": [],
|
"challengeSeed": [],
|
||||||
"description": [
|
"description": [
|
||||||
[
|
[
|
||||||
@ -203,7 +199,6 @@
|
|||||||
{
|
{
|
||||||
"id": "560add71cb82ac38a17513c2",
|
"id": "560add71cb82ac38a17513c2",
|
||||||
"title": "Join a Campsite in Your City",
|
"title": "Join a Campsite in Your City",
|
||||||
"difficulty": 0.04,
|
|
||||||
"challengeSeed": [],
|
"challengeSeed": [],
|
||||||
"description": [
|
"description": [
|
||||||
[
|
[
|
||||||
@ -236,7 +231,6 @@
|
|||||||
{
|
{
|
||||||
"id": "560add8ccb82ac38a17513c3",
|
"id": "560add8ccb82ac38a17513c3",
|
||||||
"title": "Join our Alumni Network and Commit to Your Goal",
|
"title": "Join our Alumni Network and Commit to Your Goal",
|
||||||
"difficulty": 0.05,
|
|
||||||
"challengeSeed": [],
|
"challengeSeed": [],
|
||||||
"description": [
|
"description": [
|
||||||
[
|
[
|
||||||
@ -269,7 +263,6 @@
|
|||||||
{
|
{
|
||||||
"id": "560add8ccb82ac38a17513c4",
|
"id": "560add8ccb82ac38a17513c4",
|
||||||
"title": "Learn What to Do If You Get Stuck",
|
"title": "Learn What to Do If You Get Stuck",
|
||||||
"difficulty": 0.06,
|
|
||||||
"challengeSeed": [],
|
"challengeSeed": [],
|
||||||
"description": [
|
"description": [
|
||||||
[
|
[
|
||||||
|
@ -5,7 +5,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bd7353d8c341eddeaeb5bd0f",
|
"id": "bd7353d8c341eddeaeb5bd0f",
|
||||||
"title": "Save your Code Revisions Forever with Git",
|
"title": "Save your Code Revisions Forever with Git",
|
||||||
"difficulty": 0.01,
|
|
||||||
"challengeSeed": ["133316034"],
|
"challengeSeed": ["133316034"],
|
||||||
"description": [
|
"description": [
|
||||||
"We'll build this Waypoint on Cloud 9, a powerful online code editor with a full Ubuntu Linux workspace, all running in the cloud.",
|
"We'll build this Waypoint on Cloud 9, a powerful online code editor with a full Ubuntu Linux workspace, all running in the cloud.",
|
||||||
|
@ -5,7 +5,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bd7128d8c441eddfbeb5bddf",
|
"id": "bd7128d8c441eddfbeb5bddf",
|
||||||
"title": "Computer Basics 1: The 4 Basic Parts of a Computer",
|
"title": "Computer Basics 1: The 4 Basic Parts of a Computer",
|
||||||
"difficulty": 9.01,
|
|
||||||
"challengeSeed": [
|
"challengeSeed": [
|
||||||
"132542064"
|
"132542064"
|
||||||
],
|
],
|
||||||
@ -45,7 +44,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bd7127d8c441eddfbeb5bddf",
|
"id": "bd7127d8c441eddfbeb5bddf",
|
||||||
"title": "Computer Basics 2: More Computer Hardware",
|
"title": "Computer Basics 2: More Computer Hardware",
|
||||||
"difficulty": 9.02,
|
|
||||||
"challengeSeed": [
|
"challengeSeed": [
|
||||||
"132542458"
|
"132542458"
|
||||||
],
|
],
|
||||||
@ -84,7 +82,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bd7126d8c441eddfbeb5bddf",
|
"id": "bd7126d8c441eddfbeb5bddf",
|
||||||
"title": "Computer Basics 3: Intro to Binary Code",
|
"title": "Computer Basics 3: Intro to Binary Code",
|
||||||
"difficulty": 9.03,
|
|
||||||
"challengeSeed": [
|
"challengeSeed": [
|
||||||
"132542757"
|
"132542757"
|
||||||
],
|
],
|
||||||
@ -118,7 +115,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bd7125d8c441eddfbeb5bddf",
|
"id": "bd7125d8c441eddfbeb5bddf",
|
||||||
"title": "Computer Basics 4: Decoding a Binary Number",
|
"title": "Computer Basics 4: Decoding a Binary Number",
|
||||||
"difficulty": 9.04,
|
|
||||||
"challengeSeed": [
|
"challengeSeed": [
|
||||||
"132543332"
|
"132543332"
|
||||||
],
|
],
|
||||||
@ -154,7 +150,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bd7124d8c441eddfbeb5bddf",
|
"id": "bd7124d8c441eddfbeb5bddf",
|
||||||
"title": "Computer Basics 5: How To Measure Data Size",
|
"title": "Computer Basics 5: How To Measure Data Size",
|
||||||
"difficulty": 9.05,
|
|
||||||
"challengeSeed": [
|
"challengeSeed": [
|
||||||
"132543959"
|
"132543959"
|
||||||
],
|
],
|
||||||
@ -193,7 +188,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bd7123d8c441eddfbeb5bddf",
|
"id": "bd7123d8c441eddfbeb5bddf",
|
||||||
"title": "Computer Basics 6: Measuring Data Speed",
|
"title": "Computer Basics 6: Measuring Data Speed",
|
||||||
"difficulty": 9.06,
|
|
||||||
"challengeSeed": [
|
"challengeSeed": [
|
||||||
"132545171"
|
"132545171"
|
||||||
],
|
],
|
||||||
@ -230,7 +224,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bd7122d8c441eddfbeb5bddf",
|
"id": "bd7122d8c441eddfbeb5bddf",
|
||||||
"title": "Computer Basics 7: Binary Bytes",
|
"title": "Computer Basics 7: Binary Bytes",
|
||||||
"difficulty": 9.07,
|
|
||||||
"challengeSeed": [
|
"challengeSeed": [
|
||||||
"132545417"
|
"132545417"
|
||||||
],
|
],
|
||||||
@ -264,7 +257,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bd7121d8c441eddfbeb5bddf",
|
"id": "bd7121d8c441eddfbeb5bddf",
|
||||||
"title": "Computer Basics 8: Types of Computers",
|
"title": "Computer Basics 8: Types of Computers",
|
||||||
"difficulty": 9.08,
|
|
||||||
"challengeSeed": [
|
"challengeSeed": [
|
||||||
"132546182"
|
"132546182"
|
||||||
],
|
],
|
||||||
@ -303,7 +295,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bd7120d8c441eddfbeb5bddf",
|
"id": "bd7120d8c441eddfbeb5bddf",
|
||||||
"title": "Computer Basics 9: More on the Motherboard",
|
"title": "Computer Basics 9: More on the Motherboard",
|
||||||
"difficulty": 9.09,
|
|
||||||
"challengeSeed": [
|
"challengeSeed": [
|
||||||
"132547285"
|
"132547285"
|
||||||
],
|
],
|
||||||
@ -344,7 +335,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bd712fd8c441eddfbeb5bddf",
|
"id": "bd712fd8c441eddfbeb5bddf",
|
||||||
"title": "Computer Basics 10: Data Networks",
|
"title": "Computer Basics 10: Data Networks",
|
||||||
"difficulty": 9.10,
|
|
||||||
"challengeSeed": [
|
"challengeSeed": [
|
||||||
"132547590"
|
"132547590"
|
||||||
],
|
],
|
||||||
@ -384,7 +374,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bd712ed8c441eddfbeb5bddf",
|
"id": "bd712ed8c441eddfbeb5bddf",
|
||||||
"title": "Computer Basics 11: IP Addresses",
|
"title": "Computer Basics 11: IP Addresses",
|
||||||
"difficulty": 9.11,
|
|
||||||
"challengeSeed": [
|
"challengeSeed": [
|
||||||
"132548071"
|
"132548071"
|
||||||
],
|
],
|
||||||
@ -423,7 +412,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bd712dd8c441eddfbeb5bddf",
|
"id": "bd712dd8c441eddfbeb5bddf",
|
||||||
"title": "Computer Basics 12: How the Internet Works",
|
"title": "Computer Basics 12: How the Internet Works",
|
||||||
"difficulty": 9.12,
|
|
||||||
"challengeSeed": [
|
"challengeSeed": [
|
||||||
"132548579"
|
"132548579"
|
||||||
],
|
],
|
||||||
@ -462,7 +450,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bd712cd8c441eddfbeb5bddf",
|
"id": "bd712cd8c441eddfbeb5bddf",
|
||||||
"title": "Computer Basics 13: Software",
|
"title": "Computer Basics 13: Software",
|
||||||
"difficulty": 9.13,
|
|
||||||
"challengeSeed": [
|
"challengeSeed": [
|
||||||
"132548908"
|
"132548908"
|
||||||
],
|
],
|
||||||
@ -495,7 +482,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bd712bd8c441eddfbeb5bddf",
|
"id": "bd712bd8c441eddfbeb5bddf",
|
||||||
"title": "What Do Programmers Do?",
|
"title": "What Do Programmers Do?",
|
||||||
"difficulty": 9.14,
|
|
||||||
"challengeSeed": [
|
"challengeSeed": [
|
||||||
"133166912"
|
"133166912"
|
||||||
],
|
],
|
||||||
@ -532,7 +518,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bd712ad8c441eddfbeb5bddf",
|
"id": "bd712ad8c441eddfbeb5bddf",
|
||||||
"title": "Console and Logging",
|
"title": "Console and Logging",
|
||||||
"difficulty": 9.15,
|
|
||||||
"challengeSeed": [
|
"challengeSeed": [
|
||||||
"133170880"
|
"133170880"
|
||||||
],
|
],
|
||||||
@ -569,7 +554,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bd7119d8c441eddfbeb5bddf",
|
"id": "bd7119d8c441eddfbeb5bddf",
|
||||||
"title": "Variables In Code",
|
"title": "Variables In Code",
|
||||||
"difficulty": 9.16,
|
|
||||||
"challengeSeed": [
|
"challengeSeed": [
|
||||||
"133172920"
|
"133172920"
|
||||||
],
|
],
|
||||||
@ -602,7 +586,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bd7029d8c441eddfbeb5bddf",
|
"id": "bd7029d8c441eddfbeb5bddf",
|
||||||
"title": "Source Code",
|
"title": "Source Code",
|
||||||
"difficulty": 9.17,
|
|
||||||
"challengeSeed": [
|
"challengeSeed": [
|
||||||
"133177129"
|
"133177129"
|
||||||
],
|
],
|
||||||
@ -647,7 +630,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bd7129d8b441eddfbeb5bddf",
|
"id": "bd7129d8b441eddfbeb5bddf",
|
||||||
"title": "Routers and Packets",
|
"title": "Routers and Packets",
|
||||||
"difficulty": 9.18,
|
|
||||||
"challengeSeed": [
|
"challengeSeed": [
|
||||||
"133181251"
|
"133181251"
|
||||||
],
|
],
|
||||||
@ -698,7 +680,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bd7129d8a441eddfbeb5bddf",
|
"id": "bd7129d8a441eddfbeb5bddf",
|
||||||
"title": "Hardware: Chips and Moore's Law",
|
"title": "Hardware: Chips and Moore's Law",
|
||||||
"difficulty": 9.19,
|
|
||||||
"challengeSeed": [
|
"challengeSeed": [
|
||||||
"133182057"
|
"133182057"
|
||||||
],
|
],
|
||||||
@ -735,7 +716,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bd7129d80441eddfbeb5bddf",
|
"id": "bd7129d80441eddfbeb5bddf",
|
||||||
"title": "Analog vs Digital and File Compression",
|
"title": "Analog vs Digital and File Compression",
|
||||||
"difficulty": 9.20,
|
|
||||||
"challengeSeed": [
|
"challengeSeed": [
|
||||||
"133182587"
|
"133182587"
|
||||||
],
|
],
|
||||||
@ -774,7 +754,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bd7129d89441eddfbeb5bddf",
|
"id": "bd7129d89441eddfbeb5bddf",
|
||||||
"title": "Computer Security",
|
"title": "Computer Security",
|
||||||
"difficulty": 9.21,
|
|
||||||
"challengeSeed": [
|
"challengeSeed": [
|
||||||
"133186284"
|
"133186284"
|
||||||
],
|
],
|
||||||
|
@ -5,7 +5,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bd7123c8c441eddfaeb5bdef",
|
"id": "bd7123c8c441eddfaeb5bdef",
|
||||||
"title": "Say Hello to HTML Elements",
|
"title": "Say Hello to HTML Elements",
|
||||||
"difficulty": 1.01,
|
|
||||||
"description": [
|
"description": [
|
||||||
"Welcome to Free Code Camp's first coding challenge!",
|
"Welcome to Free Code Camp's first coding challenge!",
|
||||||
"You can edit <code>code</code> in your <code>text editor</code>, which we've embedded into this web page.",
|
"You can edit <code>code</code> in your <code>text editor</code>, which we've embedded into this web page.",
|
||||||
@ -54,8 +53,9 @@
|
|||||||
{
|
{
|
||||||
"id": "bad87fee1348bd9aedf0887a",
|
"id": "bad87fee1348bd9aedf0887a",
|
||||||
"title": "Headline with the h2 Element",
|
"title": "Headline with the h2 Element",
|
||||||
"difficulty": 1.02,
|
|
||||||
"description": [
|
"description": [
|
||||||
|
"Over the next few challenges, we'll build an HTML5 app that will look something like this:",
|
||||||
|
"<a href=\"http://i.imgur.com/jOc1JF1.png\" data-lightbox=\"img-enlarge\"><img class=\"img-responsive\" src=\"http://i.imgur.com/jOc1JF1.png\" title=\"Click to enlarge\" alt=\"A screen shot of our finished Cat Photo App\"></a>",
|
||||||
"Add an <code>h2</code> tag that says \"CatPhotoApp\" to create a second HTML <code>element</code> below your \"Hello World\" <code>h1</code> element.",
|
"Add an <code>h2</code> tag that says \"CatPhotoApp\" to create a second HTML <code>element</code> below your \"Hello World\" <code>h1</code> element.",
|
||||||
"The <code>h2</code> element you enter will create an <code>h2</code> element on the website.",
|
"The <code>h2</code> element you enter will create an <code>h2</code> element on the website.",
|
||||||
"This element tells the browser how to render the text that it contains.",
|
"This element tells the browser how to render the text that it contains.",
|
||||||
@ -98,7 +98,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bad87fee1348bd9aedf08801",
|
"id": "bad87fee1348bd9aedf08801",
|
||||||
"title": "Inform with the Paragraph Element",
|
"title": "Inform with the Paragraph Element",
|
||||||
"difficulty": 1.03,
|
|
||||||
"description": [
|
"description": [
|
||||||
"Create a <code>p</code> element below your <code>h2</code> element, and give it the text \"Hello Paragraph\".",
|
"Create a <code>p</code> element below your <code>h2</code> element, and give it the text \"Hello Paragraph\".",
|
||||||
"<code>p</code> elements are the preferred element for normal-sized paragraph text on websites. P is short for \"paragraph\".",
|
"<code>p</code> elements are the preferred element for normal-sized paragraph text on websites. P is short for \"paragraph\".",
|
||||||
@ -139,7 +138,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bad87fee1348bd9aedf08802",
|
"id": "bad87fee1348bd9aedf08802",
|
||||||
"title": "Uncomment HTML",
|
"title": "Uncomment HTML",
|
||||||
"difficulty": 1.04,
|
|
||||||
"description": [
|
"description": [
|
||||||
"Uncomment your <code>h1</code>, <code>h2</code> and <code>p</code> elements.",
|
"Uncomment your <code>h1</code>, <code>h2</code> and <code>p</code> elements.",
|
||||||
"Commenting is a way that you can leave comments within your code without affecting the code itself.",
|
"Commenting is a way that you can leave comments within your code without affecting the code itself.",
|
||||||
@ -189,7 +187,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bad87fee1348bd9aedf08804",
|
"id": "bad87fee1348bd9aedf08804",
|
||||||
"title": "Comment out HTML",
|
"title": "Comment out HTML",
|
||||||
"difficulty": 1.05,
|
|
||||||
"description": [
|
"description": [
|
||||||
"Comment out your <code>h1</code> element and your <code>p</code> element, but leave your <code>h2</code> element uncommented.",
|
"Comment out your <code>h1</code> element and your <code>p</code> element, but leave your <code>h2</code> element uncommented.",
|
||||||
"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>.",
|
"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>.",
|
||||||
@ -236,7 +233,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bad87fee1348bd9aedf08833",
|
"id": "bad87fee1348bd9aedf08833",
|
||||||
"title": "Fill in the Blank with Placeholder Text",
|
"title": "Fill in the Blank with Placeholder Text",
|
||||||
"difficulty": 1.06,
|
|
||||||
"description": [
|
"description": [
|
||||||
"Web developers traditionally use <code>lorem ipsum text</code> as placeholder text. It's called <code>lorem ipsum text</code> because those are the first two words of a famous passage by Cicero of Ancient Rome.",
|
"Web developers traditionally use <code>lorem ipsum text</code> as placeholder text. It's called <code>lorem ipsum text</code> because those are the first two words of a famous passage by Cicero of Ancient Rome.",
|
||||||
"<code>lorem ipsum text</code> has been used as placeholder text by typesetters since the 16th century, and this tradition continues on the web.",
|
"<code>lorem ipsum text</code> has been used as placeholder text by typesetters since the 16th century, and this tradition continues on the web.",
|
||||||
@ -283,7 +279,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bad87fed1348bd9aedf08833",
|
"id": "bad87fed1348bd9aedf08833",
|
||||||
"title": "Delete HTML Elements",
|
"title": "Delete HTML Elements",
|
||||||
"difficulty": 1.07,
|
|
||||||
"description": [
|
"description": [
|
||||||
"Delete your <code>h1</code> element so we can simplify our view.",
|
"Delete your <code>h1</code> element so we can simplify our view.",
|
||||||
"Our phone doesn't have much vertical space.",
|
"Our phone doesn't have much vertical space.",
|
||||||
@ -327,7 +322,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bad87fee1348bd9aedf08803",
|
"id": "bad87fee1348bd9aedf08803",
|
||||||
"title": "Change the Color of Text",
|
"title": "Change the Color of Text",
|
||||||
"difficulty": 1.08,
|
|
||||||
"description": [
|
"description": [
|
||||||
"Change your <code>h2</code> element's style so that its text color is red.",
|
"Change your <code>h2</code> element's style so that its text color is red.",
|
||||||
"We can do this by changing the \"style\" of your <code>h2</code> element.",
|
"We can do this by changing the \"style\" of your <code>h2</code> element.",
|
||||||
@ -369,7 +363,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bad87fee1348bd9aedf08805",
|
"id": "bad87fee1348bd9aedf08805",
|
||||||
"title": "Use CSS Selectors to Style Elements",
|
"title": "Use CSS Selectors to Style Elements",
|
||||||
"difficulty": 1.09,
|
|
||||||
"description": [
|
"description": [
|
||||||
"Delete your <code>h2</code> element's style attribute and instead create a CSS <code>style</code> element. Add the necessary CSS to turn all <code>h2</code> elements blue.",
|
"Delete your <code>h2</code> element's style attribute and instead create a CSS <code>style</code> element. Add the necessary CSS to turn all <code>h2</code> elements blue.",
|
||||||
"With CSS, there are hundreds of CSS <code>properties</code> that you can use to change the way an element looks on your page.",
|
"With CSS, there are hundreds of CSS <code>properties</code> that you can use to change the way an element looks on your page.",
|
||||||
@ -424,7 +417,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bad87fee1348bd9aecf08806",
|
"id": "bad87fee1348bd9aecf08806",
|
||||||
"title": "Use a CSS Class to Style an Element",
|
"title": "Use a CSS Class to Style an Element",
|
||||||
"difficulty": 1.11,
|
|
||||||
"description": [
|
"description": [
|
||||||
"Create a CSS class called <code>red-text</code> and apply it to your <code>h2</code> element.",
|
"Create a CSS class called <code>red-text</code> and apply it to your <code>h2</code> element.",
|
||||||
"Classes are reusable styles that can be added to HTML elements.",
|
"Classes are reusable styles that can be added to HTML elements.",
|
||||||
@ -491,7 +483,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bad87fee1348bd9aefe08806",
|
"id": "bad87fee1348bd9aefe08806",
|
||||||
"title": "Style Multiple Elements with a CSS Class",
|
"title": "Style Multiple Elements with a CSS Class",
|
||||||
"difficulty": 1.12,
|
|
||||||
"description": [
|
"description": [
|
||||||
"Apply the <code>red-text</code> class to your <code>h2</code> and <code>p</code> elements.",
|
"Apply the <code>red-text</code> class to your <code>h2</code> and <code>p</code> elements.",
|
||||||
"Remember that you can attach classes to HTML elements by using <code>class=\"your-class-here\"</code> within the relevant element's opening tag.",
|
"Remember that you can attach classes to HTML elements by using <code>class=\"your-class-here\"</code> within the relevant element's opening tag.",
|
||||||
@ -540,7 +531,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bad87fee1348bd9aedf08806",
|
"id": "bad87fee1348bd9aedf08806",
|
||||||
"title": "Change the Font Size of an Element",
|
"title": "Change the Font Size of an Element",
|
||||||
"difficulty": 1.13,
|
|
||||||
"description": [
|
"description": [
|
||||||
"Create a second <code>p</code> element with the following <code>kitty ipsum text</code>: <code>Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched.</code>",
|
"Create a second <code>p</code> element with the following <code>kitty ipsum text</code>: <code>Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched.</code>",
|
||||||
"Then, inside your <code><style></code> element, set the <code>font-size</code> of all <code>p</code> elements to 16 pixels.",
|
"Then, inside your <code><style></code> element, set the <code>font-size</code> of all <code>p</code> elements to 16 pixels.",
|
||||||
@ -593,7 +583,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bad87fee1348bd9aede08807",
|
"id": "bad87fee1348bd9aede08807",
|
||||||
"title": "Set the Font Family of an Element",
|
"title": "Set the Font Family of an Element",
|
||||||
"difficulty": 1.14,
|
|
||||||
"description": [
|
"description": [
|
||||||
"Make all of your <code>p</code> elements use the <code>Monospace</code> font.",
|
"Make all of your <code>p</code> elements use the <code>Monospace</code> font.",
|
||||||
"You can set an element's font by using the <code>font-family</code> property.",
|
"You can set an element's font by using the <code>font-family</code> property.",
|
||||||
@ -640,7 +629,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bad87fee1348bd9aedf08807",
|
"id": "bad87fee1348bd9aedf08807",
|
||||||
"title": "Import a Google Font",
|
"title": "Import a Google Font",
|
||||||
"difficulty": 1.15,
|
|
||||||
"description": [
|
"description": [
|
||||||
"Apply the <code>font-family</code> of <code>Lobster</code> to your <code>h2</code> element.",
|
"Apply the <code>font-family</code> of <code>Lobster</code> to your <code>h2</code> element.",
|
||||||
"First, you'll need to make a <code>call</code> to Google to grab the <code>Lobster</code> font and load it into your HTML.",
|
"First, you'll need to make a <code>call</code> to Google to grab the <code>Lobster</code> font and load it into your HTML.",
|
||||||
@ -694,7 +682,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bad87fee1348bd9aedf08808",
|
"id": "bad87fee1348bd9aedf08808",
|
||||||
"title": "Specify How Fonts Should Degrade",
|
"title": "Specify How Fonts Should Degrade",
|
||||||
"difficulty": 1.16,
|
|
||||||
"description": [
|
"description": [
|
||||||
"There are several default fonts that are available in all browsers. These include <code>Monospace</code>, <code>Serif</code> and <code>Sans-Serif</code>. Leave <code>Lobster</code> as the font-family for your <code>h2</code> elements. Make them \"degrade\" to <code>Monospace</code> when <code>Lobster</code> isn't available.",
|
"There are several default fonts that are available in all browsers. These include <code>Monospace</code>, <code>Serif</code> and <code>Sans-Serif</code>. Leave <code>Lobster</code> as the font-family for your <code>h2</code> elements. Make them \"degrade\" to <code>Monospace</code> when <code>Lobster</code> isn't available.",
|
||||||
"For example, if you wanted an element to use the <code>Helvetica</code> font, but also degrade to the <code>Sans-Serif</code> font when <code>Helvetica</code> wasn't available, you could use this CSS style: <code>p { font-family: Helvetica, Sans-Serif; }</code>.",
|
"For example, if you wanted an element to use the <code>Helvetica</code> font, but also degrade to the <code>Sans-Serif</code> font when <code>Helvetica</code> wasn't available, you could use this CSS style: <code>p { font-family: Helvetica, Sans-Serif; }</code>.",
|
||||||
@ -752,7 +739,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bad87fee1348bd9aedf08812",
|
"id": "bad87fee1348bd9aedf08812",
|
||||||
"title": "Add Images to your Website",
|
"title": "Add Images to your Website",
|
||||||
"difficulty": 1.17,
|
|
||||||
"description": [
|
"description": [
|
||||||
"You can add images to your website by using the <code>img</code> element, and point to a specific image's URL using the <code>src</code> attribute.",
|
"You can add images to your website by using the <code>img</code> element, and point to a specific image's URL using the <code>src</code> attribute.",
|
||||||
"An example of this would be <code><img src=\"http://www.your-image-source.com/your-image.jpg\"></code>. Note that in most cases, <code>img</code> elements are self-closing.",
|
"An example of this would be <code><img src=\"http://www.your-image-source.com/your-image.jpg\"></code>. Note that in most cases, <code>img</code> elements are self-closing.",
|
||||||
@ -807,7 +793,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bad87fee1348bd9acdf08812",
|
"id": "bad87fee1348bd9acdf08812",
|
||||||
"title": "Size your Images",
|
"title": "Size your Images",
|
||||||
"difficulty": 1.18,
|
|
||||||
"description": [
|
"description": [
|
||||||
"CSS has a property called <code>width</code> that controls an element's width. Just like with fonts, we'll use <code>px</code> (pixels) to specify the image's width.",
|
"CSS has a property called <code>width</code> that controls an element's width. Just like with fonts, we'll use <code>px</code> (pixels) to specify the image's width.",
|
||||||
"For example, if we wanted to create a CSS class called <code>larger-image</code> that gave HTML elements a width of 500 pixels, we'd use: <code><style> .larger-image { width: 500px; } </style></code>.",
|
"For example, if we wanted to create a CSS class called <code>larger-image</code> that gave HTML elements a width of 500 pixels, we'd use: <code><style> .larger-image { width: 500px; } </style></code>.",
|
||||||
@ -863,7 +848,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bad87fee1348bd9bedf08813",
|
"id": "bad87fee1348bd9bedf08813",
|
||||||
"title": "Add Borders Around your Elements",
|
"title": "Add Borders Around your Elements",
|
||||||
"difficulty": 1.19,
|
|
||||||
"description": [
|
"description": [
|
||||||
"CSS borders have properties like <code>style</code>, <code>color</code> and <code>width</code>.",
|
"CSS borders have properties like <code>style</code>, <code>color</code> and <code>width</code>.",
|
||||||
"For example, if we wanted to create a red, 5 pixel border around an HTML element, we could use this class: <code><style> .thin-red-border { border-color: red; border-width: 5px; border-style: solid; } </style></code>.",
|
"For example, if we wanted to create a red, 5 pixel border around an HTML element, we could use this class: <code><style> .thin-red-border { border-color: red; border-width: 5px; border-style: solid; } </style></code>.",
|
||||||
@ -927,7 +911,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bad87fee1348bd9aedf08814",
|
"id": "bad87fee1348bd9aedf08814",
|
||||||
"title": "Add Rounded Corners with a Border Radius",
|
"title": "Add Rounded Corners with a Border Radius",
|
||||||
"difficulty": 1.20,
|
|
||||||
"description": [
|
"description": [
|
||||||
"Your cat photo currently has sharp corners. We can round out those corners with a CSS property called <code>border-radius</code>.",
|
"Your cat photo currently has sharp corners. We can round out those corners with a CSS property called <code>border-radius</code>.",
|
||||||
"You can specify a <code>border-radius</code> with pixels. This will affect how rounded the corners are. Add this property to your <code>thick-green-border</code> class and set it to <code>10px</code>.",
|
"You can specify a <code>border-radius</code> with pixels. This will affect how rounded the corners are. Add this property to your <code>thick-green-border</code> class and set it to <code>10px</code>.",
|
||||||
@ -993,7 +976,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bad87fee1348bd9aedf08815",
|
"id": "bad87fee1348bd9aedf08815",
|
||||||
"title": "Make Circular Images with a Border Radius",
|
"title": "Make Circular Images with a Border Radius",
|
||||||
"difficulty": 1.21,
|
|
||||||
"description": [
|
"description": [
|
||||||
"In addition to pixels, you can also specify a <code>border-radius</code> using a percentage.",
|
"In addition to pixels, you can also specify a <code>border-radius</code> using a percentage.",
|
||||||
"Give your cat photo a <code>border-radius</code> of <code>50%</code>."
|
"Give your cat photo a <code>border-radius</code> of <code>50%</code>."
|
||||||
@ -1058,7 +1040,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bad87fee1348bd9aedf08816",
|
"id": "bad87fee1348bd9aedf08816",
|
||||||
"title": "Link to External Pages with Anchor Elements",
|
"title": "Link to External Pages with Anchor Elements",
|
||||||
"difficulty": 1.22,
|
|
||||||
"description": [
|
"description": [
|
||||||
"<code>a</code> elements, also known as <code>anchor</code> elements, are used to link to content outside of the current page.",
|
"<code>a</code> elements, also known as <code>anchor</code> elements, are used to link to content outside of the current page.",
|
||||||
"Here's a diagram of an <code>a</code> element. In this case, the <code>a</code> element is used in the middle of a paragraph element, which means the link will appear in the middle of a sentence.",
|
"Here's a diagram of an <code>a</code> element. In this case, the <code>a</code> element is used in the middle of a paragraph element, which means the link will appear in the middle of a sentence.",
|
||||||
@ -1129,7 +1110,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bad87fee1348bd9aede08817",
|
"id": "bad87fee1348bd9aede08817",
|
||||||
"title": "Nest an Anchor Element within a Paragraph",
|
"title": "Nest an Anchor Element within a Paragraph",
|
||||||
"difficulty": 1.23,
|
|
||||||
"description": [
|
"description": [
|
||||||
"Again, here's a diagram of an <code>a</code> element for your reference:",
|
"Again, here's a diagram of an <code>a</code> element for your reference:",
|
||||||
"<a href=\"http://i.imgur.com/hviuZwe.png\" data-lightbox=\"img-enlarge\"><img class=\"img-responsive\" title=\"Click to enlarge\" alt=\"a diagram of how anchor tags are composed with the same text as on the following line\" src=\"http://i.imgur.com/hviuZwe.png\"></a>",
|
"<a href=\"http://i.imgur.com/hviuZwe.png\" data-lightbox=\"img-enlarge\"><img class=\"img-responsive\" title=\"Click to enlarge\" alt=\"a diagram of how anchor tags are composed with the same text as on the following line\" src=\"http://i.imgur.com/hviuZwe.png\"></a>",
|
||||||
@ -1206,7 +1186,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bad87fee1348bd9aedf08817",
|
"id": "bad87fee1348bd9aedf08817",
|
||||||
"title": "Make Dead Links using the Hash Symbol",
|
"title": "Make Dead Links using the Hash Symbol",
|
||||||
"difficulty": 1.24,
|
|
||||||
"description": [
|
"description": [
|
||||||
"Sometimes you want to add <code>a</code> elements to your website before you know where they will link.",
|
"Sometimes you want to add <code>a</code> elements to your website before you know where they will link.",
|
||||||
"This is also handy when you're changing the behavior of a link using <code>jQuery</code>, which we'll learn about later.",
|
"This is also handy when you're changing the behavior of a link using <code>jQuery</code>, which we'll learn about later.",
|
||||||
@ -1275,7 +1254,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bad87fee1348bd9aedf08820",
|
"id": "bad87fee1348bd9aedf08820",
|
||||||
"title": "Turn an Image into a Link",
|
"title": "Turn an Image into a Link",
|
||||||
"difficulty": 1.25,
|
|
||||||
"description": [
|
"description": [
|
||||||
"You can make elements into links by nesting them within an <code>a</code> element.",
|
"You can make elements into links by nesting them within an <code>a</code> element.",
|
||||||
"Nest your image within an <code>a</code> element. Here's an example: <code><a href=\"#\"><img src=\"http://bit.ly/fcc-running-cats\"/></a></code>.",
|
"Nest your image within an <code>a</code> element. Here's an example: <code><a href=\"#\"><img src=\"http://bit.ly/fcc-running-cats\"/></a></code>.",
|
||||||
@ -1348,7 +1326,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bad87fee1348bd9aedf08818",
|
"id": "bad87fee1348bd9aedf08818",
|
||||||
"title": "Add Alt Text to an Image for Accessibility",
|
"title": "Add Alt Text to an Image for Accessibility",
|
||||||
"difficulty": 1.26,
|
|
||||||
"description": [
|
"description": [
|
||||||
"<code>alt</code> attributes, also known as <code>alt text</code>, are what browsers will display if they fail to load the image. <code>alt</code> attributes are also important for blind or visually impaired users to understand what an image portrays. And search engines also look at <code>alt</code> attributes.",
|
"<code>alt</code> attributes, also known as <code>alt text</code>, are what browsers will display if they fail to load the image. <code>alt</code> attributes are also important for blind or visually impaired users to understand what an image portrays. And search engines also look at <code>alt</code> attributes.",
|
||||||
"In short, every image should have an <code>alt</code> attribute!",
|
"In short, every image should have an <code>alt</code> attribute!",
|
||||||
@ -1419,7 +1396,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bad87fee1348bd9aedf08827",
|
"id": "bad87fee1348bd9aedf08827",
|
||||||
"title": "Create a Bulleted Unordered List",
|
"title": "Create a Bulleted Unordered List",
|
||||||
"difficulty": 1.27,
|
|
||||||
"description": [
|
"description": [
|
||||||
"HTML has a special element for creating <code>unordered lists</code>, or bullet point-style lists.",
|
"HTML has a special element for creating <code>unordered lists</code>, or bullet point-style lists.",
|
||||||
"Unordered lists start with a <code><ul></code> element. Then they contain some number of <code><li></code> elements.",
|
"Unordered lists start with a <code><ul></code> element. Then they contain some number of <code><li></code> elements.",
|
||||||
@ -1497,7 +1473,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bad87fee1348bd9aedf08828",
|
"id": "bad87fee1348bd9aedf08828",
|
||||||
"title": "Create an Ordered List",
|
"title": "Create an Ordered List",
|
||||||
"difficulty": 1.28,
|
|
||||||
"description": [
|
"description": [
|
||||||
"HTML has a special element for creating <code>ordered lists</code>, or numbered-style lists.",
|
"HTML has a special element for creating <code>ordered lists</code>, or numbered-style lists.",
|
||||||
"Ordered lists start with a <code><ol></code> element. Then they contain some number of <code><li></code> elements.",
|
"Ordered lists start with a <code><ol></code> element. Then they contain some number of <code><li></code> elements.",
|
||||||
@ -1583,7 +1558,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bad87fee1348bd9aedf08829",
|
"id": "bad87fee1348bd9aedf08829",
|
||||||
"title": "Create a Text Field",
|
"title": "Create a Text Field",
|
||||||
"difficulty": 1.29,
|
|
||||||
"description": [
|
"description": [
|
||||||
"Now let's create a web <code>form</code>.",
|
"Now let's create a web <code>form</code>.",
|
||||||
"Text inputs are a convenient way to get input from your user.",
|
"Text inputs are a convenient way to get input from your user.",
|
||||||
@ -1662,7 +1636,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bad87fee1348bd9aedf08830",
|
"id": "bad87fee1348bd9aedf08830",
|
||||||
"title": "Add Placeholder Text to a Text Field",
|
"title": "Add Placeholder Text to a Text Field",
|
||||||
"difficulty": 1.30,
|
|
||||||
"description": [
|
"description": [
|
||||||
"Your placeholder text is what appears in your text <code>input</code> before your user has inputed anything.",
|
"Your placeholder text is what appears in your text <code>input</code> before your user has inputed anything.",
|
||||||
"You can create placeholder text like so: <code><input type=\"text\" placeholder=\"this is placeholder text\"></code>.",
|
"You can create placeholder text like so: <code><input type=\"text\" placeholder=\"this is placeholder text\"></code>.",
|
||||||
@ -1742,7 +1715,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bad87fee1348bd9aede08830",
|
"id": "bad87fee1348bd9aede08830",
|
||||||
"title": "Create a Form Element",
|
"title": "Create a Form Element",
|
||||||
"difficulty": 1.31,
|
|
||||||
"description": [
|
"description": [
|
||||||
"You can build web forms that actually submit data to a server using nothing more than pure HTML. You can do this by specifying an action on your <code>form</code> element.",
|
"You can build web forms that actually submit data to a server using nothing more than pure HTML. You can do this by specifying an action on your <code>form</code> element.",
|
||||||
"For example: <code><form action=\"/url-where-you-want-to-submit-form-data\"></form></code>.",
|
"For example: <code><form action=\"/url-where-you-want-to-submit-form-data\"></form></code>.",
|
||||||
@ -1823,7 +1795,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bad87fee1348bd9aedd08830",
|
"id": "bad87fee1348bd9aedd08830",
|
||||||
"title": "Add a Submit Button to a Form",
|
"title": "Add a Submit Button to a Form",
|
||||||
"difficulty": 1.32,
|
|
||||||
"description": [
|
"description": [
|
||||||
"Let's add a <code>submit</code> button to your form. Clicking this button will send the data from your form to the URL you specified with your form's <code>action</code> attribute.",
|
"Let's add a <code>submit</code> button to your form. Clicking this button will send the data from your form to the URL you specified with your form's <code>action</code> attribute.",
|
||||||
"Here's an example submit button: <code><button type=\"submit\">this button submits the form</button></code>.",
|
"Here's an example submit button: <code><button type=\"submit\">this button submits the form</button></code>.",
|
||||||
@ -1907,7 +1878,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bad87fee1348bd9aedc08830",
|
"id": "bad87fee1348bd9aedc08830",
|
||||||
"title": "Use HTML5 to Require a Field",
|
"title": "Use HTML5 to Require a Field",
|
||||||
"difficulty": 1.33,
|
|
||||||
"description": [
|
"description": [
|
||||||
"You can require specific form fields so that your user will not be able to submit your form until he or she has filled them out.",
|
"You can require specific form fields so that your user will not be able to submit your form until he or she has filled them out.",
|
||||||
"For example, if you wanted to make a text input field required, you can just add the word <code>required</code> within your <code>input</code> element, you would use: <code><input type=\"text\" required></code>.",
|
"For example, if you wanted to make a text input field required, you can just add the word <code>required</code> within your <code>input</code> element, you would use: <code><input type=\"text\" required></code>.",
|
||||||
@ -1989,7 +1959,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bad87fee1348bd9aedf08834",
|
"id": "bad87fee1348bd9aedf08834",
|
||||||
"title": "Create a Set of Radio Buttons",
|
"title": "Create a Set of Radio Buttons",
|
||||||
"difficulty": 1.34,
|
|
||||||
"description": [
|
"description": [
|
||||||
"You can use <code>radio buttons</code> for questions where you want the user to only give you one answer.",
|
"You can use <code>radio buttons</code> for questions where you want the user to only give you one answer.",
|
||||||
"Radio buttons are a type of <code>input</code>.",
|
"Radio buttons are a type of <code>input</code>.",
|
||||||
@ -2082,7 +2051,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bad87fee1348bd9aedf08835",
|
"id": "bad87fee1348bd9aedf08835",
|
||||||
"title": "Create a Set of Checkboxes",
|
"title": "Create a Set of Checkboxes",
|
||||||
"difficulty": 1.35,
|
|
||||||
"description": [
|
"description": [
|
||||||
"Forms commonly use <code>checkboxes</code> for questions that may have more than one answer.",
|
"Forms commonly use <code>checkboxes</code> for questions that may have more than one answer.",
|
||||||
"Checkboxes are a type of <code>input</code>.",
|
"Checkboxes are a type of <code>input</code>.",
|
||||||
@ -2172,7 +2140,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bad87fee1348bd9aedd08835",
|
"id": "bad87fee1348bd9aedd08835",
|
||||||
"title": "Check Radio Buttons and Checkboxes by Default",
|
"title": "Check Radio Buttons and Checkboxes by Default",
|
||||||
"difficulty": 1.37,
|
|
||||||
"description": [
|
"description": [
|
||||||
"You can set a checkbox or radio button to be checked by default using the <code>checked</code> attribute.",
|
"You can set a checkbox or radio button to be checked by default using the <code>checked</code> attribute.",
|
||||||
"To do this, just add the word \"checked\" to the inside of an input element. For example, <code><input type=\"radio\" name=\"test-name\" checked></code>.",
|
"To do this, just add the word \"checked\" to the inside of an input element. For example, <code><input type=\"radio\" name=\"test-name\" checked></code>.",
|
||||||
@ -2260,7 +2227,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bad87fee1348bd9aede08835",
|
"id": "bad87fee1348bd9aede08835",
|
||||||
"title": "Nest Many Elements within a Single Div Element",
|
"title": "Nest Many Elements within a Single Div Element",
|
||||||
"difficulty": 1.38,
|
|
||||||
"description": [
|
"description": [
|
||||||
"The <code>div</code> element, also known as a division element, is a general purpose container for other elements.",
|
"The <code>div</code> element, also known as a division element, is a general purpose container for other elements.",
|
||||||
"The <code>div</code> element is probably the most commonly used HTML element of all. It's useful for passing the CSS of its own class declarations down to all the elements that it contains.",
|
"The <code>div</code> element is probably the most commonly used HTML element of all. It's useful for passing the CSS of its own class declarations down to all the elements that it contains.",
|
||||||
@ -2355,7 +2321,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bad87fed1348bd9aede07836",
|
"id": "bad87fed1348bd9aede07836",
|
||||||
"title": "Give a Background Color to a Div Element",
|
"title": "Give a Background Color to a Div Element",
|
||||||
"difficulty": 1.39,
|
|
||||||
"description": [
|
"description": [
|
||||||
"You can set an element's background color with the <code>background-color</code> property.",
|
"You can set an element's background color with the <code>background-color</code> property.",
|
||||||
"For example, if you wanted an element's background color to be <code>green</code>, you'd use <code>.green-background { background-color: green; }</code> within your <code>style</code> element.",
|
"For example, if you wanted an element's background color to be <code>green</code>, you'd use <code>.green-background { background-color: green; }</code> within your <code>style</code> element.",
|
||||||
@ -2442,7 +2407,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bad87eee1348bd9aede07836",
|
"id": "bad87eee1348bd9aede07836",
|
||||||
"title": "Set the ID of an Element",
|
"title": "Set the ID of an Element",
|
||||||
"difficulty": 1.391,
|
|
||||||
"description": [
|
"description": [
|
||||||
"In addition to classes, each HTML element can also have an <code>id</code> attribute.",
|
"In addition to classes, each HTML element can also have an <code>id</code> attribute.",
|
||||||
"There are several benefits to using <code>id</code> attributes, and you'll learn more about them once you start using jQuery.",
|
"There are several benefits to using <code>id</code> attributes, and you'll learn more about them once you start using jQuery.",
|
||||||
@ -2533,7 +2497,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bad87dee1348bd9aede07836",
|
"id": "bad87dee1348bd9aede07836",
|
||||||
"title": "Use an ID Attribute to Style an Element",
|
"title": "Use an ID Attribute to Style an Element",
|
||||||
"difficulty": 1.392,
|
|
||||||
"description": [
|
"description": [
|
||||||
"One cool thing about <code>id</code> attributes is that, like classes, you can style them using CSS.",
|
"One cool thing about <code>id</code> attributes is that, like classes, you can style them using CSS.",
|
||||||
"Here's an example of how you can take your element with the <code>id</code> attribute of <code>cat-photo-element</code> and give it the background color of green. In your <code>style</code> element: <code>#cat-photo-element { background-color: green; }</code>",
|
"Here's an example of how you can take your element with the <code>id</code> attribute of <code>cat-photo-element</code> and give it the background color of green. In your <code>style</code> element: <code>#cat-photo-element { background-color: green; }</code>",
|
||||||
@ -2626,7 +2589,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bad88fee1348bd9aedf08825",
|
"id": "bad88fee1348bd9aedf08825",
|
||||||
"title": "Adjusting the Padding of an Element",
|
"title": "Adjusting the Padding of an Element",
|
||||||
"difficulty": 1.40,
|
|
||||||
"description": [
|
"description": [
|
||||||
"You may have already noticed this, but all HTML elements are essentially little rectangles.",
|
"You may have already noticed this, but all HTML elements are essentially little rectangles.",
|
||||||
"Three important properties control the space that surrounds each HTML element: <code>padding</code>, <code>margin</code>, and <code>border</code>.",
|
"Three important properties control the space that surrounds each HTML element: <code>padding</code>, <code>margin</code>, and <code>border</code>.",
|
||||||
@ -2697,7 +2659,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bad87fee1348bd9aedf08822",
|
"id": "bad87fee1348bd9aedf08822",
|
||||||
"title": "Adjust the Margin of an Element",
|
"title": "Adjust the Margin of an Element",
|
||||||
"difficulty": 1.41,
|
|
||||||
"description": [
|
"description": [
|
||||||
"An element's <code>margin</code> controls the amount of space between an element's <code>border</code> and surrounding elements.",
|
"An element's <code>margin</code> controls the amount of space between an element's <code>border</code> and surrounding elements.",
|
||||||
"Here, we can see that the green box and the red box are nested within the yellow box. Note that the red box has more <code>margin</code> than the green box, making it appear smaller.",
|
"Here, we can see that the green box and the red box are nested within the yellow box. Note that the red box has more <code>margin</code> than the green box, making it appear smaller.",
|
||||||
@ -2768,7 +2729,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bad87fee1348bd9aedf08823",
|
"id": "bad87fee1348bd9aedf08823",
|
||||||
"title": "Add a Negative Margin to an Element",
|
"title": "Add a Negative Margin to an Element",
|
||||||
"difficulty": 1.42,
|
|
||||||
"description": [
|
"description": [
|
||||||
"An element's <code>margin</code> controls the amount of space between an element's <code>border</code> and surrounding elements.",
|
"An element's <code>margin</code> controls the amount of space between an element's <code>border</code> and surrounding elements.",
|
||||||
"If you set an element's <code>margin</code> to a negative value, the element will grow larger.",
|
"If you set an element's <code>margin</code> to a negative value, the element will grow larger.",
|
||||||
@ -2838,7 +2798,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bad87fee1348bd9aedf08824",
|
"id": "bad87fee1348bd9aedf08824",
|
||||||
"title": "Add Different Padding to Each Side of an Element",
|
"title": "Add Different Padding to Each Side of an Element",
|
||||||
"difficulty": 1.43,
|
|
||||||
"description": [
|
"description": [
|
||||||
"Sometimes you will want to customize an element so that it has different <code>padding</code> on each of its sides.",
|
"Sometimes you will want to customize an element so that it has different <code>padding</code> on each of its sides.",
|
||||||
"CSS allows you to control the <code>padding</code> of an element on all four sides with <code>padding-top</code>, <code>padding-right</code>, <code>padding-bottom</code>, and <code>padding-left</code> properties.",
|
"CSS allows you to control the <code>padding</code> of an element on all four sides with <code>padding-top</code>, <code>padding-right</code>, <code>padding-bottom</code>, and <code>padding-left</code> properties.",
|
||||||
@ -2910,7 +2869,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bad87fee1248bd9aedf08824",
|
"id": "bad87fee1248bd9aedf08824",
|
||||||
"title": "Add Different Margins to Each Side of an Element",
|
"title": "Add Different Margins to Each Side of an Element",
|
||||||
"difficulty": 1.44,
|
|
||||||
"description": [
|
"description": [
|
||||||
"Give the green box a <code>margin</code> of <code>40px</code> on its top and left side, but only <code>20px</code> on its bottom and right side.",
|
"Give the green box a <code>margin</code> of <code>40px</code> on its top and left side, but only <code>20px</code> on its bottom and right side.",
|
||||||
"Sometimes you will want to customize an element so that it has a different <code>margin</code> on each of its sides.",
|
"Sometimes you will want to customize an element so that it has a different <code>margin</code> on each of its sides.",
|
||||||
@ -2981,7 +2939,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bad87fee1348bd9aedf08826",
|
"id": "bad87fee1348bd9aedf08826",
|
||||||
"title": "Use Clockwise Notation to Specify the Padding of an Element",
|
"title": "Use Clockwise Notation to Specify the Padding of an Element",
|
||||||
"difficulty": 1.44,
|
|
||||||
"description": [
|
"description": [
|
||||||
"Instead of specifying an element's <code>padding-top</code>, <code>padding-right</code>, <code>padding-bottom</code>, and <code>padding-left</code> properties, you can specify them all in one line, like this: <code>padding: 10px 20px 10px 20px;</code>.",
|
"Instead of specifying an element's <code>padding-top</code>, <code>padding-right</code>, <code>padding-bottom</code>, and <code>padding-left</code> properties, you can specify them all in one line, like this: <code>padding: 10px 20px 10px 20px;</code>.",
|
||||||
"These four values work like a clock: top, right, bottom, left, and will produce the exact same result as using the side-specific padding instructions.",
|
"These four values work like a clock: top, right, bottom, left, and will produce the exact same result as using the side-specific padding instructions.",
|
||||||
@ -3050,7 +3007,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bad87fee1348bd9afdf08726",
|
"id": "bad87fee1348bd9afdf08726",
|
||||||
"title": "Use Clockwise Notation to Specify the Margin of an Element",
|
"title": "Use Clockwise Notation to Specify the Margin of an Element",
|
||||||
"difficulty": 1.45,
|
|
||||||
"description": [
|
"description": [
|
||||||
"Let's try this again, but with <code>margin</code> this time.",
|
"Let's try this again, but with <code>margin</code> this time.",
|
||||||
"Instead of specifying an element's <code>margin-top</code>, <code>margin-right</code>, <code>margin-bottom</code>, and <code>margin-left</code> properties, you can specify them all in one line, like this: <code>margin: 10px 20px 10px 20px;</code>.",
|
"Instead of specifying an element's <code>margin-top</code>, <code>margin-right</code>, <code>margin-bottom</code>, and <code>margin-left</code> properties, you can specify them all in one line, like this: <code>margin: 10px 20px 10px 20px;</code>.",
|
||||||
@ -3120,7 +3076,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bad87fee1348bd9aedf08736",
|
"id": "bad87fee1348bd9aedf08736",
|
||||||
"title": "Style the HTML Body Element",
|
"title": "Style the HTML Body Element",
|
||||||
"difficulty": 1.46,
|
|
||||||
"description": [
|
"description": [
|
||||||
"Now let's start fresh and talk about CSS inheritance.",
|
"Now let's start fresh and talk about CSS inheritance.",
|
||||||
"Every HTML page has a <code>body</code> element.",
|
"Every HTML page has a <code>body</code> element.",
|
||||||
@ -3153,7 +3108,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bad87fee1348bd9aedf08746",
|
"id": "bad87fee1348bd9aedf08746",
|
||||||
"title": "Inherit Styles from the Body Element",
|
"title": "Inherit Styles from the Body Element",
|
||||||
"difficulty": 1.47,
|
|
||||||
"description": [
|
"description": [
|
||||||
"Now we've proven that every HTML page has a <code>body</code> element, and that its <code>body</code> element can also be styled with CSS.",
|
"Now we've proven that every HTML page has a <code>body</code> element, and that its <code>body</code> element can also be styled with CSS.",
|
||||||
"Remember, you can style your <code>body</code> element just like any other HTML element, and all your other elements will inherit your <code>body</code> element's styles.",
|
"Remember, you can style your <code>body</code> element just like any other HTML element, and all your other elements will inherit your <code>body</code> element's styles.",
|
||||||
@ -3196,7 +3150,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bad87fee1348bd9aedf08756",
|
"id": "bad87fee1348bd9aedf08756",
|
||||||
"title": "Prioritize One Style Over Another",
|
"title": "Prioritize One Style Over Another",
|
||||||
"difficulty": 1.48,
|
|
||||||
"description": [
|
"description": [
|
||||||
"Sometimes your HTML elements will receive multiple styles that conflict with one another.",
|
"Sometimes your HTML elements will receive multiple styles that conflict with one another.",
|
||||||
"For example, your <code>h1</code> element can't be both green and pink at the same time.",
|
"For example, your <code>h1</code> element can't be both green and pink at the same time.",
|
||||||
@ -3236,7 +3189,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bad87fee1348bd9aedf04756",
|
"id": "bad87fee1348bd9aedf04756",
|
||||||
"title": "Override Styles in Subsequent CSS",
|
"title": "Override Styles in Subsequent CSS",
|
||||||
"difficulty": 1.49,
|
|
||||||
"description": [
|
"description": [
|
||||||
"Our \"pink-text\" class overrode our <code>body</code> element's CSS declaration!",
|
"Our \"pink-text\" class overrode our <code>body</code> element's CSS declaration!",
|
||||||
"We just proved that our classes will override the <code>body</code> element's CSS. So the next logical question is, what can we do to override our <code>pink-text</code> class?",
|
"We just proved that our classes will override the <code>body</code> element's CSS. So the next logical question is, what can we do to override our <code>pink-text</code> class?",
|
||||||
@ -3280,7 +3232,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bad87fee1348bd8aedf06756",
|
"id": "bad87fee1348bd8aedf06756",
|
||||||
"title": "Override Class Declarations by Styling ID Attributes",
|
"title": "Override Class Declarations by Styling ID Attributes",
|
||||||
"difficulty": 1.52,
|
|
||||||
"description": [
|
"description": [
|
||||||
"We just proved that browsers read CSS from top to bottom. That means that, in the event of a conflict, the browser will use whichever CSS declaration came last.",
|
"We just proved that browsers read CSS from top to bottom. That means that, in the event of a conflict, the browser will use whichever CSS declaration came last.",
|
||||||
"But we're not done yet. There are other ways that you can override CSS. Do you remember id attributes?",
|
"But we're not done yet. There are other ways that you can override CSS. Do you remember id attributes?",
|
||||||
@ -3331,7 +3282,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bad87fee1348bd9aedf06756",
|
"id": "bad87fee1348bd9aedf06756",
|
||||||
"title": "Override Class Declarations with Inline Styles",
|
"title": "Override Class Declarations with Inline Styles",
|
||||||
"difficulty": 1.52,
|
|
||||||
"description": [
|
"description": [
|
||||||
"So we've proven that id declarations override class declarations, regardless of where they are declared in your <code>style</code> element CSS.",
|
"So we've proven that id declarations override class declarations, regardless of where they are declared in your <code>style</code> element CSS.",
|
||||||
"There are other ways that you can override CSS. Do you remember inline styles?",
|
"There are other ways that you can override CSS. Do you remember inline styles?",
|
||||||
@ -3382,7 +3332,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bad87fee1348bd9aedf07756",
|
"id": "bad87fee1348bd9aedf07756",
|
||||||
"title": "Override All Other Styles by using Important",
|
"title": "Override All Other Styles by using Important",
|
||||||
"difficulty": 1.53,
|
|
||||||
"description": [
|
"description": [
|
||||||
"Yay! We just proved that in-line styles will override all the CSS declarations in your <code>style</code> element.",
|
"Yay! We just proved that in-line styles will override all the CSS declarations in your <code>style</code> element.",
|
||||||
"But wait. There's one last way to override CSS. This is the most powerful method of all. But before we do it, let's talk about why you would ever want to override CSS.",
|
"But wait. There's one last way to override CSS. This is the most powerful method of all. But before we do it, let's talk about why you would ever want to override CSS.",
|
||||||
@ -3436,7 +3385,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bad87fee1348bd9aedf08726",
|
"id": "bad87fee1348bd9aedf08726",
|
||||||
"title": "Use Hex Code for Specific Colors",
|
"title": "Use Hex Code for Specific Colors",
|
||||||
"difficulty": 1.54,
|
|
||||||
"description": [
|
"description": [
|
||||||
"Did you know there are other ways to represent colors in CSS? One of these ways is called hexadecimal code, or <code>hex code</code> for short.",
|
"Did you know there are other ways to represent colors in CSS? One of these ways is called hexadecimal code, or <code>hex code</code> for short.",
|
||||||
"<code>Decimal</code> means the numbers zero through nine - the numbers that people use in everyday life. <code>Hexadecimal</code> includes these 10 numbers, plus the letters A, B, C, D, E and F. This means that Hexidecimal has a total of 16 possible values, instead of the 10 possible values that our normal base-10 number system gives us.",
|
"<code>Decimal</code> means the numbers zero through nine - the numbers that people use in everyday life. <code>Hexadecimal</code> includes these 10 numbers, plus the letters A, B, C, D, E and F. This means that Hexidecimal has a total of 16 possible values, instead of the 10 possible values that our normal base-10 number system gives us.",
|
||||||
@ -3472,7 +3420,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bad87fee1348bd9aedf08725",
|
"id": "bad87fee1348bd9aedf08725",
|
||||||
"title": "Use Hex Code to Color Elements White",
|
"title": "Use Hex Code to Color Elements White",
|
||||||
"difficulty": 1.55,
|
|
||||||
"description": [
|
"description": [
|
||||||
"<code>0</code> is the lowest number in hex code, and represents a complete absence of color.",
|
"<code>0</code> is the lowest number in hex code, and represents a complete absence of color.",
|
||||||
"<code>F</code> is the highest number in hex code, and it represents the maximum possible brightness.",
|
"<code>F</code> is the highest number in hex code, and it represents the maximum possible brightness.",
|
||||||
@ -3507,7 +3454,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bad87fee1348bd9aedf08724",
|
"id": "bad87fee1348bd9aedf08724",
|
||||||
"title": "Use Hex Code to Color Elements Red",
|
"title": "Use Hex Code to Color Elements Red",
|
||||||
"difficulty": 1.56,
|
|
||||||
"description": [
|
"description": [
|
||||||
"You may be wondering why we use 6 digits to represent a color instead of just one or two. The answer is that using 6 digits gives us a huge variety.",
|
"You may be wondering why we use 6 digits to represent a color instead of just one or two. The answer is that using 6 digits gives us a huge variety.",
|
||||||
"How many colors are possible? 16 values and 6 positions means we have 16 to the 6th power, or more than 16 million possible colors.",
|
"How many colors are possible? 16 values and 6 positions means we have 16 to the 6th power, or more than 16 million possible colors.",
|
||||||
@ -3544,7 +3490,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bad87fee1348bd9aedf08723",
|
"id": "bad87fee1348bd9aedf08723",
|
||||||
"title": "Use Hex Code to Color Elements Green",
|
"title": "Use Hex Code to Color Elements Green",
|
||||||
"difficulty": 1.57,
|
|
||||||
"description": [
|
"description": [
|
||||||
"Remember that <code>hex code</code> follows the red-green-blue, or <code>rgb</code> format. The first two digits of hex code represent the amount of red in the color. The third and fourth digit represent the amount of green. The fifth and sixth represent the amount of blue.",
|
"Remember that <code>hex code</code> follows the red-green-blue, or <code>rgb</code> format. The first two digits of hex code represent the amount of red in the color. The third and fourth digit represent the amount of green. The fifth and sixth represent the amount of blue.",
|
||||||
"So to get the absolute brightest green, you would just use <code>F</code> for the third and fourth digits (the highest possible value) and <code>0</code> for all the other digits (the lowest possible value).",
|
"So to get the absolute brightest green, you would just use <code>F</code> for the third and fourth digits (the highest possible value) and <code>0</code> for all the other digits (the lowest possible value).",
|
||||||
@ -3579,7 +3524,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bad87fee1348bd9aedf08722",
|
"id": "bad87fee1348bd9aedf08722",
|
||||||
"title": "Use Hex Code to Color Elements Blue",
|
"title": "Use Hex Code to Color Elements Blue",
|
||||||
"difficulty": 1.58,
|
|
||||||
"description": [
|
"description": [
|
||||||
"Hex code follows the red-green-blue, or <code>rgb</code> format. The first two digits of hex code represent the amount of red in the color. The third and fourth digit represent the amount of green. The fifth and sixth represent the amount of blue.",
|
"Hex code follows the red-green-blue, or <code>rgb</code> format. The first two digits of hex code represent the amount of red in the color. The third and fourth digit represent the amount of green. The fifth and sixth represent the amount of blue.",
|
||||||
"So to get the absolute brightest blue, we use <code>F</code> for the fifth and sixth digits (the highest possible value) and <code>0</code> for all the other digits (the lowest possible value).",
|
"So to get the absolute brightest blue, we use <code>F</code> for the fifth and sixth digits (the highest possible value) and <code>0</code> for all the other digits (the lowest possible value).",
|
||||||
@ -3614,7 +3558,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bad87fee1348bd9aedf08721",
|
"id": "bad87fee1348bd9aedf08721",
|
||||||
"title": "Use Hex Code to Mix Colors",
|
"title": "Use Hex Code to Mix Colors",
|
||||||
"difficulty": 1.59,
|
|
||||||
"description": [
|
"description": [
|
||||||
"From these three pure colors (red, green and blue), we can create 16 million other colors.",
|
"From these three pure colors (red, green and blue), we can create 16 million other colors.",
|
||||||
"For example, orange is pure red, mixed with some green, and no blue.",
|
"For example, orange is pure red, mixed with some green, and no blue.",
|
||||||
@ -3649,7 +3592,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bad87fee1348bd9aede08720",
|
"id": "bad87fee1348bd9aede08720",
|
||||||
"title": "Use Hex Code to Color Elements Gray",
|
"title": "Use Hex Code to Color Elements Gray",
|
||||||
"difficulty": 1.60,
|
|
||||||
"description": [
|
"description": [
|
||||||
"From these three pure colors (red, green and blue), we can create 16 million other colors.",
|
"From these three pure colors (red, green and blue), we can create 16 million other colors.",
|
||||||
"We can also create different shades of gray by evenly mixing all three colors.",
|
"We can also create different shades of gray by evenly mixing all three colors.",
|
||||||
@ -3684,7 +3626,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bad87fee1348bd9aedf08720",
|
"id": "bad87fee1348bd9aedf08720",
|
||||||
"title": "Use Hex Code for Specific Shades of Gray",
|
"title": "Use Hex Code for Specific Shades of Gray",
|
||||||
"difficulty": 1.61,
|
|
||||||
"description": [
|
"description": [
|
||||||
"We can also create other shades of gray by evenly mixing all three colors. We can go very close to true black.",
|
"We can also create other shades of gray by evenly mixing all three colors. We can go very close to true black.",
|
||||||
"Make the <code>body</code> element's background color a dark gray by giving it the hex code value of <code>#111111</code>."
|
"Make the <code>body</code> element's background color a dark gray by giving it the hex code value of <code>#111111</code>."
|
||||||
@ -3718,7 +3659,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bad87fee1348bd9aedf08719",
|
"id": "bad87fee1348bd9aedf08719",
|
||||||
"title": "Use Abbreviated Hex Code",
|
"title": "Use Abbreviated Hex Code",
|
||||||
"difficulty": 1.62,
|
|
||||||
"description": [
|
"description": [
|
||||||
"Many people feel overwhelmed by the possibilities of more than 16 million colors. And it's difficult to remember hex code. Fortunately, you can shorten it.",
|
"Many people feel overwhelmed by the possibilities of more than 16 million colors. And it's difficult to remember hex code. Fortunately, you can shorten it.",
|
||||||
"For example, red, which is <code>#FF0000</code> in hex code, can be shortened to <code>#F00</code>. That is, one digit for red, one digit for green, one digit for blue.",
|
"For example, red, which is <code>#FF0000</code> in hex code, can be shortened to <code>#F00</code>. That is, one digit for red, one digit for green, one digit for blue.",
|
||||||
@ -3754,7 +3694,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bad87fee1348bd9aede08718",
|
"id": "bad87fee1348bd9aede08718",
|
||||||
"title": "Use RGB values to Color Elements",
|
"title": "Use RGB values to Color Elements",
|
||||||
"difficulty": 1.63,
|
|
||||||
"description": [
|
"description": [
|
||||||
"Another way you can represent colors in CSS is by using <code>rgb</code> values.",
|
"Another way you can represent colors in CSS is by using <code>rgb</code> values.",
|
||||||
"RGB values look like this: <code>rgb(0, 0, 0)</code> for black and <code>rgb(255, 255, 255)</code> for white.",
|
"RGB values look like this: <code>rgb(0, 0, 0)</code> for black and <code>rgb(255, 255, 255)</code> for white.",
|
||||||
@ -3791,7 +3730,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bad88fee1348bd9aedf08726",
|
"id": "bad88fee1348bd9aedf08726",
|
||||||
"title": "Use RGB to Color Elements White",
|
"title": "Use RGB to Color Elements White",
|
||||||
"difficulty": 1.64,
|
|
||||||
"description": [
|
"description": [
|
||||||
"RGB values look like this: <code>rgb(0, 0, 0)</code> for black and <code>rgb(255, 255, 255)</code> for white.",
|
"RGB values look like this: <code>rgb(0, 0, 0)</code> for black and <code>rgb(255, 255, 255)</code> for white.",
|
||||||
"Instead of using six hexadecimal digits like you do with hex code, with <code>rgb</code> you specify the brightness of each color with a number between 0 and 255.",
|
"Instead of using six hexadecimal digits like you do with hex code, with <code>rgb</code> you specify the brightness of each color with a number between 0 and 255.",
|
||||||
@ -3826,7 +3764,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bad89fee1348bd9aedf08724",
|
"id": "bad89fee1348bd9aedf08724",
|
||||||
"title": "Use RGB to Color Elements Red",
|
"title": "Use RGB to Color Elements Red",
|
||||||
"difficulty": 1.65,
|
|
||||||
"description": [
|
"description": [
|
||||||
"Just like with hex code, you can represent different colors in RGB by using combinations of different values.",
|
"Just like with hex code, you can represent different colors in RGB by using combinations of different values.",
|
||||||
"These values follow the pattern of RGB: the first number represents red, the second number represents green, and the third number represents blue.",
|
"These values follow the pattern of RGB: the first number represents red, the second number represents green, and the third number represents blue.",
|
||||||
@ -3861,7 +3798,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bad80fee1348bd9aedf08723",
|
"id": "bad80fee1348bd9aedf08723",
|
||||||
"title": "Use RGB to Color Elements Green",
|
"title": "Use RGB to Color Elements Green",
|
||||||
"difficulty": 1.66,
|
|
||||||
"description": [
|
"description": [
|
||||||
"Now change the <code>body</code> element's background color to the <code>rgb</code> value green: <code>rgb(0, 255, 0)</code>"
|
"Now change the <code>body</code> element's background color to the <code>rgb</code> value green: <code>rgb(0, 255, 0)</code>"
|
||||||
],
|
],
|
||||||
@ -3894,7 +3830,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bad81fee1348bd9aedf08722",
|
"id": "bad81fee1348bd9aedf08722",
|
||||||
"title": "Use RGB to Color Elements Blue",
|
"title": "Use RGB to Color Elements Blue",
|
||||||
"difficulty": 1.67,
|
|
||||||
"description": [
|
"description": [
|
||||||
"Change the <code>body</code> element's background color to the RGB value blue: <code>rgb(0, 0, 255)</code>"
|
"Change the <code>body</code> element's background color to the RGB value blue: <code>rgb(0, 0, 255)</code>"
|
||||||
],
|
],
|
||||||
@ -3927,7 +3862,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bad82fee1348bd9aedf08721",
|
"id": "bad82fee1348bd9aedf08721",
|
||||||
"title": "Use RGB to Mix Colors",
|
"title": "Use RGB to Mix Colors",
|
||||||
"difficulty": 1.68,
|
|
||||||
"description": [
|
"description": [
|
||||||
"Just like with hex code, you can mix colors in RGB by using combinations of different values.",
|
"Just like with hex code, you can mix colors in RGB by using combinations of different values.",
|
||||||
"Change the <code>body</code> element's background color to the RGB value orange: <code>rgb(255, 165, 0)</code>"
|
"Change the <code>body</code> element's background color to the RGB value orange: <code>rgb(255, 165, 0)</code>"
|
||||||
@ -3961,7 +3895,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bad83fee1348bd9aede08720",
|
"id": "bad83fee1348bd9aede08720",
|
||||||
"title": "Use RGB to Color Elements Gray",
|
"title": "Use RGB to Color Elements Gray",
|
||||||
"difficulty": 1.69,
|
|
||||||
"description": [
|
"description": [
|
||||||
"With RGB values, we can make an element gray by using combinations of the same value for all three colors.",
|
"With RGB values, we can make an element gray by using combinations of the same value for all three colors.",
|
||||||
"Change the <code>body</code> element's background color to the RGB value for gray: <code>rgb(128, 128, 128)</code>"
|
"Change the <code>body</code> element's background color to the RGB value for gray: <code>rgb(128, 128, 128)</code>"
|
||||||
|
@ -5,7 +5,6 @@
|
|||||||
{
|
{
|
||||||
"id": "a3566b1109230028080c9345",
|
"id": "a3566b1109230028080c9345",
|
||||||
"title": "Sum All Numbers in a Range",
|
"title": "Sum All Numbers in a Range",
|
||||||
"difficulty": "2.00",
|
|
||||||
"description": [
|
"description": [
|
||||||
"We'll pass you an array of two numbers. Return the sum of those two numbers and all numbers between them.",
|
"We'll pass you an array of two numbers. Return the sum of those two numbers and all numbers between them.",
|
||||||
"The lowest number will not always come first.",
|
"The lowest number will not always come first.",
|
||||||
@ -46,7 +45,6 @@
|
|||||||
{
|
{
|
||||||
"id": "a5de63ebea8dbee56860f4f2",
|
"id": "a5de63ebea8dbee56860f4f2",
|
||||||
"title": "Diff Two Arrays",
|
"title": "Diff Two Arrays",
|
||||||
"difficulty": "2.01",
|
|
||||||
"description": [
|
"description": [
|
||||||
"Compare two arrays and return a new array with any items not found in both of the original arrays.",
|
"Compare two arrays and return a new array with any items not found in both of the original arrays.",
|
||||||
"Remember to use <a href='//github.com/FreeCodeCamp/freecodecamp/wiki/How-to-get-help-when-you-get-stuck' target='_blank'>Read-Search-Ask</a> if you get stuck. Try to pair program. Write your own code."
|
"Remember to use <a href='//github.com/FreeCodeCamp/freecodecamp/wiki/How-to-get-help-when-you-get-stuck' target='_blank'>Read-Search-Ask</a> if you get stuck. Try to pair program. Write your own code."
|
||||||
@ -99,7 +97,6 @@
|
|||||||
"assert.deepEqual(convert(29), \"XXIX\", 'message: <code>convert(29)</code> should return \"XXIX\".');",
|
"assert.deepEqual(convert(29), \"XXIX\", 'message: <code>convert(29)</code> should return \"XXIX\".');",
|
||||||
"assert.deepEqual(convert(16), \"XVI\", 'message: <code>convert(16)</code> should return \"XVI\".');"
|
"assert.deepEqual(convert(16), \"XVI\", 'message: <code>convert(16)</code> should return \"XVI\".');"
|
||||||
],
|
],
|
||||||
"difficulty": "2.02",
|
|
||||||
"description": [
|
"description": [
|
||||||
"Convert the given number into a roman numeral.",
|
"Convert the given number into a roman numeral.",
|
||||||
"All <a href=\"http://www.mathsisfun.com/roman-numerals.html\" target=\"_blank\">roman numerals</a> answers should be provided in upper-case.",
|
"All <a href=\"http://www.mathsisfun.com/roman-numerals.html\" target=\"_blank\">roman numerals</a> answers should be provided in upper-case.",
|
||||||
@ -134,7 +131,6 @@
|
|||||||
{
|
{
|
||||||
"id": "a8e512fbe388ac2f9198f0fa",
|
"id": "a8e512fbe388ac2f9198f0fa",
|
||||||
"title": "Where art thou",
|
"title": "Where art thou",
|
||||||
"difficulty": "2.03",
|
|
||||||
"description": [
|
"description": [
|
||||||
"Make a function that looks through an array of objects (first argument) and returns an array of all objects that have matching property and value pairs (second argument). Each property and value pair of the source object has to be present in the object from the collection if it is to be included in the returned array.",
|
"Make a function that looks through an array of objects (first argument) and returns an array of all objects that have matching property and value pairs (second argument). Each property and value pair of the source object has to be present in the object from the collection if it is to be included in the returned array.",
|
||||||
"For example, if the first argument is <code>[{ first: \"Romeo\", last: \"Montague\" }, { first: \"Mercutio\", last: null }, { first: \"Tybalt\", last: \"Capulet\" }]</code>, and the second argument is <code>{ last: \"Capulet\" }</code>, then you must return the third object from the array (the first argument), because it contains the property and it's value, that was passed on as the second argument.",
|
"For example, if the first argument is <code>[{ first: \"Romeo\", last: \"Montague\" }, { first: \"Mercutio\", last: null }, { first: \"Tybalt\", last: \"Capulet\" }]</code>, and the second argument is <code>{ last: \"Capulet\" }</code>, then you must return the third object from the array (the first argument), because it contains the property and it's value, that was passed on as the second argument.",
|
||||||
@ -182,7 +178,6 @@
|
|||||||
"assert.deepEqual(myReplace(\"His name is Tom\", \"Tom\", \"john\"), \"His name is John\", 'message: <code>myReplace(\"His name is Tom\", \"Tom\", \"john\")</code> should return \"His name is John\".');",
|
"assert.deepEqual(myReplace(\"His name is Tom\", \"Tom\", \"john\"), \"His name is John\", 'message: <code>myReplace(\"His name is Tom\", \"Tom\", \"john\")</code> should return \"His name is John\".');",
|
||||||
"assert.deepEqual(myReplace(\"Let us get back to more Coding\", \"Coding\", \"bonfires\"), \"Let us get back to more Bonfires\", 'message: <code>myReplace(\"Let us get back to more Coding\", \"Coding\", \"bonfires\")</code> should return \"Let us get back to more Bonfires\".');"
|
"assert.deepEqual(myReplace(\"Let us get back to more Coding\", \"Coding\", \"bonfires\"), \"Let us get back to more Bonfires\", 'message: <code>myReplace(\"Let us get back to more Coding\", \"Coding\", \"bonfires\")</code> should return \"Let us get back to more Bonfires\".');"
|
||||||
],
|
],
|
||||||
"difficulty": "2.035",
|
|
||||||
"description": [
|
"description": [
|
||||||
"Perform a search and replace on the sentence using the arguments provided and return the new sentence.",
|
"Perform a search and replace on the sentence using the arguments provided and return the new sentence.",
|
||||||
"First argument is the sentence to perform the search and replace on.",
|
"First argument is the sentence to perform the search and replace on.",
|
||||||
@ -226,7 +221,6 @@
|
|||||||
"assert.deepEqual(translate(\"algorithm\"), \"algorithmway\", 'message: <code>translate(\"algorithm\")</code> should return \"algorithmway\".');",
|
"assert.deepEqual(translate(\"algorithm\"), \"algorithmway\", 'message: <code>translate(\"algorithm\")</code> should return \"algorithmway\".');",
|
||||||
"assert.deepEqual(translate(\"eight\"), \"eightway\", 'message: <code>translate(\"eight\")</code> should return \"eightway\".');"
|
"assert.deepEqual(translate(\"eight\"), \"eightway\", 'message: <code>translate(\"eight\")</code> should return \"eightway\".');"
|
||||||
],
|
],
|
||||||
"difficulty": "2.04",
|
|
||||||
"description": [
|
"description": [
|
||||||
"Translate the provided string to pig latin.",
|
"Translate the provided string to pig latin.",
|
||||||
"<a href=\"http://en.wikipedia.org/wiki/Pig_Latin\" target=\"_blank\">Pig Latin</a> takes the first consonant (or consonant cluster) of an English word, moves it to the end of the word and suffixes an \"ay\".",
|
"<a href=\"http://en.wikipedia.org/wiki/Pig_Latin\" target=\"_blank\">Pig Latin</a> takes the first consonant (or consonant cluster) of an English word, moves it to the end of the word and suffixes an \"ay\".",
|
||||||
@ -268,7 +262,6 @@
|
|||||||
"assert.deepEqual(pair(\"TTGAG\"),[[\"T\",\"A\"],[\"T\",\"A\"],[\"G\",\"C\"],[\"A\",\"T\"],[\"G\",\"C\"]], 'message: <code>pair(\"TTGAG\")</code> should return <code>[[\"T\",\"A\"],[\"T\",\"A\"],[\"G\",\"C\"],[\"A\",\"T\"],[\"G\",\"C\"]]</code>.');",
|
"assert.deepEqual(pair(\"TTGAG\"),[[\"T\",\"A\"],[\"T\",\"A\"],[\"G\",\"C\"],[\"A\",\"T\"],[\"G\",\"C\"]], 'message: <code>pair(\"TTGAG\")</code> should return <code>[[\"T\",\"A\"],[\"T\",\"A\"],[\"G\",\"C\"],[\"A\",\"T\"],[\"G\",\"C\"]]</code>.');",
|
||||||
"assert.deepEqual(pair(\"CTCTA\"),[[\"C\",\"G\"],[\"T\",\"A\"],[\"C\",\"G\"],[\"T\",\"A\"],[\"A\",\"T\"]], 'message: <code>pair(\"CTCTA\")</code> should return <code>[[\"C\",\"G\"],[\"T\",\"A\"],[\"C\",\"G\"],[\"T\",\"A\"],[\"A\",\"T\"]]</code>.');"
|
"assert.deepEqual(pair(\"CTCTA\"),[[\"C\",\"G\"],[\"T\",\"A\"],[\"C\",\"G\"],[\"T\",\"A\"],[\"A\",\"T\"]], 'message: <code>pair(\"CTCTA\")</code> should return <code>[[\"C\",\"G\"],[\"T\",\"A\"],[\"C\",\"G\"],[\"T\",\"A\"],[\"A\",\"T\"]]</code>.');"
|
||||||
],
|
],
|
||||||
"difficulty": "2.05",
|
|
||||||
"description": [
|
"description": [
|
||||||
"The DNA strand is missing the pairing element. Take each character, get its pair, and return the results as a 2d array.",
|
"The DNA strand is missing the pairing element. Take each character, get its pair, and return the results as a 2d array.",
|
||||||
"<a href=\"http://en.wikipedia.org/wiki/Base_pair\" target=\"_blank\">Base pairs</a> are a pair of AT and CG. Match the missing element to the provided character.",
|
"<a href=\"http://en.wikipedia.org/wiki/Base_pair\" target=\"_blank\">Base pairs</a> are a pair of AT and CG. Match the missing element to the provided character.",
|
||||||
@ -304,7 +297,6 @@
|
|||||||
{
|
{
|
||||||
"id": "af7588ade1100bde429baf20",
|
"id": "af7588ade1100bde429baf20",
|
||||||
"title": "Missing letters",
|
"title": "Missing letters",
|
||||||
"difficulty": "2.05",
|
|
||||||
"description": [
|
"description": [
|
||||||
"Find the missing letter in the passed letter range and return it.",
|
"Find the missing letter in the passed letter range and return it.",
|
||||||
"If all letters are present in the range, return undefined.",
|
"If all letters are present in the range, return undefined.",
|
||||||
@ -343,7 +335,6 @@
|
|||||||
{
|
{
|
||||||
"id": "a77dbc43c33f39daa4429b4f",
|
"id": "a77dbc43c33f39daa4429b4f",
|
||||||
"title": "Boo who",
|
"title": "Boo who",
|
||||||
"difficulty": "2.06",
|
|
||||||
"description": [
|
"description": [
|
||||||
"Check if a value is classified as a boolean primitive. Return true or false.",
|
"Check if a value is classified as a boolean primitive. Return true or false.",
|
||||||
"Boolean primitives are true and false.",
|
"Boolean primitives are true and false.",
|
||||||
@ -386,7 +377,6 @@
|
|||||||
{
|
{
|
||||||
"id": "a105e963526e7de52b219be9",
|
"id": "a105e963526e7de52b219be9",
|
||||||
"title": "Sorted Union",
|
"title": "Sorted Union",
|
||||||
"difficulty": "2.07",
|
|
||||||
"description": [
|
"description": [
|
||||||
"Write a function that takes two or more arrays and returns a new array of unique values in the order of the original provided arrays.",
|
"Write a function that takes two or more arrays and returns a new array of unique values in the order of the original provided arrays.",
|
||||||
"In other words, all values present from all arrays should be included in their original order, but with no duplicates in the final array.",
|
"In other words, all values present from all arrays should be included in their original order, but with no duplicates in the final array.",
|
||||||
@ -427,7 +417,6 @@
|
|||||||
{
|
{
|
||||||
"id": "a6b0bb188d873cb2c8729495",
|
"id": "a6b0bb188d873cb2c8729495",
|
||||||
"title": "Convert HTML Entities",
|
"title": "Convert HTML Entities",
|
||||||
"difficulty": "2.07",
|
|
||||||
"description": [
|
"description": [
|
||||||
"Convert the characters \"&\", \"<\", \">\", '\"' (double quote), and \"'\" (apostrophe), in a string to their corresponding HTML entities.",
|
"Convert the characters \"&\", \"<\", \">\", '\"' (double quote), and \"'\" (apostrophe), in a string to their corresponding HTML entities.",
|
||||||
"Remember to use <a href='//github.com/FreeCodeCamp/freecodecamp/wiki/How-to-get-help-when-you-get-stuck' target='_blank'>Read-Search-Ask</a> if you get stuck. Try to pair program. Write your own code."
|
"Remember to use <a href='//github.com/FreeCodeCamp/freecodecamp/wiki/How-to-get-help-when-you-get-stuck' target='_blank'>Read-Search-Ask</a> if you get stuck. Try to pair program. Write your own code."
|
||||||
@ -469,7 +458,6 @@
|
|||||||
{
|
{
|
||||||
"id": "a103376db3ba46b2d50db289",
|
"id": "a103376db3ba46b2d50db289",
|
||||||
"title": "Spinal Tap Case",
|
"title": "Spinal Tap Case",
|
||||||
"difficulty": "2.08",
|
|
||||||
"description": [
|
"description": [
|
||||||
"Convert a string to spinal case. Spinal case is all-lowercase-words-joined-by-dashes.",
|
"Convert a string to spinal case. Spinal case is all-lowercase-words-joined-by-dashes.",
|
||||||
"Remember to use <a href='//github.com/FreeCodeCamp/freecodecamp/wiki/How-to-get-help-when-you-get-stuck' target='_blank'>Read-Search-Ask</a> if you get stuck. Try to pair program. Write your own code."
|
"Remember to use <a href='//github.com/FreeCodeCamp/freecodecamp/wiki/How-to-get-help-when-you-get-stuck' target='_blank'>Read-Search-Ask</a> if you get stuck. Try to pair program. Write your own code."
|
||||||
@ -509,7 +497,6 @@
|
|||||||
{
|
{
|
||||||
"id": "a5229172f011153519423690",
|
"id": "a5229172f011153519423690",
|
||||||
"title": "Sum All Odd Fibonacci Numbers",
|
"title": "Sum All Odd Fibonacci Numbers",
|
||||||
"difficulty": "2.09",
|
|
||||||
"description": [
|
"description": [
|
||||||
"Return the sum of all odd Fibonacci numbers up to and including the passed number if it is a Fibonacci number.",
|
"Return the sum of all odd Fibonacci numbers up to and including the passed number if it is a Fibonacci number.",
|
||||||
"The first few numbers of the Fibonacci sequence are 1, 1, 2, 3, 5 and 8, and each subsequent number is the sum of the previous two numbers.",
|
"The first few numbers of the Fibonacci sequence are 1, 1, 2, 3, 5 and 8, and each subsequent number is the sum of the previous two numbers.",
|
||||||
@ -550,7 +537,6 @@
|
|||||||
{
|
{
|
||||||
"id": "a3bfc1673c0526e06d3ac698",
|
"id": "a3bfc1673c0526e06d3ac698",
|
||||||
"title": "Sum All Primes",
|
"title": "Sum All Primes",
|
||||||
"difficulty": "2.10",
|
|
||||||
"description": [
|
"description": [
|
||||||
"Sum all the prime numbers up to and including the provided number.",
|
"Sum all the prime numbers up to and including the provided number.",
|
||||||
"A prime number is defined as having only two divisors, 1 and itself. For example, 2 is a prime number because it's only divisible by 1 and 2. 1 isn't a prime number, because it's only divisible by itself.",
|
"A prime number is defined as having only two divisors, 1 and itself. For example, 2 is a prime number because it's only divisible by 1 and 2. 1 isn't a prime number, because it's only divisible by itself.",
|
||||||
@ -589,7 +575,6 @@
|
|||||||
{
|
{
|
||||||
"id": "ae9defd7acaf69703ab432ea",
|
"id": "ae9defd7acaf69703ab432ea",
|
||||||
"title": "Smallest Common Multiple",
|
"title": "Smallest Common Multiple",
|
||||||
"difficulty": "2.11",
|
|
||||||
"description": [
|
"description": [
|
||||||
"Find the smallest common multiple of the provided parameters that can be evenly divided by both, as well as by all sequential numbers in the range between these parameters.",
|
"Find the smallest common multiple of the provided parameters that can be evenly divided by both, as well as by all sequential numbers in the range between these parameters.",
|
||||||
"The range will be an array of two numbers that will not necessarily be in numerical order.",
|
"The range will be an array of two numbers that will not necessarily be in numerical order.",
|
||||||
@ -629,7 +614,6 @@
|
|||||||
{
|
{
|
||||||
"id": "a6e40f1041b06c996f7b2406",
|
"id": "a6e40f1041b06c996f7b2406",
|
||||||
"title": "Finders Keepers",
|
"title": "Finders Keepers",
|
||||||
"difficulty": "2.12",
|
|
||||||
"description": [
|
"description": [
|
||||||
"Create a function that looks through an array (first argument) and returns the first element in the array that passes a truth test (second argument).",
|
"Create a function that looks through an array (first argument) and returns the first element in the array that passes a truth test (second argument).",
|
||||||
"Remember to use <a href='//github.com/FreeCodeCamp/freecodecamp/wiki/How-to-get-help-when-you-get-stuck' target='_blank'>Read-Search-Ask</a> if you get stuck. Try to pair program. Write your own code."
|
"Remember to use <a href='//github.com/FreeCodeCamp/freecodecamp/wiki/How-to-get-help-when-you-get-stuck' target='_blank'>Read-Search-Ask</a> if you get stuck. Try to pair program. Write your own code."
|
||||||
@ -665,7 +649,6 @@
|
|||||||
{
|
{
|
||||||
"id": "a5deed1811a43193f9f1c841",
|
"id": "a5deed1811a43193f9f1c841",
|
||||||
"title": "Drop it",
|
"title": "Drop it",
|
||||||
"difficulty": "2.13",
|
|
||||||
"description": [
|
"description": [
|
||||||
"Drop the elements of an array (first argument), starting from the front, until the predicate (second argument) returns true.",
|
"Drop the elements of an array (first argument), starting from the front, until the predicate (second argument) returns true.",
|
||||||
"Remember to use <a href='//github.com/FreeCodeCamp/freecodecamp/wiki/How-to-get-help-when-you-get-stuck' target='_blank'>Read-Search-Ask</a> if you get stuck. Try to pair program. Write your own code."
|
"Remember to use <a href='//github.com/FreeCodeCamp/freecodecamp/wiki/How-to-get-help-when-you-get-stuck' target='_blank'>Read-Search-Ask</a> if you get stuck. Try to pair program. Write your own code."
|
||||||
@ -704,7 +687,6 @@
|
|||||||
{
|
{
|
||||||
"id": "ab306dbdcc907c7ddfc30830",
|
"id": "ab306dbdcc907c7ddfc30830",
|
||||||
"title": "Steamroller",
|
"title": "Steamroller",
|
||||||
"difficulty": "2.14",
|
|
||||||
"description": [
|
"description": [
|
||||||
"Flatten a nested array. You must account for varying levels of nesting.",
|
"Flatten a nested array. You must account for varying levels of nesting.",
|
||||||
"Remember to use <a href='//github.com/FreeCodeCamp/freecodecamp/wiki/How-to-get-help-when-you-get-stuck' target='_blank'>Read-Search-Ask</a> if you get stuck. Try to pair program. Write your own code."
|
"Remember to use <a href='//github.com/FreeCodeCamp/freecodecamp/wiki/How-to-get-help-when-you-get-stuck' target='_blank'>Read-Search-Ask</a> if you get stuck. Try to pair program. Write your own code."
|
||||||
@ -742,7 +724,6 @@
|
|||||||
{
|
{
|
||||||
"id": "a8d97bd4c764e91f9d2bda01",
|
"id": "a8d97bd4c764e91f9d2bda01",
|
||||||
"title": "Binary Agents",
|
"title": "Binary Agents",
|
||||||
"difficulty": "2.15",
|
|
||||||
"description": [
|
"description": [
|
||||||
"Return an English translated sentence of the passed binary string.",
|
"Return an English translated sentence of the passed binary string.",
|
||||||
"The binary string will be space separated.",
|
"The binary string will be space separated.",
|
||||||
@ -779,7 +760,6 @@
|
|||||||
{
|
{
|
||||||
"id": "a10d2431ad0c6a099a4b8b52",
|
"id": "a10d2431ad0c6a099a4b8b52",
|
||||||
"title": "Everything Be True",
|
"title": "Everything Be True",
|
||||||
"difficulty": "2.21",
|
|
||||||
"description": [
|
"description": [
|
||||||
"Check if the predicate (second argument) returns truthy (defined) for all elements of a collection (first argument).",
|
"Check if the predicate (second argument) returns truthy (defined) for all elements of a collection (first argument).",
|
||||||
"For this, check to see if the property defined in the second argument is present on every element of the collection.",
|
"For this, check to see if the property defined in the second argument is present on every element of the collection.",
|
||||||
@ -819,7 +799,6 @@
|
|||||||
{
|
{
|
||||||
"id": "a97fd23d9b809dac9921074f",
|
"id": "a97fd23d9b809dac9921074f",
|
||||||
"title": "Arguments Optional",
|
"title": "Arguments Optional",
|
||||||
"difficulty": "2.22",
|
|
||||||
"description": [
|
"description": [
|
||||||
"Create a function that sums two arguments together. If only one argument is provided, then return a function that expects one argument and returns the sum.",
|
"Create a function that sums two arguments together. If only one argument is provided, then return a function that expects one argument and returns the sum.",
|
||||||
"For example, <code>add(2, 3)</code> should return <code>5</code>, and <code>add(2)</code> should return a function.",
|
"For example, <code>add(2, 3)</code> should return <code>5</code>, and <code>add(2)</code> should return a function.",
|
||||||
|
@ -5,7 +5,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bd7158d8c442eddfaeb5bd18",
|
"id": "bd7158d8c442eddfaeb5bd18",
|
||||||
"title": "Stylize Stories on Camper News",
|
"title": "Stylize Stories on Camper News",
|
||||||
"difficulty": 1.02,
|
|
||||||
"challengeSeed": ["126415129"],
|
"challengeSeed": ["126415129"],
|
||||||
"description": [
|
"description": [
|
||||||
"<span class='text-info'>Objective:</span> Build a <a href='http://codepen.io' target='_blank'>CodePen.io</a> app that successfully reverse-engineers this: <a href='http://codepen.io/MarufSarker/full/ZGPZLq/' target='_blank'>http://codepen.io/MarufSarker/full/ZGPZLq/</a>.",
|
"<span class='text-info'>Objective:</span> Build a <a href='http://codepen.io' target='_blank'>CodePen.io</a> app that successfully reverse-engineers this: <a href='http://codepen.io/MarufSarker/full/ZGPZLq/' target='_blank'>http://codepen.io/MarufSarker/full/ZGPZLq/</a>.",
|
||||||
@ -38,7 +37,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bd7158d8c442eddfaeb5bd19",
|
"id": "bd7158d8c442eddfaeb5bd19",
|
||||||
"title": "Build a Wikipedia Viewer",
|
"title": "Build a Wikipedia Viewer",
|
||||||
"difficulty": 1.03,
|
|
||||||
"challengeSeed": ["126415131"],
|
"challengeSeed": ["126415131"],
|
||||||
"description": [
|
"description": [
|
||||||
"<span class='text-info'>Objective:</span> Build a <a href='http://codepen.io' target='_blank'>CodePen.io</a> app that successfully reverse-engineers this: <a href='http://codepen.io/GeoffStorbeck/full/MwgQea' target='_blank'>http://codepen.io/GeoffStorbeck/full/MwgQea</a>.",
|
"<span class='text-info'>Objective:</span> Build a <a href='http://codepen.io' target='_blank'>CodePen.io</a> app that successfully reverse-engineers this: <a href='http://codepen.io/GeoffStorbeck/full/MwgQea' target='_blank'>http://codepen.io/GeoffStorbeck/full/MwgQea</a>.",
|
||||||
@ -71,7 +69,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bd7158d8c442eddfaeb5bd17",
|
"id": "bd7158d8c442eddfaeb5bd17",
|
||||||
"title": "Build a JavaScript Calculator",
|
"title": "Build a JavaScript Calculator",
|
||||||
"difficulty": 1.05,
|
|
||||||
"challengeSeed": ["126411565"],
|
"challengeSeed": ["126411565"],
|
||||||
"description": [
|
"description": [
|
||||||
"<span class='text-info'>Objective:</span> Build a <a href='http://codepen.io' target='_blank'>CodePen.io</a> app that successfully reverse-engineers this: <a href='http://codepen.io/GeoffStorbeck/full/zxgaqw' target='_blank'>http://codepen.io/GeoffStorbeck/full/zxgaqw</a>.",
|
"<span class='text-info'>Objective:</span> Build a <a href='http://codepen.io' target='_blank'>CodePen.io</a> app that successfully reverse-engineers this: <a href='http://codepen.io/GeoffStorbeck/full/zxgaqw' target='_blank'>http://codepen.io/GeoffStorbeck/full/zxgaqw</a>.",
|
||||||
@ -103,7 +100,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bd7158d8c442eedfaeb5bd1c",
|
"id": "bd7158d8c442eedfaeb5bd1c",
|
||||||
"title": "Build a Tic Tac Toe Game",
|
"title": "Build a Tic Tac Toe Game",
|
||||||
"difficulty": 1.06,
|
|
||||||
"challengeSeed": ["126415123"],
|
"challengeSeed": ["126415123"],
|
||||||
"description": [
|
"description": [
|
||||||
"<span class='text-info'>Objective:</span> Build a <a href='http://codepen.io' target='_blank'>CodePen.io</a> app that successfully reverse-engineers this: <a href='http://codepen.io/alex-dixon/full/JogOpQ/' target='_blank'>http://codepen.io/alex-dixon/full/JogOpQ/</a>.",
|
"<span class='text-info'>Objective:</span> Build a <a href='http://codepen.io' target='_blank'>CodePen.io</a> app that successfully reverse-engineers this: <a href='http://codepen.io/alex-dixon/full/JogOpQ/' target='_blank'>http://codepen.io/alex-dixon/full/JogOpQ/</a>.",
|
||||||
@ -136,7 +132,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bd7158d8c442eddfaeb5bd1c",
|
"id": "bd7158d8c442eddfaeb5bd1c",
|
||||||
"title": "Build a Simon Game",
|
"title": "Build a Simon Game",
|
||||||
"difficulty": 1.07,
|
|
||||||
"challengeSeed": ["137213633"],
|
"challengeSeed": ["137213633"],
|
||||||
"description": [
|
"description": [
|
||||||
"<span class='text-info'>Objective:</span> Build a <a href='http://codepen.io' target='_blank'>CodePen.io</a> app that successfully reverse-engineers this: <a href='http://codepen.io/Em-Ant/full/QbRyqq/' target='_blank'>http://codepen.io/dting/full/QbRyqq/</a>.",
|
"<span class='text-info'>Objective:</span> Build a <a href='http://codepen.io' target='_blank'>CodePen.io</a> app that successfully reverse-engineers this: <a href='http://codepen.io/Em-Ant/full/QbRyqq/' target='_blank'>http://codepen.io/dting/full/QbRyqq/</a>.",
|
||||||
|
@ -5,7 +5,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bad87fee1348bd9acdd08826",
|
"id": "bad87fee1348bd9acdd08826",
|
||||||
"title": "Learn how Script Tags and Document Ready Work",
|
"title": "Learn how Script Tags and Document Ready Work",
|
||||||
"difficulty": 3.01,
|
|
||||||
"description": [
|
"description": [
|
||||||
"Now we're ready to learn jQuery, the most popular JavaScript tool of all time. Don't worry about JavaScript itself - we will cover it soon.",
|
"Now we're ready to learn jQuery, the most popular JavaScript tool of all time. Don't worry about JavaScript itself - we will cover it soon.",
|
||||||
"Before we can start using jQuery, we need to add some things to our HTML.",
|
"Before we can start using jQuery, we need to add some things to our HTML.",
|
||||||
@ -52,7 +51,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bad87fee1348bd9bedc08826",
|
"id": "bad87fee1348bd9bedc08826",
|
||||||
"title": "Target HTML Elements with Selectors Using jQuery",
|
"title": "Target HTML Elements with Selectors Using jQuery",
|
||||||
"difficulty": 3.02,
|
|
||||||
"description": [
|
"description": [
|
||||||
"Now we have a <code>document ready function</code>. We'll learn more about <code>functions</code> later. The important thing to know is that code you put inside this <code>function</code> will run as soon as your browser has loaded your page.",
|
"Now we have a <code>document ready function</code>. We'll learn more about <code>functions</code> later. The important thing to know is that code you put inside this <code>function</code> will run as soon as your browser has loaded your page.",
|
||||||
"This is important because without your <code>document ready function</code>, your code may run before your HTML is rendered, which would cause bugs.",
|
"This is important because without your <code>document ready function</code>, your code may run before your HTML is rendered, which would cause bugs.",
|
||||||
@ -102,7 +100,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bad87fee1348bd9aedc08826",
|
"id": "bad87fee1348bd9aedc08826",
|
||||||
"title": "Target Elements by Class Using jQuery",
|
"title": "Target Elements by Class Using jQuery",
|
||||||
"difficulty": 3.03,
|
|
||||||
"description": [
|
"description": [
|
||||||
"You see how we made all of your <code>button</code> elements bounce? We selected them with <code>$(\"button\")</code>, then we added some CSS classes to them with <code>.addClass(\"animated bounce\");</code>.",
|
"You see how we made all of your <code>button</code> elements bounce? We selected them with <code>$(\"button\")</code>, then we added some CSS classes to them with <code>.addClass(\"animated bounce\");</code>.",
|
||||||
"You just used jQuery's <code>.addClass()</code> function, which allows you to add classes to elements.",
|
"You just used jQuery's <code>.addClass()</code> function, which allows you to add classes to elements.",
|
||||||
@ -152,7 +149,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bad87fee1348bd9aeda08826",
|
"id": "bad87fee1348bd9aeda08826",
|
||||||
"title": "Target Elements by ID Using jQuery",
|
"title": "Target Elements by ID Using jQuery",
|
||||||
"difficulty": 3.04,
|
|
||||||
"description": [
|
"description": [
|
||||||
"You can also target elements by their id attributes.",
|
"You can also target elements by their id attributes.",
|
||||||
"First target your <code>button</code> element with the id <code>target3</code> by using the <code>$(\"#target3\")</code> selector.",
|
"First target your <code>button</code> element with the id <code>target3</code> by using the <code>$(\"#target3\")</code> selector.",
|
||||||
@ -204,7 +200,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bad87fee1348bd9aeda08726",
|
"id": "bad87fee1348bd9aeda08726",
|
||||||
"title": "Delete your jQuery Functions",
|
"title": "Delete your jQuery Functions",
|
||||||
"difficulty": 3.05,
|
|
||||||
"description": [
|
"description": [
|
||||||
"These animations were cool at first, but now they're getting kind of distracting.",
|
"These animations were cool at first, but now they're getting kind of distracting.",
|
||||||
"Delete all three of these jQuery functions from your <code>document ready function</code>, but leave your <code>document ready function</code> itself intact."
|
"Delete all three of these jQuery functions from your <code>document ready function</code>, but leave your <code>document ready function</code> itself intact."
|
||||||
@ -256,7 +251,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bad87fee1348bd9aed908626",
|
"id": "bad87fee1348bd9aed908626",
|
||||||
"title": "Target the same element with multiple jQuery Selectors",
|
"title": "Target the same element with multiple jQuery Selectors",
|
||||||
"difficulty": 3.06,
|
|
||||||
"description": [
|
"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>.",
|
"Now you know three ways of targeting elements: by type: <code>$(\"button\")</code>, by class: <code>$(\".btn\")</code>, and by id <code>$(\"#target1\")</code>.",
|
||||||
"Use each of these jQuery selectors to target your <code>button</code> element with the class <code>btn</code> and the id <code>target1</code>.",
|
"Use each of these jQuery selectors to target your <code>button</code> element with the class <code>btn</code> and the id <code>target1</code>.",
|
||||||
@ -307,7 +301,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bad87fee1348bd9aed918626",
|
"id": "bad87fee1348bd9aed918626",
|
||||||
"title": "Remove Classes from an element with jQuery",
|
"title": "Remove Classes from an element with jQuery",
|
||||||
"difficulty": 3.07,
|
|
||||||
"description": [
|
"description": [
|
||||||
"In the same way you can add classes to an element with jQuery's <code>addClass()</code> function, you can remove them with jQuery's <code>removeClass()</code> function.",
|
"In the same way you can add classes to an element with jQuery's <code>addClass()</code> function, you can remove them with jQuery's <code>removeClass()</code> function.",
|
||||||
"Here's how you would do this for a specific button, add <code>$(\"#target2\").removeClass(\"btn-default\");</code>",
|
"Here's how you would do this for a specific button, add <code>$(\"#target2\").removeClass(\"btn-default\");</code>",
|
||||||
@ -358,7 +351,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bad87fee1348bd9aed908826",
|
"id": "bad87fee1348bd9aed908826",
|
||||||
"title": "Change the CSS of an Element Using jQuery",
|
"title": "Change the CSS of an Element Using jQuery",
|
||||||
"difficulty": 3.08,
|
|
||||||
"description": [
|
"description": [
|
||||||
"We can also change the CSS of an HTML element directly with jQuery.",
|
"We can also change the CSS of an HTML element directly with jQuery.",
|
||||||
"jQuery has a function called <code>.css()</code> that allows you to change the CSS of an element.",
|
"jQuery has a function called <code>.css()</code> that allows you to change the CSS of an element.",
|
||||||
@ -412,7 +404,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bad87fee1348bd9aed808826",
|
"id": "bad87fee1348bd9aed808826",
|
||||||
"title": "Disable an Element Using jQuery",
|
"title": "Disable an Element Using jQuery",
|
||||||
"difficulty": 3.09,
|
|
||||||
"description": [
|
"description": [
|
||||||
"You can also change the non-CSS properties of HTML elements with jQuery. For example, you can disable buttons.",
|
"You can also change the non-CSS properties of HTML elements with jQuery. For example, you can disable buttons.",
|
||||||
"When you disable a button, it will become grayed-out and can no longer be clicked.",
|
"When you disable a button, it will become grayed-out and can no longer be clicked.",
|
||||||
@ -463,7 +454,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bad87fee1348bd9aed708826",
|
"id": "bad87fee1348bd9aed708826",
|
||||||
"title": "Remove an Element Using jQuery",
|
"title": "Remove an Element Using jQuery",
|
||||||
"difficulty": 3.10,
|
|
||||||
"description": [
|
"description": [
|
||||||
"Now let's remove an HTML element from your page using jQuery.",
|
"Now let's remove an HTML element from your page using jQuery.",
|
||||||
"jQuery has a function called <code>.remove()</code> that will remove an HTML element entirely",
|
"jQuery has a function called <code>.remove()</code> that will remove an HTML element entirely",
|
||||||
@ -512,7 +502,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bad87fee1348bd9aed608826",
|
"id": "bad87fee1348bd9aed608826",
|
||||||
"title": "Use appendTo to Move Elements with jQuery",
|
"title": "Use appendTo to Move Elements with jQuery",
|
||||||
"difficulty": 3.11,
|
|
||||||
"description": [
|
"description": [
|
||||||
"Now let's try moving elements from one <code>div</code> to another.",
|
"Now let's try moving elements from one <code>div</code> to another.",
|
||||||
"jQuery has a function called <code>appendTo()</code> that allows you to select HTML elements and append them to another element.",
|
"jQuery has a function called <code>appendTo()</code> that allows you to select HTML elements and append them to another element.",
|
||||||
@ -564,7 +553,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bad87fee1348bd9aed508826",
|
"id": "bad87fee1348bd9aed508826",
|
||||||
"title": "Clone an Element Using jQuery",
|
"title": "Clone an Element Using jQuery",
|
||||||
"difficulty": 3.12,
|
|
||||||
"description": [
|
"description": [
|
||||||
"In addition to moving elements, you can also copy them from one place to another.",
|
"In addition to moving elements, you can also copy them from one place to another.",
|
||||||
"jQuery has a function called <code>clone()</code> that makes a copy of an element.",
|
"jQuery has a function called <code>clone()</code> that makes a copy of an element.",
|
||||||
@ -618,7 +606,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bad87fee1348bd9aed308826",
|
"id": "bad87fee1348bd9aed308826",
|
||||||
"title": "Target the Parent of an Element Using jQuery",
|
"title": "Target the Parent of an Element Using jQuery",
|
||||||
"difficulty": 3.13,
|
|
||||||
"description": [
|
"description": [
|
||||||
"Every HTML element has a <code>parent</code> element from which it <code>inherits</code> properties.",
|
"Every HTML element has a <code>parent</code> element from which it <code>inherits</code> properties.",
|
||||||
"For example, your <code>jQuery Playground</code> <code>h3</code> element has the parent element of <code><div class=\"container-fluid\"></code>, which itself has the parent <code>body</code>.",
|
"For example, your <code>jQuery Playground</code> <code>h3</code> element has the parent element of <code><div class=\"container-fluid\"></code>, which itself has the parent <code>body</code>.",
|
||||||
@ -674,7 +661,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bad87fee1348bd9aed208826",
|
"id": "bad87fee1348bd9aed208826",
|
||||||
"title": "Target the Children of an Element Using jQuery",
|
"title": "Target the Children of an Element Using jQuery",
|
||||||
"difficulty": 3.14,
|
|
||||||
"description": [
|
"description": [
|
||||||
"Many HTML elements have <code>children</code> which <code>inherit</code> their properties from their parent HTML elements.",
|
"Many HTML elements have <code>children</code> which <code>inherit</code> their properties from their parent HTML elements.",
|
||||||
"For example, every HTML element is a child of your <code>body</code> element, and your \"jQuery Playground\" <code>h3</code> element is a child of your <code><div class=\"container-fluid\"></code> element.",
|
"For example, every HTML element is a child of your <code>body</code> element, and your \"jQuery Playground\" <code>h3</code> element is a child of your <code><div class=\"container-fluid\"></code> element.",
|
||||||
@ -730,7 +716,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bad87fee1348bd9aed108826",
|
"id": "bad87fee1348bd9aed108826",
|
||||||
"title": "Target a Specific Child of an Element Using jQuery",
|
"title": "Target a Specific Child of an Element Using jQuery",
|
||||||
"difficulty": 3.15,
|
|
||||||
"description": [
|
"description": [
|
||||||
"You've seen why id attributes are so convenient for targeting with jQuery selectors. But you won't always have such neat ids to work with.",
|
"You've seen why id attributes are so convenient for targeting with jQuery selectors. But you won't always have such neat ids to work with.",
|
||||||
"Fortunately, jQuery has some other tricks for targeting the right elements.",
|
"Fortunately, jQuery has some other tricks for targeting the right elements.",
|
||||||
@ -787,7 +772,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bad87fee1348bd9aed008826",
|
"id": "bad87fee1348bd9aed008826",
|
||||||
"title": "Target Even Numbered Elements Using jQuery",
|
"title": "Target Even Numbered Elements Using jQuery",
|
||||||
"difficulty": 3.16,
|
|
||||||
"description": [
|
"description": [
|
||||||
"You can also target all the even-numbered elements.",
|
"You can also target all the even-numbered elements.",
|
||||||
"Here's how you would target all the odd-numbered elements with class <code>target</code> and give them classes: <code>$(\".target:odd\").addClass(\"animated shake\");</code>",
|
"Here's how you would target all the odd-numbered elements with class <code>target</code> and give them classes: <code>$(\".target:odd\").addClass(\"animated shake\");</code>",
|
||||||
@ -845,7 +829,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bad87fee1348bd9aecb08826",
|
"id": "bad87fee1348bd9aecb08826",
|
||||||
"title": "Use jQuery to Modify the Entire Page",
|
"title": "Use jQuery to Modify the Entire Page",
|
||||||
"difficulty": 3.20,
|
|
||||||
"description": [
|
"description": [
|
||||||
"We're done playing with our jQuery playground. Let's tear it down!",
|
"We're done playing with our jQuery playground. Let's tear it down!",
|
||||||
"jQuery can target the <code>body</code> element as well.",
|
"jQuery can target the <code>body</code> element as well.",
|
||||||
|
@ -5,7 +5,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bd7243d8c341eddeaeb5bd0f",
|
"id": "bd7243d8c341eddeaeb5bd0f",
|
||||||
"title": "Store Data in MongoDB",
|
"title": "Store Data in MongoDB",
|
||||||
"difficulty": 0.01,
|
|
||||||
"challengeSeed": ["133316035"],
|
"challengeSeed": ["133316035"],
|
||||||
"description": [
|
"description": [
|
||||||
"We'll build this Waypoint on Cloud 9, a powerful online code editor with a full Ubuntu Linux workspace, all running in the cloud.",
|
"We'll build this Waypoint on Cloud 9, a powerful online code editor with a full Ubuntu Linux workspace, all running in the cloud.",
|
||||||
|
@ -5,7 +5,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bd7153d8c441eddfaeb5bd0f",
|
"id": "bd7153d8c441eddfaeb5bd0f",
|
||||||
"title": "Manage Packages with NPM",
|
"title": "Manage Packages with NPM",
|
||||||
"difficulty": 0.39,
|
|
||||||
"challengeSeed": ["126433450"],
|
"challengeSeed": ["126433450"],
|
||||||
"description": [
|
"description": [
|
||||||
"We'll build this Waypoint on Cloud 9, a powerful online code editor with a full Ubuntu Linux workspace, all running in the cloud.",
|
"We'll build this Waypoint on Cloud 9, a powerful online code editor with a full Ubuntu Linux workspace, all running in the cloud.",
|
||||||
@ -59,7 +58,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bd7153d8c441eddfaeb5bdff",
|
"id": "bd7153d8c441eddfaeb5bdff",
|
||||||
"title": "Start a Node.js Server",
|
"title": "Start a Node.js Server",
|
||||||
"difficulty": 0.40,
|
|
||||||
"challengeSeed": ["126411561"],
|
"challengeSeed": ["126411561"],
|
||||||
"description": [
|
"description": [
|
||||||
"We'll build this Waypoint on Cloud 9, a powerful online code editor with a full Ubuntu Linux workspace, all running in the cloud. We'll do the first 7 steps of Node School's LearnYouNode challenges.",
|
"We'll build this Waypoint on Cloud 9, a powerful online code editor with a full Ubuntu Linux workspace, all running in the cloud. We'll do the first 7 steps of Node School's LearnYouNode challenges.",
|
||||||
@ -101,7 +99,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bd7153d8c441eddfaeb5bdfe",
|
"id": "bd7153d8c441eddfaeb5bdfe",
|
||||||
"title": "Continue working with Node.js Servers",
|
"title": "Continue working with Node.js Servers",
|
||||||
"difficulty": 0.41,
|
|
||||||
"challengeSeed": ["128836506"],
|
"challengeSeed": ["128836506"],
|
||||||
"description": [
|
"description": [
|
||||||
"Let's continue the LearnYouNode Node School challenge. For this Waypoint, we'll do challenges 8 through 10.",
|
"Let's continue the LearnYouNode Node School challenge. For this Waypoint, we'll do challenges 8 through 10.",
|
||||||
@ -130,7 +127,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bd7153d8c441eddfaeb5bdfd",
|
"id": "bd7153d8c441eddfaeb5bdfd",
|
||||||
"title": "Finish working with Node.js Servers",
|
"title": "Finish working with Node.js Servers",
|
||||||
"difficulty": 0.42,
|
|
||||||
"challengeSeed": ["128836507"],
|
"challengeSeed": ["128836507"],
|
||||||
"description": [
|
"description": [
|
||||||
"Let's continue the LearnYouNode Node School challenge. For this Waypoint, we'll do challenges 11 through 13.",
|
"Let's continue the LearnYouNode Node School challenge. For this Waypoint, we'll do challenges 11 through 13.",
|
||||||
@ -159,7 +155,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bd7153d8c441eddfaeb5bd1f",
|
"id": "bd7153d8c441eddfaeb5bd1f",
|
||||||
"title": "Build Web Apps with Express.js",
|
"title": "Build Web Apps with Express.js",
|
||||||
"difficulty": 0.43,
|
|
||||||
"challengeSeed": [
|
"challengeSeed": [
|
||||||
"126411559"
|
"126411559"
|
||||||
],
|
],
|
||||||
|
@ -286,7 +286,6 @@
|
|||||||
{
|
{
|
||||||
"id": "cf1111c1c16feddfaeb2bdef",
|
"id": "cf1111c1c16feddfaeb2bdef",
|
||||||
"title": "Reverse Arrays with .reverse",
|
"title": "Reverse Arrays with .reverse",
|
||||||
"difficulty": 0,
|
|
||||||
"description": [
|
"description": [
|
||||||
"You can use the <code>.reverse()</code> function to reverse the contents of an array."
|
"You can use the <code>.reverse()</code> function to reverse the contents of an array."
|
||||||
],
|
],
|
||||||
@ -310,7 +309,6 @@
|
|||||||
{
|
{
|
||||||
"id": "cf1111c1c16feddfaeb3bdef",
|
"id": "cf1111c1c16feddfaeb3bdef",
|
||||||
"title": "Concatenate Strings with .concat",
|
"title": "Concatenate Strings with .concat",
|
||||||
"difficulty": 0,
|
|
||||||
"description": [
|
"description": [
|
||||||
"<code>.concat()</code> can be used to merge the contents of two arrays into one.",
|
"<code>.concat()</code> can be used to merge the contents of two arrays into one.",
|
||||||
"<code>array = array.concat(otherArray);</code>"
|
"<code>array = array.concat(otherArray);</code>"
|
||||||
|
@ -5,7 +5,6 @@
|
|||||||
{
|
{
|
||||||
"id": "a2f1d72d9b908d0bd72bb9f6",
|
"id": "a2f1d72d9b908d0bd72bb9f6",
|
||||||
"title": "Make a Person",
|
"title": "Make a Person",
|
||||||
"difficulty": "3.01",
|
|
||||||
"description": [
|
"description": [
|
||||||
"Fill in the object constructor with the methods specified in the tests.",
|
"Fill in the object constructor with the methods specified in the tests.",
|
||||||
"Those methods are getFirstName(), getLastName(), getFullName(), setFirstName(first), setLastName(last), and setFullName(firstAndLast).",
|
"Those methods are getFirstName(), getLastName(), getFullName(), setFirstName(first), setLastName(last), and setFullName(firstAndLast).",
|
||||||
@ -51,7 +50,6 @@
|
|||||||
"id": "af4afb223120f7348cdfc9fd",
|
"id": "af4afb223120f7348cdfc9fd",
|
||||||
"title": "Map the Debris",
|
"title": "Map the Debris",
|
||||||
"dashedName": "bonfire-map-the-debris",
|
"dashedName": "bonfire-map-the-debris",
|
||||||
"difficulty": "3.02",
|
|
||||||
"description": [
|
"description": [
|
||||||
"Return a new array that transforms the element's average altitude into their orbital periods.",
|
"Return a new array that transforms the element's average altitude into their orbital periods.",
|
||||||
"The array will contain objects in the format <code>{name: 'name', avgAlt: avgAlt}</code>.",
|
"The array will contain objects in the format <code>{name: 'name', avgAlt: avgAlt}</code>.",
|
||||||
@ -92,7 +90,6 @@
|
|||||||
{
|
{
|
||||||
"id": "a3f503de51cfab748ff001aa",
|
"id": "a3f503de51cfab748ff001aa",
|
||||||
"title": "Pairwise",
|
"title": "Pairwise",
|
||||||
"difficulty": "3.03",
|
|
||||||
"description": [
|
"description": [
|
||||||
"Return the sum of all indices of elements of 'arr' that can be paired with one other element to form a sum that equals the value in the second argument 'arg'. If multiple sums are possible, return the smallest sum. Once an element has been used, it cannot be reused to pair with another.",
|
"Return the sum of all indices of elements of 'arr' that can be paired with one other element to form a sum that equals the value in the second argument 'arg'. If multiple sums are possible, return the smallest sum. Once an element has been used, it cannot be reused to pair with another.",
|
||||||
"For example, pairwise([1, 4, 2, 3, 0, 5], 7) should return 11 because 4, 2, 3 and 5 can be paired with each other to equal 7.",
|
"For example, pairwise([1, 4, 2, 3, 0, 5], 7) should return 11 because 4, 2, 3 and 5 can be paired with each other to equal 7.",
|
||||||
|
@ -5,7 +5,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bad87fed1348bd9aeca08826",
|
"id": "bad87fed1348bd9aeca08826",
|
||||||
"title": "Trigger on click Events with jQuery",
|
"title": "Trigger on click Events with jQuery",
|
||||||
"difficulty": 3.19,
|
|
||||||
"description": [
|
"description": [
|
||||||
"With jQuery we are able to get data from APIs via Ajax",
|
"With jQuery we are able to get data from APIs via Ajax",
|
||||||
"This data normally comes in the form of JSON",
|
"This data normally comes in the form of JSON",
|
||||||
@ -106,7 +105,6 @@
|
|||||||
{
|
{
|
||||||
"id": "bad87fee1348bd9aeca08826",
|
"id": "bad87fee1348bd9aeca08826",
|
||||||
"title": "Displaying JSON data in HTML",
|
"title": "Displaying JSON data in HTML",
|
||||||
"difficulty": 3.19,
|
|
||||||
"description": [
|
"description": [
|
||||||
"JSON stands for \"JavaScript Object Notation\". It\"s how you create objects in JavaScript.",
|
"JSON stands for \"JavaScript Object Notation\". It\"s how you create objects in JavaScript.",
|
||||||
"JSON is a series of \"key-value pairs\". Everything on the left of the colon (<code>:</code>) is the \"key\" you use to unlock the \"value\" on the right of the colon."
|
"JSON is a series of \"key-value pairs\". Everything on the left of the colon (<code>:</code>) is the \"key\" you use to unlock the \"value\" on the right of the colon."
|
||||||
@ -153,7 +151,6 @@
|
|||||||
"id": "bad84fee1348bd9aecc48826",
|
"id": "bad84fee1348bd9aecc48826",
|
||||||
"title": "Read Data from an Element Using jQuery",
|
"title": "Read Data from an Element Using jQuery",
|
||||||
"dashedName": "waypoint-read-data-from-an-element-using-jquery",
|
"dashedName": "waypoint-read-data-from-an-element-using-jquery",
|
||||||
"difficulty": 3.17,
|
|
||||||
"description": [
|
"description": [
|
||||||
"Let's make everything roll with <code>rollOut</code>."
|
"Let's make everything roll with <code>rollOut</code>."
|
||||||
],
|
],
|
||||||
@ -192,7 +189,6 @@
|
|||||||
"id": "bad84fee1348bd9aecc38826",
|
"id": "bad84fee1348bd9aecc38826",
|
||||||
"title": "Read Data from an Element Using jQuery",
|
"title": "Read Data from an Element Using jQuery",
|
||||||
"dashedName": "waypoint-read-data-from-an-element-using-jquery",
|
"dashedName": "waypoint-read-data-from-an-element-using-jquery",
|
||||||
"difficulty": 3.17,
|
|
||||||
"description": [
|
"description": [
|
||||||
"Let's make everything roll with <code>rollOut</code>."
|
"Let's make everything roll with <code>rollOut</code>."
|
||||||
],
|
],
|
||||||
@ -232,7 +228,6 @@
|
|||||||
"id": "bad84fee1348bd9aecc28826",
|
"id": "bad84fee1348bd9aecc28826",
|
||||||
"title": "Read Data from an Element Using jQuery",
|
"title": "Read Data from an Element Using jQuery",
|
||||||
"dashedName": "waypoint-read-data-from-an-element-using-jquery",
|
"dashedName": "waypoint-read-data-from-an-element-using-jquery",
|
||||||
"difficulty": 3.17,
|
|
||||||
"description": [
|
"description": [
|
||||||
"Let's make everything roll with <code>rollOut</code>."
|
"Let's make everything roll with <code>rollOut</code>."
|
||||||
],
|
],
|
||||||
@ -272,7 +267,6 @@
|
|||||||
"id": "bad84fee1348bd9aecc18826",
|
"id": "bad84fee1348bd9aecc18826",
|
||||||
"title": "Read Data from an Element Using jQuery",
|
"title": "Read Data from an Element Using jQuery",
|
||||||
"dashedName": "waypoint-read-data-from-an-element-using-jquery",
|
"dashedName": "waypoint-read-data-from-an-element-using-jquery",
|
||||||
"difficulty": 3.17,
|
|
||||||
"description": [
|
"description": [
|
||||||
|
|
||||||
],
|
],
|
||||||
@ -312,7 +306,6 @@
|
|||||||
"id": "bad87fee1348bd9aecc08826",
|
"id": "bad87fee1348bd9aecc08826",
|
||||||
"title": "Trigger onHover Events with jQuery",
|
"title": "Trigger onHover Events with jQuery",
|
||||||
"dashedName": "waypoint-trigger-onhover-events-with-jquery",
|
"dashedName": "waypoint-trigger-onhover-events-with-jquery",
|
||||||
"difficulty": 3.18,
|
|
||||||
"description": [
|
"description": [
|
||||||
|
|
||||||
],
|
],
|
||||||
@ -330,7 +323,6 @@
|
|||||||
"id": "bad87fee1348bd9aebc08826",
|
"id": "bad87fee1348bd9aebc08826",
|
||||||
"title": "Get Data from an URL Using jQuery",
|
"title": "Get Data from an URL Using jQuery",
|
||||||
"dashedName": "waypoint-get-data-from-a-url-using-jquery",
|
"dashedName": "waypoint-get-data-from-a-url-using-jquery",
|
||||||
"difficulty": 3.21,
|
|
||||||
"description": [
|
"description": [
|
||||||
|
|
||||||
],
|
],
|
||||||
@ -364,7 +356,6 @@
|
|||||||
"id": "bad87fee1348bd9ae9c08826",
|
"id": "bad87fee1348bd9ae9c08826",
|
||||||
"title": "Loop through JSON Data Using jQuery",
|
"title": "Loop through JSON Data Using jQuery",
|
||||||
"dashedName": "waypoint-loop-through-json-data-using-jquery",
|
"dashedName": "waypoint-loop-through-json-data-using-jquery",
|
||||||
"difficulty": 3.22,
|
|
||||||
"description": [
|
"description": [
|
||||||
|
|
||||||
],
|
],
|
||||||
@ -398,7 +389,6 @@
|
|||||||
"id": "bad88fee1348bd9ae8c08726",
|
"id": "bad88fee1348bd9ae8c08726",
|
||||||
"title": "Wire AJAX Call into a jQuery Click Event",
|
"title": "Wire AJAX Call into a jQuery Click Event",
|
||||||
"dashedName": "waypoint-wire-ajax-call-into-a-jquery-click-event",
|
"dashedName": "waypoint-wire-ajax-call-into-a-jquery-click-event",
|
||||||
"difficulty": 3.24,
|
|
||||||
"description": [
|
"description": [
|
||||||
"<img src=\"https://www.evernote.com/l/AjmAQ5BxGrFGRrWl_j2eSpGZMfrunfse89gB/image.png\">"
|
"<img src=\"https://www.evernote.com/l/AjmAQ5BxGrFGRrWl_j2eSpGZMfrunfse89gB/image.png\">"
|
||||||
],
|
],
|
||||||
@ -432,7 +422,6 @@
|
|||||||
"id": "bad88fee1348bd9ae8c08626",
|
"id": "bad88fee1348bd9ae8c08626",
|
||||||
"title": "Wire AJAX Call into a jQuery Click Event",
|
"title": "Wire AJAX Call into a jQuery Click Event",
|
||||||
"dashedName": "waypoint-wire-ajax-call-into-a-jquery-click-event",
|
"dashedName": "waypoint-wire-ajax-call-into-a-jquery-click-event",
|
||||||
"difficulty": 3.24,
|
|
||||||
"description": [
|
"description": [
|
||||||
"<img src=\"https://www.evernote.com/l/AjmAQ5BxGrFGRrWl_j2eSpGZMfrunfse89gB/image.png\">"
|
"<img src=\"https://www.evernote.com/l/AjmAQ5BxGrFGRrWl_j2eSpGZMfrunfse89gB/image.png\">"
|
||||||
],
|
],
|
||||||
@ -466,7 +455,6 @@
|
|||||||
"id": "bad88fee1348bd9ae8c08526",
|
"id": "bad88fee1348bd9ae8c08526",
|
||||||
"title": "Wire AJAX Call into a jQuery Click Event",
|
"title": "Wire AJAX Call into a jQuery Click Event",
|
||||||
"dashedName": "waypoint-wire-ajax-call-into-a-jquery-click-event",
|
"dashedName": "waypoint-wire-ajax-call-into-a-jquery-click-event",
|
||||||
"difficulty": 3.24,
|
|
||||||
"description": [
|
"description": [
|
||||||
"<img src=\"https://www.evernote.com/l/AjmAQ5BxGrFGRrWl_j2eSpGZMfrunfse89gB/image.png\">"
|
"<img src=\"https://www.evernote.com/l/AjmAQ5BxGrFGRrWl_j2eSpGZMfrunfse89gB/image.png\">"
|
||||||
],
|
],
|
||||||
@ -500,7 +488,6 @@
|
|||||||
"id": "bad88fee1348bd9ae8c08426",
|
"id": "bad88fee1348bd9ae8c08426",
|
||||||
"title": "Wire AJAX Call into a jQuery Click Event",
|
"title": "Wire AJAX Call into a jQuery Click Event",
|
||||||
"dashedName": "waypoint-wire-ajax-call-into-a-jquery-click-event",
|
"dashedName": "waypoint-wire-ajax-call-into-a-jquery-click-event",
|
||||||
"difficulty": 3.24,
|
|
||||||
"description": [
|
"description": [
|
||||||
"<img src=\"https://www.evernote.com/l/AjmAQ5BxGrFGRrWl_j2eSpGZMfrunfse89gB/image.png\">"
|
"<img src=\"https://www.evernote.com/l/AjmAQ5BxGrFGRrWl_j2eSpGZMfrunfse89gB/image.png\">"
|
||||||
],
|
],
|
||||||
|
Reference in New Issue
Block a user