diff --git a/packages/learn/src/introductions/front-end-libraries/react-and-redux/index.md b/packages/learn/src/introductions/front-end-libraries/react-and-redux/index.md new file mode 100644 index 0000000000..c12d321153 --- /dev/null +++ b/packages/learn/src/introductions/front-end-libraries/react-and-redux/index.md @@ -0,0 +1,8 @@ +--- +title: Introduction to the React and Redux Challenges +block: React and Redux +superBlock: Front End Libraries +--- +## Introduction to the React and Redux Challenges + +This is a stub introduction. \ No newline at end of file diff --git a/packages/learn/src/introductions/front-end-libraries/react/index.md b/packages/learn/src/introductions/front-end-libraries/react/index.md new file mode 100644 index 0000000000..a28fee23da --- /dev/null +++ b/packages/learn/src/introductions/front-end-libraries/react/index.md @@ -0,0 +1,8 @@ +--- +title: Introduction to the React Challenges +block: React +superBlock: Front End Libraries +--- +## Introduction to the React Challenges + +This is a stub introduction. \ No newline at end of file diff --git a/packages/learn/src/introductions/front-end-libraries/redux/index.md b/packages/learn/src/introductions/front-end-libraries/redux/index.md new file mode 100644 index 0000000000..a2fcb07ae6 --- /dev/null +++ b/packages/learn/src/introductions/front-end-libraries/redux/index.md @@ -0,0 +1,8 @@ +--- +title: Introduction to the Redux Challenges +block: Redux +superBlock: Front End Libraries +--- +## Introduction to the Redux Challenges + +This is a stub introduction. \ No newline at end of file diff --git a/packages/learn/src/introductions/information-security-and-quality-assurance/advanced-node-and-express/index.md b/packages/learn/src/introductions/information-security-and-quality-assurance/advanced-node-and-express/index.md new file mode 100644 index 0000000000..bbb10aa8ef --- /dev/null +++ b/packages/learn/src/introductions/information-security-and-quality-assurance/advanced-node-and-express/index.md @@ -0,0 +1,8 @@ +--- +title: Introduction to the Advances Node and Express Challenges +block: Advanced Node and Express +superBlock: Information Security and Quality Assurance +--- +## Introduction to Advanced Node and Express Challenges + +This is a stub introduction \ No newline at end of file diff --git a/packages/learn/src/introductions/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/index.md b/packages/learn/src/introductions/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/index.md new file mode 100644 index 0000000000..7c60e8bcf2 --- /dev/null +++ b/packages/learn/src/introductions/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/index.md @@ -0,0 +1,8 @@ +--- +title: Introduction to the Quality Assurance with Chai Challenges +block: Quality Assurance with Chai +superBlock: Information Security and Quality Assurance +--- +## Introduction to Quality Assurance with Chai Challenges + +This is a stub introduction \ No newline at end of file diff --git a/packages/learn/src/introductions/javascript-algorithms-and-data-structures/basic-data-structures/index.md b/packages/learn/src/introductions/javascript-algorithms-and-data-structures/basic-data-structures/index.md index 0c31d519c4..ab9369de31 100644 --- a/packages/learn/src/introductions/javascript-algorithms-and-data-structures/basic-data-structures/index.md +++ b/packages/learn/src/introductions/javascript-algorithms-and-data-structures/basic-data-structures/index.md @@ -1,12 +1,8 @@ --- -title: Introduction to Objects +title: Introduction to the Basic Data Structure Challenges block: Basic Data Structures superBlock: JavaScript Algorithms and Data Structures --- -## Introduction to Objects - -The next data structure we will discuss is the JavaScript object. Like arrays, objects are a fundamental part of JavaScript. However, it is probably safe to say that objects surpass arrays in flexibility, usefulness and in their overall importance to the language — in fact, you may have heard this line before: 'In JavaScript, everything is an object.'

While an understanding of objects is important to understand the inner workings of JavaScript functions or JavaScript's object-oriented capabilities, JavaScript objects at a basic level are actually just key-value pair stores, a commonly used data structure across almost all programming languages. Here, we will confine our discussion to JavaScript objects in this capacity. -Key-value pair data structures go by different names depending on the language and the specific details of the data structure. The terms dictionary, map, and hash table all refer to the notion of a data structure in which specific keys, or properties, are mapped to specific values.

Objects, and other similar key-value pair data structures, offer some very useful benefits. One clear benefit is that they allow us to structure our data in an intuitive way; properties can be nested to an arbitrary depth, and values can be anything, including arrays and even other objects.

Largely due to this flexibility, objects are also the foundation for JavaScript Object Notation, or JSON, which is a widely used method of sending data across the web. -Another powerful advantage of key-value pair data structures is constant lookup time. What this means, is that when you request the value of a specific property, you will get the value back in the same amount of time (theoretically) regardless of the number of entries in the object. If you had an object with 5 entries or one that held a collection of 1,000,000, you could still retrieve property values or check if a key exists in the same amount of time.

The reason for this fast lookup time, is that internally, the object is storing properties using a hashing mechanism which allows it to know exactly where it has stored different property values. If you want to learn more about this please take a look at the optional Advanced Data Structures challenges. All you should remember for now is that performant access to flexibly structured data make key-value stores very attractive data structures useful in a wide variety of settings. -

In JavaScript, objects are written as comma-separated lists of key-value pairs, wrapped in curly brackets, with each key and its assigned value separated by a colon:
{ key1: 'val-1', key2: 'val-2' }

In the next few challenges, we will examine JavaScript objects more closely, and take a look at methods and techniques that allow us to access, store, and manipulate an object's data.

Note that throughout the scope of this discussion, and in general when considering JavaScript objects, the terms key and property will be used interchangeably. +## Introduction to the Basic Data Structure Challenges +This is a stub introduction \ No newline at end of file diff --git a/packages/learn/src/introductions/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/index.md b/packages/learn/src/introductions/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/index.md new file mode 100644 index 0000000000..3f384f6ec3 --- /dev/null +++ b/packages/learn/src/introductions/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/index.md @@ -0,0 +1,8 @@ +--- +title: Introduction to the Intermediate Algorithm Scripting Challenges +block: Intermediate Algorithm Scripting +superBlock: JavaScript Algorithms and Data Structures +--- +## Introduction to the Intermediate Algorithm Scripting Challenges + +This is a stub introduction \ No newline at end of file diff --git a/packages/learn/src/layouts/index.js b/packages/learn/src/layouts/index.js index 6634665fe1..3ff2aa706f 100644 --- a/packages/learn/src/layouts/index.js +++ b/packages/learn/src/layouts/index.js @@ -24,23 +24,25 @@ const Layout = ({ children, data: { allChallengeNode: { edges } } }) => ( ]} />
- - - - +
+ + + + - + - -
{children()}
- - + +
{children()}
+ + +
); diff --git a/packages/learn/src/layouts/layout.css b/packages/learn/src/layouts/layout.css index b6f096d290..d8218919d3 100644 --- a/packages/learn/src/layouts/layout.css +++ b/packages/learn/src/layouts/layout.css @@ -1,6 +1,3 @@ -.app-wrapper { - max-height: calc(100vh - (45px + 1.45rem)); -} main { height: 100%; @@ -9,17 +6,21 @@ main { .reflex-layout.vertical > .reflex-splitter, .reflex-layout > .reflex-element { /* - Note(Bouncey): removing height: 100% makes the element 100% high ¯\_(ツ)_/¯ + Note(Bouncey): removing height: 100% makes the element 100% high ¯\_(ツ)_/¯ */ height: auto; } .reflex-layout.vertical .reflex-splitter:hover { - border-left: 2px solid #006400 !important; - border-right: 2px solid #006400 !important; - background-color: #006400; + border-left: 2px solid #006400 !important; + border-right: 2px solid #006400 !important; + background-color: #006400; } .reflex-layout.vertical > .reflex-splitter{ width: 5px; +} + +.app-wrapper { + height: calc(100vh - (38px + 0.45rem)); } \ No newline at end of file diff --git a/packages/learn/src/templates/Challenges/redux/execute-challenge-epic.js b/packages/learn/src/templates/Challenges/redux/execute-challenge-epic.js index 6814d68400..3983bfd28f 100644 --- a/packages/learn/src/templates/Challenges/redux/execute-challenge-epic.js +++ b/packages/learn/src/templates/Challenges/redux/execute-challenge-epic.js @@ -20,7 +20,8 @@ import { initConsole, updateConsole, checkChallenge, - updateTests + updateTests, + disableJSOnError } from './'; import { buildFromFiles } from '../utils/build'; import { @@ -101,7 +102,7 @@ function executeChallengeEpic(action$, { getState }, { document }) { .do(frameTests) .ignoreElements() .startWith(initConsole('// running test')) - .catch(err => console.log(err)); + .catch(err => disableJSOnError(err)); }) ); return merge(buildAndFrameChallenge, challengeResults);