Merge branch 'master' into patch-1

.travis.yml

@@ -11,9 +11,8 @@ before_install:
 script:
 - npm run linter
 - npm run extractor
-- npm run builder
 - npm run packager
-- npm run tester
+- npm run test
 - npm run vscoder
 after_success:
 - chmod +x .travis/push.sh

.travis/push.sh

@@ -26,7 +26,7 @@ upload_files() {
   if [ $TRAVIS_EVENT_TYPE != "pull_request" ]; then
     if [ $TRAVIS_BRANCH == "master" ]; then
       echo "Pushing to master branch..."
-      git push --force --quiet "https://${GH_TOKEN}@github.com/30-seconds/30-seconds-of-code.git" master > /dev/null 2>&1
+      git push --quiet "https://${GH_TOKEN}@github.com/30-seconds/30-seconds-of-code.git" master > /dev/null 2>&1
     fi
   fi
 }

assets/logos/logo.svg

@@ -1,24 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="512" height="512" viewbox="0 0 512 512">
-  <defs>
-    <style>
-      @import url(https://fonts.googleapis.com/css?family=Source+Sans+Pro:600);
-    </style>
-  </defs>
-  <ellipse id="yellow-bg" cx="256" cy="256" fill="#f7df1e" stroke-linecap="round" rx="224" ry="224"/>
-  <path id="left-outline" fill="none" stroke="#060606" stroke-linecap="round" stroke-width="15" d="M107.75 427.164c-46.086-41.619-75.262-102.447-76.632-170.59-.298-19.408 1.73-38.295 5.816-56.375"/>
-  <path id="right-outline" fill="none" stroke="#060606" stroke-linecap="round" stroke-width="13.803" d="M211.607 35.363A224.31 224.31 0 0 1 256 30.95c123.712 0 224 100.632 224 224.768 0 124.135-100.288 224.767-224 224.767-16.58 0-32.74-1.807-48.293-5.237"/>
-  <path id="left-detail" fill="none" stroke="#060606" stroke-linecap="round" stroke-width="14" d="M76.974 122.656a83.03 83.03 0 0 1 6.014-8.151"/>
-  <path id="right-line" fill="none" stroke="#060606" stroke-linecap="round" stroke-width="10" d="M32 256h20"/>
-  <path id="left-line" fill="none" stroke="#060606" stroke-linecap="round" stroke-width="10" d="M460 256h20"/>
-  <path id="top-line" fill="none" stroke="#060606" stroke-linecap="round" stroke-width="10" d="M256 32v20"/>
-  <path id="bottom-line" fill="none" stroke="#060606" stroke-linecap="round" stroke-width="10" d="M256 460v20"/>
-  <path id="right-bottom-line" fill="none" stroke="#060606" stroke-linecap="round" stroke-width="10" d="M72 384l12-10"/>
-  <path id="left-mid-bt-line" fill="none" stroke="#060606" stroke-linecap="round" stroke-width="10" d="M440 384l-12-10"/>
-  <path id="left-mid-line" fill="none" stroke="#060606" stroke-linecap="round" stroke-width="10" d="M430 118l-12 10"/>
-  <path id="top-left-line" fill="none" stroke="#060606" stroke-linecap="round" stroke-width="10" d="M350 70l9-14"/>
-  <path id="bottom-left-line" fill="none" stroke="#060606" stroke-linecap="round" stroke-width="10" d="M350 442l9 14"/>
-  <path id="hand" fill="rgba(170,170,170,1)" stroke="#060606" stroke-width="9.584" d="M279.967 249.94c-3.009-14.768-16.44-24.085-30-20.808-13.56 3.276-22.114 17.905-19.106 32.674 3.008 14.769 50.44 120.443 50.57 118.892.068-.81 1.544-115.988-1.464-130.757z"/>
-  <text x="196" y="188" fill="#060606" font-family="Source Sans Pro" font-size="120">
-    JS
-  </text>
-</svg>

config.js

@@ -16,7 +16,7 @@ module.exports = {
   distPath: `dist`,
   testPath: `test`,
   // General information
-  language:{
+  language: {
     short: `js`,
     long: `JavaScript`
   },
@@ -28,5 +28,6 @@ module.exports = {
   requirables: [
     `snippets.json`,
     `archivedSnippets.json`
-  ]
+  ],
+  parser: '_30codeParser',
 };

dist/_30s.esm.js

@@ -198,8 +198,8 @@ const deepClone = obj => {
   return Array.isArray(obj) && obj.length
     ? (clone.length = obj.length) && Array.from(clone)
     : Array.isArray(obj)
-    ? Array.from(obj)
+      ? Array.from(obj)
-    : clone;
+      : clone;
 };
 const deepFlatten = arr => [].concat(...arr.map(v => (Array.isArray(v) ? deepFlatten(v) : v)));
 const deepFreeze = obj =>
@@ -211,13 +211,13 @@ const deepMapKeys = (obj, f) =>
   Array.isArray(obj)
     ? obj.map(val => deepMapKeys(val, f))
     : typeof obj === 'object'
-    ? Object.keys(obj).reduce((acc, current) => {
+      ? Object.keys(obj).reduce((acc, current) => {
         const val = obj[current];
         acc[f(current)] =
           val !== null && typeof val === 'object' ? deepMapKeys(val, f) : (acc[f(current)] = val);
         return acc;
       }, {})
-    : obj;
+      : obj;
 const defaults = (obj, ...defs) => Object.assign({}, obj, ...defs.reverse(), obj);
 const defer = (fn, ...args) => setTimeout(fn, 1, ...args);
 const degreesToRads = deg => (deg * Math.PI) / 180.0;
@@ -239,9 +239,9 @@ const dig = (obj, target) =>
   target in obj
     ? obj[target]
     : Object.values(obj).reduce((acc, val) => {
-        if (acc !== undefined) return acc;
+      if (acc !== undefined) return acc;
-        if (typeof val === 'object') return dig(val, target);
+      if (typeof val === 'object') return dig(val, target);
-      }, undefined);
+    }, undefined);
 const digitize = n => [...`${n}`].map(i => parseInt(i));
 const distance = (x0, y0, x1, y1) => Math.hypot(x1 - x0, y1 - y0);
 const drop = (arr, n = 1) => arr.slice(n);
@@ -313,11 +313,11 @@ const extendHex = shortHex =>
 const factorial = n =>
   n < 0
     ? (() => {
-        throw new TypeError('Negative numbers are not allowed!');
+      throw new TypeError('Negative numbers are not allowed!');
-      })()
+    })()
     : n <= 1
-    ? 1
+      ? 1
-    : n * factorial(n - 1);
+      : n * factorial(n - 1);
 const fibonacci = n =>
   Array.from({ length: n }).reduce(
     (acc, val, i) => acc.concat(i > 1 ? acc[i - 1] + acc[i - 2] : i),
@@ -418,10 +418,10 @@ const getMeridiemSuffixOfInteger = num =>
   num === 0 || num === 24
     ? 12 + 'am'
     : num === 12
-    ? 12 + 'pm'
+      ? 12 + 'pm'
-    : num < 12
+      : num < 12
-    ? (num % 12) + 'am'
+        ? (num % 12) + 'am'
-    : (num % 12) + 'pm';
+        : (num % 12) + 'pm';
 const getScrollPosition = (el = window) => ({
   x: el.pageXOffset !== undefined ? el.pageXOffset : el.scrollLeft,
   y: el.pageYOffset !== undefined ? el.pageYOffset : el.scrollTop
@@ -654,8 +654,8 @@ const join = (arr, separator = ',', end = separator) =>
       i === arr.length - 2
         ? acc + val + end
         : i === arr.length - 1
-        ? acc + val
+          ? acc + val
-        : acc + val + separator,
+          : acc + val + separator,
     ''
   );
 const JSONtoCSV = (arr, columns, delimiter = ',') =>
@@ -773,10 +773,10 @@ const objectToPairs = obj => Object.keys(obj).map(k => [k, obj[k]]);
 const objectToQueryString = queryParameters => {
   return queryParameters
     ? Object.entries(queryParameters).reduce((queryString, [key, val], index) => {
-      const symbol = index === 0 ? '?' : '&';
+        const symbol = index === 0 ? '?' : '&';
-      queryString += typeof val === 'string' ? `${symbol}${key}=${val}` : '';
+        queryString += typeof val === 'string' ? `${symbol}${key}=${val}` : '';
-      return queryString;
+        return queryString;
-    }, '')
+      }, '')
     : '';
 };
 const observeMutations = (element, callback, options) => {
@@ -1007,9 +1007,9 @@ const reject = (pred, array) => array.filter((...args) => !pred(...args));
 const remove = (arr, func) =>
   Array.isArray(arr)
     ? arr.filter(func).reduce((acc, val) => {
-        arr.splice(arr.indexOf(val), 1);
+      arr.splice(arr.indexOf(val), 1);
-        return acc.concat(val);
+      return acc.concat(val);
-      }, [])
+    }, [])
     : [];
 const removeNonASCII = str => str.replace(/[^\x20-\x7E]/g, '');
 const renameKeys = (keysMap, obj) =>
@@ -1087,10 +1087,10 @@ const size = val =>
   Array.isArray(val)
     ? val.length
     : val && typeof val === 'object'
-    ? val.size || val.length || Object.keys(val).length
+      ? val.size || val.length || Object.keys(val).length
-    : typeof val === 'string'
+      : typeof val === 'string'
-    ? new Blob([val]).size
+        ? new Blob([val]).size
-    : 0;
+        : 0;
 const sleep = ms => new Promise(resolve => setTimeout(resolve, ms));
 const smoothScroll = element =>
   document.querySelector(element).scrollIntoView({

dist/_30s.js

@@ -204,8 +204,8 @@
     return Array.isArray(obj) && obj.length
       ? (clone.length = obj.length) && Array.from(clone)
       : Array.isArray(obj)
-      ? Array.from(obj)
+        ? Array.from(obj)
-      : clone;
+        : clone;
   };
   const deepFlatten = arr => [].concat(...arr.map(v => (Array.isArray(v) ? deepFlatten(v) : v)));
   const deepFreeze = obj =>
@@ -217,13 +217,13 @@
     Array.isArray(obj)
       ? obj.map(val => deepMapKeys(val, f))
       : typeof obj === 'object'
-      ? Object.keys(obj).reduce((acc, current) => {
+        ? Object.keys(obj).reduce((acc, current) => {
           const val = obj[current];
           acc[f(current)] =
             val !== null && typeof val === 'object' ? deepMapKeys(val, f) : (acc[f(current)] = val);
           return acc;
         }, {})
-      : obj;
+        : obj;
   const defaults = (obj, ...defs) => Object.assign({}, obj, ...defs.reverse(), obj);
   const defer = (fn, ...args) => setTimeout(fn, 1, ...args);
   const degreesToRads = deg => (deg * Math.PI) / 180.0;
@@ -245,9 +245,9 @@
     target in obj
       ? obj[target]
       : Object.values(obj).reduce((acc, val) => {
-          if (acc !== undefined) return acc;
+        if (acc !== undefined) return acc;
-          if (typeof val === 'object') return dig(val, target);
+        if (typeof val === 'object') return dig(val, target);
-        }, undefined);
+      }, undefined);
   const digitize = n => [...`${n}`].map(i => parseInt(i));
   const distance = (x0, y0, x1, y1) => Math.hypot(x1 - x0, y1 - y0);
   const drop = (arr, n = 1) => arr.slice(n);
@@ -319,11 +319,11 @@
   const factorial = n =>
     n < 0
       ? (() => {
-          throw new TypeError('Negative numbers are not allowed!');
+        throw new TypeError('Negative numbers are not allowed!');
-        })()
+      })()
       : n <= 1
-      ? 1
+        ? 1
-      : n * factorial(n - 1);
+        : n * factorial(n - 1);
   const fibonacci = n =>
     Array.from({ length: n }).reduce(
       (acc, val, i) => acc.concat(i > 1 ? acc[i - 1] + acc[i - 2] : i),
@@ -424,10 +424,10 @@
     num === 0 || num === 24
       ? 12 + 'am'
       : num === 12
-      ? 12 + 'pm'
+        ? 12 + 'pm'
-      : num < 12
+        : num < 12
-      ? (num % 12) + 'am'
+          ? (num % 12) + 'am'
-      : (num % 12) + 'pm';
+          : (num % 12) + 'pm';
   const getScrollPosition = (el = window) => ({
     x: el.pageXOffset !== undefined ? el.pageXOffset : el.scrollLeft,
     y: el.pageYOffset !== undefined ? el.pageYOffset : el.scrollTop
@@ -660,8 +660,8 @@
         i === arr.length - 2
           ? acc + val + end
           : i === arr.length - 1
-          ? acc + val
+            ? acc + val
-          : acc + val + separator,
+            : acc + val + separator,
       ''
     );
   const JSONtoCSV = (arr, columns, delimiter = ',') =>
@@ -779,10 +779,10 @@
   const objectToQueryString = queryParameters => {
     return queryParameters
       ? Object.entries(queryParameters).reduce((queryString, [key, val], index) => {
-        const symbol = index === 0 ? '?' : '&';
+          const symbol = index === 0 ? '?' : '&';
-        queryString += typeof val === 'string' ? `${symbol}${key}=${val}` : '';
+          queryString += typeof val === 'string' ? `${symbol}${key}=${val}` : '';
-        return queryString;
+          return queryString;
-      }, '')
+        }, '')
       : '';
   };
   const observeMutations = (element, callback, options) => {
@@ -1013,9 +1013,9 @@
   const remove = (arr, func) =>
     Array.isArray(arr)
       ? arr.filter(func).reduce((acc, val) => {
-          arr.splice(arr.indexOf(val), 1);
+        arr.splice(arr.indexOf(val), 1);
-          return acc.concat(val);
+        return acc.concat(val);
-        }, [])
+      }, [])
       : [];
   const removeNonASCII = str => str.replace(/[^\x20-\x7E]/g, '');
   const renameKeys = (keysMap, obj) =>
@@ -1093,10 +1093,10 @@
     Array.isArray(val)
       ? val.length
       : val && typeof val === 'object'
-      ? val.size || val.length || Object.keys(val).length
+        ? val.size || val.length || Object.keys(val).length
-      : typeof val === 'string'
+        : typeof val === 'string'
-      ? new Blob([val]).size
+          ? new Blob([val]).size
-      : 0;
+          : 0;
   const sleep = ms => new Promise(resolve => setTimeout(resolve, ms));
   const smoothScroll = element =>
     document.querySelector(element).scrollIntoView({

gatsby-browser.js

@@ -1,29 +0,0 @@
-/**
- * Implement Gatsby's Browser APIs in this file.
- *
- * See: https://www.gatsbyjs.org/docs/browser-apis/
- */
-
-// You can delete this file if you're not using it
-
-let locationScrollTops = [];
-
-const onPreRouteUpdate = ({ location, prevLocation }) => {
-  try {
-    let scrollTop = document.querySelector('.content').scrollTop;
-    locationScrollTops[prevLocation.pathname] = scrollTop;
-  }
-  catch (e) { }
-};
-
-const onRouteUpdate = ({ location, prevLocation }) => {
-  try {
-    if (locationScrollTops[location.pathname]) {
-      document.querySelector('.content').scrollTop = locationScrollTops[location.pathname];
-    }
-  }
-  catch (e) { }
-}
-
-export { default as wrapRootElement } from './src/docs/state/ReduxWrapper';
-export { onPreRouteUpdate, onRouteUpdate };

gatsby-config.js

@@ -1,90 +0,0 @@
-const config = require('./config');
-
-module.exports = {
-  siteMetadata: {
-    title: `${config.name}`,
-    description: `${config.description}`,
-    author: `@30-seconds`,
-    siteUrl: `${config.siteUrl}`,
-  },
-  plugins: [
-    `gatsby-plugin-sitemap`,
-    {
-      resolve: `gatsby-source-filesystem`,
-      options: {
-        name: `snippets`,
-        path: `${__dirname}/${config.snippetPath}`,
-      },
-    },
-    {
-      resolve: `gatsby-source-filesystem`,
-      options: {
-        name: `snippets_archive`,
-        path: `${__dirname}/${config.snippetArchivePath}`,
-      },
-    },
-    {
-      resolve: `gatsby-source-filesystem`,
-      options: {
-        name: `snippet_data`,
-        path: `${__dirname}/${config.snippetDataPath}`,
-      },
-    },
-    {
-      resolve: `gatsby-source-filesystem`,
-      options: {
-        name: `assets`,
-        path: `${__dirname}/${config.assetPath}`,
-      },
-    },
-    {
-      resolve: `gatsby-plugin-page-creator`,
-      options: {
-        path: `${__dirname}/${config.pagePath}`,
-      },
-    },
-    {
-      resolve: `gatsby-transformer-remark`,
-      options: {
-        plugins: [
-          {
-            resolve: `gatsby-remark-images`,
-            options: {
-              maxWidth: 590,
-            },
-          },
-          `gatsby-remark-prismjs`,
-          `gatsby-remark-copy-linked-files`,
-        ],
-      },
-    },
-    `gatsby-plugin-sass`,
-    `gatsby-transformer-json`,
-    `gatsby-transformer-sharp`,
-    `gatsby-plugin-sharp`,
-    {
-      resolve: `gatsby-plugin-google-analytics`,
-      options: {
-        trackingId: `UA-117141635-1`,
-        anonymize: true, // Always set this to true, try to comply with GDPR out of the box
-        respectDNT: true, // Always set to true, be respectful of people who ask not to be tracked
-        cookieExpires: 0, // Always set to 0, minimum tracking for your users
-      },
-    },
-    {
-      resolve: `gatsby-plugin-manifest`,
-      options: {
-        name: `${config.name}`,
-        short_name: `${config.shortName}`,
-        start_url: `/`,
-        background_color: `#1e253d`,
-        theme_color: `#1e253d`,
-        display: `standalone`,
-        icon: `assets/30s-icon.png`, // This path is relative to the root of the site.
-      },
-    },
-    `gatsby-plugin-offline`,
-    `gatsby-plugin-react-helmet`,
-    `gatsby-plugin-netlify`,
-  ],
-};

gatsby-node.js

@@ -1,262 +0,0 @@
-const path = require(`path`);
-const { createFilePath } = require(`gatsby-source-filesystem`);
-const config = require('./config');
-
-const { getTextualContent, getCodeBlocks, optimizeAllNodes } = require(`./src/docs/util`);
-
-const requirables = [];
-
-config.requirables.forEach(fileName => {
-  requirables.push(require(`./snippet_data/${fileName}`));
-});
-
-const toKebabCase = str =>
-  str &&
-  str
-    .match(/[A-Z]{2,}(?=[A-Z][a-z]+[0-9]*|\b)|[A-Z]?[a-z]+[0-9]*|[A-Z]|[0-9]+/g)
-    .map(x => x.toLowerCase())
-    .join('-');
-
-exports.onCreateNode = ({ node, actions, getNode }) => {
-  const { createNodeField } = actions;
-
-  if (node.internal.type === `MarkdownRemark`) {
-    const value = createFilePath({ node, getNode });
-    createNodeField({
-      name: `slug`,
-      node,
-      value,
-    });
-  }
-};
-
-exports.sourceNodes = ({ actions, createNodeId, createContentDigest, getNodesByType }) => {
-  const { createTypes, createNode } = actions;
-  const typeDefs = `
-    type Snippet implements Node {
-      html: HtmlData
-      tags: TagData
-      title: String
-      code: CodeData
-      id: String
-      slug: String
-      path: String
-      text: TextData
-      archived: Boolean
-    }
-
-    type HtmlData @infer {
-      full: String
-      text: String
-      fullText: String
-      code: String
-      example: String
-    }
-
-    type CodeData @infer {
-      src: String
-      example: String
-    }
-
-    type TextData @infer {
-      full: String
-      short: String
-    }
-
-    type TagData @infer {
-      primary: String
-      all: [String]
-    }
-  `;
-  createTypes(typeDefs);
-
-  const markdownNodes = getNodesByType('MarkdownRemark');
-
-  const snippetNodes = requirables
-    .reduce((acc, sArr) => {
-      const archivedScope = sArr.meta.scope.indexOf('archive') !== -1;
-      return ({
-        ...acc,
-        ...sArr.data.reduce((snippets, snippet) => {
-          return ({
-            ...snippets,
-            [snippet.id]: { ...snippet, archived: archivedScope}
-          });
-        }, {})
-      });
-    }, {});
-
-  Object.entries(snippetNodes).forEach(([id, sNode]) => {
-    let mNode = markdownNodes.find(mN => mN.frontmatter.title === id);
-    let nodeContent = {
-      id,
-      tags: {
-        all: sNode.attributes.tags,
-        primary: sNode.attributes.tags[0]
-      },
-      title: mNode.frontmatter.title,
-      code: {
-        src: sNode.attributes.codeBlocks.es6,
-        example: sNode.attributes.codeBlocks.example
-      },
-      slug: mNode.fields.slug,
-      path: mNode.fileAbsolutePath,
-      text: {
-        full: sNode.attributes.text,
-        short: sNode.attributes.text.slice(0, sNode.attributes.text.indexOf('\n\n'))
-      },
-      archived: sNode.archived
-    };
-    createNode({
-      id: createNodeId(`snippet-${sNode.meta.hash}`),
-      parent: null,
-      children: [],
-      internal: {
-        type: 'Snippet',
-        content: JSON.stringify(nodeContent),
-        contentDigest: createContentDigest(nodeContent)
-      },
-      ...nodeContent
-    });
-  });
-
-};
-
-exports.createResolvers = ({ createResolvers }) => createResolvers({
-  Snippet: {
-    html: {
-      resolve: async (source, _, context, info) => {
-        const resolver = info.schema.getType("MarkdownRemark").getFields()["html"].resolve;
-        const node = await context.nodeModel.nodeStore.getNodesByType('MarkdownRemark').filter(v => v.frontmatter.title === source.title)[0];
-        const args = {}; // arguments passed to the resolver
-        const html = await resolver(node, args);
-        return {
-          full: `${html}`,
-          text: `${getTextualContent(html, true)}`,
-          fullText: `${getTextualContent(html, false)}`,
-          code: `${optimizeAllNodes(getCodeBlocks(html).code)}`,
-          example: `${optimizeAllNodes(getCodeBlocks(html).example)}`
-        };
-      }
-    }
-  }
-});
-
-exports.createPages = ({ graphql, actions }) => {
-  const { createPage } = actions;
-
-  const snippetPage = path.resolve(`./src/docs/templates/SnippetPage.js`);
-  const tagPage = path.resolve(`./src/docs/templates/TagPage.js`);
-
-  return graphql(
-    `
-      {
-        allSnippet(sort: {fields: id}) {
-          edges {
-            node {
-              id
-              slug
-              tags {
-                all
-                primary
-              }
-              text {
-                full
-                short
-              }
-              title
-              html {
-                code
-                example
-                full
-                text
-                fullText
-              }
-              code {
-                src
-                example
-              }
-              archived
-            }
-          }
-        }
-      }
-    `,
-  ).then(result => {
-    if (result.errors) {
-      throw result.errors;
-    }
-
-    // Create individual snippet pages.
-    const snippets = result.data.allSnippet.edges;
-
-    snippets.forEach(snippet => {
-      if (!snippet.node.archived) {
-        createPage({
-          path: `/snippet${snippet.node.slug}`,
-          component: snippetPage,
-          context: {
-            snippet: snippet.node
-          }
-        });
-      } else {
-        createPage({
-          path: `/archive${snippet.node.slug}`,
-          component: snippetPage,
-          context: {
-            snippet: snippet.node
-          }
-        });
-      }
-    });
-
-    // Create tag pages.
-    const tags = [...new Set(
-      snippets.map(snippet => (snippet.node.tags || {primary: null}).primary)
-    )]
-      .filter(Boolean)
-      .sort((a, b) => a.localeCompare(b));
-    
-    tags.forEach(tag => {
-      const tagPath = `/tag/${toKebabCase(tag)}/`;
-      const taggedSnippets = snippets
-        .filter(snippet => snippet.node.tags.primary === tag)
-        .filter(snippet => !snippet.node.archived)
-        .map(({node}) => ({
-          title: node.title,
-          html: node.html.text,
-          tags: node.tags.all,
-          id: node.slug.slice(1)
-        }));
-      createPage({
-        path: tagPath,
-        component: tagPage,
-        context: {
-          tag,
-          snippets: taggedSnippets
-        },
-      });
-    });
-
-    const beginnerSnippets = snippets
-      .filter(({ node }) => node.tags.all.includes('beginner'))
-      .filter(snippet => !snippet.node.archived)
-      .map(({ node }) => ({
-        title: node.title,
-        html: node.html.text,
-        tags: node.tags.all,
-        id: node.slug.slice(1)
-      }));
-
-    createPage({
-      path: `/beginner`,
-      component: tagPage,
-      context: {
-        tag: `beginner snippets`,
-        snippets: beginnerSnippets
-      },
-    });
-
-    return null;
-  });
-};

gatsby-ssr.js

@@ -1,8 +0,0 @@
-/**
- * Implement Gatsby's SSR (Server Side Rendering) APIs in this file.
- *
- * See: https://www.gatsbyjs.org/docs/ssr-apis/
- */
-
-// You can delete this file if you're not using it
-export { default as wrapRootElement } from './src/docs/state/ReduxWrapper';

glossary/AJAX.md

@@ -1,6 +0,0 @@
----
-title: AJAX
-tags: AJAX
----
-
-Asynchronous JavaScript and XML (known as AJAX) is a term that describes a new approach to using multiple technologies together in order to enable web applications to make quick updates to the user interface without reloading the entire browser page.

glossary/API.md

@@ -1,7 +0,0 @@
----
-title: API
-tags: API
----
-
-API stands for Application Programming Interface and is a set of features and rules provided by a provided by a software to enable third-party software to interact with it.
-The code features of a web API usually include methods, properties, events or URLs.

glossary/Argument.md

@@ -1,7 +0,0 @@
----
-title: Argument
-tags: Argument
----
-
-An argument is a value passed as an input to a function and can be either a primitive or an object.
-In JavaScript, functions can also be passed as arguments to other functions.

glossary/Array.md

@@ -1,8 +0,0 @@
----
-title: Array
-tags: Array
----
-
-Arrays are used to store multiple values in a single variable.
-Arrays are ordered and each item in an array has a numeric index associated with it.
-JavaScript arrays are zero-indexed, meaning the first element's index is 0.

glossary/Asynchronous-programming.md

@@ -1,7 +0,0 @@
----
-title: Asynchronous programming
-tags: Asynchronous programming
----
-
-Asynchronous programming is a way to allow multiple events to trigger code without waiting for each other.
-The main benefits of asynchronous programming are improved application performance and responsiveness.

glossary/Automatic-semicolon-insertion.md

@@ -1,6 +0,0 @@
----
-title: Automatic semicolon insertion
-tags: Automatic semicolon insertion
----
-
-Automatic semicolon insertion (ASI) is a JavaScript feature that allows developers to omit semicolons in their code.

glossary/Boolean.md

@@ -1,7 +0,0 @@
----
-title: Boolean
-tags: Boolean
----
-
-Booleans are one of the primitive data types in JavaScript. 
-They represent logical data values and can only be `true` or `false`.

glossary/CORS.md

@@ -1,6 +0,0 @@
----
-title: CORS
-tags: CORS
----
-
-Cross-Origin Resource Sharing (known as CORS) is a mechanism that uses extra HTTP headers to tell a browser to let a web application running at one domain have permission to access resources from a server at a different domain.

glossary/CSS.md

@@ -1,7 +0,0 @@
----
-title: CSS
-tags: CSS
----
-
-CSS stands for Cascading Style Sheets and is a language used to style web pages.
-CSS documents are plaintext documents structured with rules, which consist of element selectors and property-value pairs that apply the styles to the specified selectors.

glossary/CSV.md

@@ -1,8 +0,0 @@
----
-title: CSV
-tags: CSV
----
-
-CSV stands for Comma-Separated Values and is a storage format for tabular data.
-CSV documents are plaintext documents where each line represents a table row, with table columns separated by commas or some other delimiter (e.g. semicolons).
-The first line of a CSV document sometimes consists of the table column headings for the data to follow.

glossary/Callback.md

@@ -1,7 +0,0 @@
----
-title: Callback
-tags: Callback
----
-
-A callback function, also known as a high-order function, is a function that is passed into another function as an argument, which is then executed inside the outer function.
-Callbacks can be synchronous or asynchronous.

glossary/Character-encoding.md

@@ -1,7 +0,0 @@
----
-title: Character encoding
-tags: Character encoding
----
-
-A character encoding defines a mapping between bytes and text, specifying how the sequenece of bytes should be interpreted.
-Two commonly used character encodings are ASCII and UTF-8.

glossary/Class.md

@@ -1,6 +0,0 @@
----
-title: Class
-tags: Class
----
-
-In object-oriented programming, a class is a template definition of an object's properties and methods.

glossary/Closure.md

@@ -1,7 +0,0 @@
----
-title: Closure
-tags: Closure
----
-
-A closure is the combination of a function and the lexical environment within which that function was declared.
-The closure allows a function to access the contents of that environment.

glossary/CoffeeScript.md

@@ -1,6 +0,0 @@
----
-title: CoffeeScript
-tags: CoffeeScript
----
-
-CoffeeScript is a programming language inspired by Ruby, Python and Haskell that transpiles to JavaScript.

glossary/Constant.md

@@ -1,7 +0,0 @@
----
-title: Constant
-tags: Constant
----
-
-A constant is a value, associated with an identifier.
-The value of a constant can be accessed using the identifier and cannot be altered during execution.

glossary/Constructor.md

@@ -1,7 +0,0 @@
----
-title: Constructor
-tags: Constructor
----
-
-In class-based object-oriented programming, a constructor is a special type of function called to instantiate an object.
-Constructors often accept arguments that are commonly used to set member properties.

glossary/Continuous-Deployment.md

@@ -1,7 +0,0 @@
----
-title: Continuous Deployment
-tags: Continuous Deployment
----
-
-Continuous Deployment follows the testing that happens during Continuous Integration and pushes changes to a staging or production system. 
-Continuous Deployment ensures that a version of the codebase is accessible at all times.

glossary/Continuous-Integration.md

@@ -1,7 +0,0 @@
----
-title: Continuous Integration
-tags: Continuous Integration
----
-
-Continuous Integration (CI) is the practice of testing each change done to a codebase automatically and as early as possible.
-Two popular CI systems that integrate with GitHub are Travis CI and Circle CI.

glossary/Cross-site-scripting-xss.md

@@ -1,7 +0,0 @@
----
-title: Cross-site scripting (XSS)
-tags: Cross-site scripting (XSS)
----
-
-XSS refers to client-side code injection where the attacker injects malicious scripts into a legitimate website or web application. 
-This is often achieved when the application does not validate user input and freely injects dynamic HTML content.

glossary/Currying.md

@@ -1,7 +0,0 @@
----
-title: Currying
-tags: Currying
----
-
-Currying is a way of constructing functions that allows partial application of a function's arguments.
-Practically, this means that a function is broken down into a series of functions, each one accepting part of the arguments.

glossary/DNS.md

@@ -1,6 +0,0 @@
----
-title: DNS
-tags: DNS
----
-
-A DNS (Domain Name System) translates domain names to the IP addresses needed to find a particular computer service on a network.

glossary/DOM.md

@@ -1,8 +0,0 @@
----
-title: DOM
-tags: DOM
----
-
-The DOM (Document Object Model) is a cross-platform API that treats HTML and XML documents as a tree structure consisting of nodes. 
-These nodes (such as elements and text nodes) are objects that can be programmatically manipulated and any visible changes made to them are reflected live in the document. 
-In a browser, this API is available to JavaScript where DOM nodes can be manipulated to change their styles, contents, placement in the document, or interacted with through event listeners.

glossary/Deserialization.md

@@ -1,7 +0,0 @@
----
-title: Deserialization
-tags: Deserialization
----
-
-Deserialization is the process of converting a format that has been transferred over a network and/or used for storage to an object or data structure.
-A common type of deserialization in JavaScript is the conversion of JSON string into an object.

glossary/Domain-name-registrar.md

@@ -1,7 +0,0 @@
----
-title: Domain name registrar
-tags: Domain name registrar
----
-
-A domain name registrar is a company that manages the reservation of internet domain names.
-A domain name registrar must be approved by a general top-level domain (gTLD) registry or a country code top-level domain (ccTLD) registry.

glossary/Domain-name.md

@@ -1,7 +0,0 @@
----
-title: Domain name
-tags: Domain name
----
-
-A domain name is a website's address on the Internet, used primarily in URLs to identify the server for each webpage.
-A domain name consists of a hierarchical sequence of names, separated by dots and ending with an extension.

glossary/ES6.md

@@ -1,7 +0,0 @@
----
-title: ES6
-tags: ES6
----
-
-ES6 stands for ECMAScript 6 (also known as ECMAScript 2015), a version of the ECMAScript specification that standardizes JavaScript.
-ES6 adds a wide variety of new features to the specification, such as classes, promises, generators and arrow functions.

glossary/Element.md

@@ -1,7 +0,0 @@
----
-title: Element
-tags: Element
----
-
-A JavaScript representation of a DOM element commonly returned by `document.querySelector()` and `document.createElement()`. 
-They are used when creating content with JavaScript for display in the DOM that needs to be programatically generated.

glossary/Event-driven-programming.md

@@ -1,7 +0,0 @@
----
-title: Event-driven programming
-tags: Event-driven programming
----
-
-Event-driven programming is a programming paradigm in which the flow of the program is determined by events (e.g. user actions, thread messages, sensor outputs).
-In event-driven applications, there is usually a main loop that listens for events and trigger callback functions accordingly when one of these events is detected.

glossary/Event-loop.md

@@ -1,8 +0,0 @@
----
-title: Event loop
-tags: Event loop
----
-
-The event loop handles all asynchronous callbacks. 
-Callbacks are queued in a loop, while other code runs, and will run one by one when the response for each one has been received.
-The event loop allows JavaScript to perform non-blocking I/O operations, despite the fact that JavaScript is single-threaded.

glossary/Express.md

@@ -1,7 +0,0 @@
----
-title: Express
-tags: Express
----
-
-Express is a backend framework, that provides a layer of fundamental web application features for Node.js.
-Some of its key features are routing, middleware, template engines and error handling.

glossary/Factory-functions.md

@@ -1,7 +0,0 @@
----
-title: Factory functions
-tags: Factory functions
----
-
-In JavaScript, a factory function is any function, which is not a class or constructor, that returns a new object.
-Factory functions don't require the use of the `new` keyword.

glossary/First-class-function.md

@@ -1,6 +0,0 @@
----
-title: First-class function
-tags: First-class function
----
-
-A programming language is said to have first-class functions if it treats them as first-class citizens, meaning they can be passed as arguments, be returned as values from other functions, be assigned to variables and stored in data structures.

glossary/Flexbox.md

@@ -1,6 +0,0 @@
----
-title: Flexbox
-tags: Flexbox
----
-
-Flexbox is a one-dimensional layout model used to style websites as a property that could advance space distribution between items and provide powerful alignment capabilities.

glossary/Function.md

@@ -1,8 +0,0 @@
----
-title: Function
-tags: Function
----
-
-Functions are self-contained blocks of code with their own scope, that can be called by other code and are usually associated with a unique identifier.
-Functions accept input in the form of arguments and can optionally return an output (if no `return` statement is present, the default value of `undefined` will be returned instead). 
-JavaScript functions are also objects.

glossary/Functional-programming.md

@@ -1,7 +0,0 @@
----
-title: Functional programming
-tags: Functional programming
----
-
-Functional programming is a paradigm in which programs are built in a declarative manner using pure functions that avoid shared state and mutable data. 
-Functions that always return the same value for the same input and don't produce side effects are the pillar of functional programming.

glossary/Functor.md

@@ -1,8 +0,0 @@
----
-title: Functor
-tags: Functor
----
-
-A Functor is a data type common in functional programming that implements a `map` method. 
-The `map` method takes a function and applies it to the data in the Functor, returning a new instance of the Functor with the result.
-JavaScript `Array`s are an example of the Functor data type.

glossary/Garbage-collection.md

@@ -1,7 +0,0 @@
----
-title: Garbage collection
-tags: Garbage collection
----
-
-Garbage collection is a form of automatic memory management.
-It attempts to reclaim memory occupied by objects that are no longer used by the program.

glossary/Git.md

@@ -1,7 +0,0 @@
----
-title: Git
-tags: Git
----
-
-Git is an open-source version control system, used for source code management.
-Git allows users to copy (clone) and edit code on their local machines, before merging it into the main code base (master repository).

glossary/HTML.md

@@ -1,7 +0,0 @@
----
-title: HTML
-tags: HTML
----
-
-HTML stands for HyperText Markup Language and is a language used to structure web pages.
-HTML documents are plaintext documents structured with elements, which are surrounded by `<>` tags and optionally extended with attributes.

glossary/HTTP-and-HTTPS.md

@@ -1,7 +0,0 @@
----
-title: HTTP and HTTPS
-tags: HTTP and HTTPS
----
-
-The HyperText Transfer Protocol (HTTP) is the underlying network protocol that enables transfer of hypermedia documents on the Web, usually between a client and a server.
-The HyperText Transfer Protocol Secure (HTTPS) is an encrypted version of the HTTP protocol, that uses SSL to encrypt all data transferred between a client and a server.

glossary/Higher-order-function.md

@@ -1,6 +0,0 @@
----
-title: Higher-order function
-tags: Higher-order function
----
-
-Higher-order functions are functions that either take other functions as arguments, return a function as a result, or both.

glossary/Hoisting.md

@@ -1,7 +0,0 @@
----
-title: Hoisting
-tags: Hoisting
----
-
-Hoisting is JavaScript's default behavior of adding declarations to memory during the compile phase.
-Hoisting allows for JavaScript variables to be used before the line they were declared on.

glossary/IP.md

@@ -1,7 +0,0 @@
----
-title: IP
-tags: IP
----
-
-An IP address is a number assigned to a device connected to a network that uses the Internet protocol.
-Two IP versions are currently in use - IPv4, the older version of the communication protocol (e.g. 192.168.1.100) and IPv6, the newest version of the communication protocol which allows for many different IP addresses (e.g. 0:0:0:0:ffff:c0a8:164).

glossary/Integer.md

@@ -1,7 +0,0 @@
----
-title: Integer
-tags: Integer
----
-
-Integers are one of the primitive data types in Javascript.
-They represent a numerical value that has no fractional component.

glossary/Integration-testing.md

@@ -1,7 +0,0 @@
----
-title: Integration testing
-tags: Integration testing
----
-
-Integration testing is a type of software testing, used to test groups of units/components of a software.
-The purpose of integration tests are to validate that the units/components interact with each other as expected.

glossary/JSON.md

@@ -1,7 +0,0 @@
----
-title: JSON
-tags: JSON
----
-
-JSON (JavaScript Object Notation) is a format for storing and exchanging data.
-It closely resembles the JavaScript object syntax, however some data types, such as dates and functions, cannot be natively represented and need to be serialized first.

glossary/MDN.md

@@ -1,6 +0,0 @@
----
-title: MDN
-tags: MDN
----
-
-MDN Web Docs, formerly known as Mozilla Developer Network, is the official Mozilla website for development documentation of web standards and Mozilla projects.

glossary/MVC.md

@@ -1,7 +0,0 @@
----
-title: MVC
-tags: MVC
----
-
-MVC stands for Model-View-Controller and is a software design pattern, emphasizing separation of concerns (logic and display).
-The Model part of the MVC pattern refers to the data and business logic, the View handles the layout and display, while the Controller routes commands to the model and view parts. 

glossary/Module.md

@@ -1,7 +0,0 @@
----
-title: Module
-tags: Module
----
-
-Modules are independent, self-contained pieces of code that can be incorporated into other pieces of code.
-Modules improve maintainability and reusability of the code.

glossary/MongoDB.md

@@ -1,6 +0,0 @@
----
-title: MongoDB
-tags: MongoDB
----
-
-MongoDB is a NoSQL database model that stores data in flexible, JSON-like documents, meaning fields can vary from document to document and data structure can be changed over time

glossary/Mutabe-value.md

@@ -1,8 +0,0 @@
----
-title: Mutable value
-tags: Mutable value
----
-
-Mutable value is a type of variable that can be changed once created.
-Objects are mutable as their state can be modified after they are created.
-Primitive values are not mutable as we perform reassignment once we change them.

glossary/NoSQL.md

@@ -1,6 +0,0 @@
----
-title: NoSQL
-tags: NoSQL
----
-
-NoSQL databases provide a mechanism to create, update, retrieve and calculate data that is stored in models that are non-tabular.

glossary/Node-js.md

@@ -1,7 +0,0 @@
----
-title: Node.js
-tags: Node.js
----
-
-Node.js is a JavaScript runtime built on Chrome's V8 JavaScript engine.
-Node.js can execute JavaScript code outside of the browser and can be used to develop web backends or standalone applications.

glossary/Npm.md

@@ -1,7 +0,0 @@
----
-title: Npm
-tags: Npm
----
-
-Npm is a package manager for the JavaScript programming language and the default package manager for Node.js.
-It consists of a command-line client and the npm registry, an online database of packages.

glossary/Object-oriented-programming.md

@@ -1,7 +0,0 @@
----
-title: Object-oriented programming
-tags: Object-oriented programming
----
-
-Object-oriented programming (OOP) is a programming paradigm based on the concept of objects, which may contain both data and procedures which can be use to operate on them.
-JavaScript supports Object-oriented programming both via prototypes and classes.

glossary/Object.md

@@ -1,8 +0,0 @@
----
-title: Object
-tags: Object
----
-
-Objects are data structures that contain data and instructions for working with the data.
-Objects consist of key-value pairs, where the keys are alphanumeric identifiers and the values can either be primitives or objects.
-JavaScript functions are also objects.

glossary/PWA.md

@@ -1,6 +0,0 @@
----
-title: PWA
-tags: PWA
----
-
-Progressive Web App (known as PWA) is a term used to describe web applications that load like regular websites but can offer the user functionality such as working offline, push notifications, and device hardware access that were traditionally available only to native mobile applications.

glossary/Prepared-statements.md

@@ -1,7 +0,0 @@
----
-title: Prepared statements
-tags: Prepared statements
----
-
-In databases management systems, prepared statements are templates that can be used to execute queries with the provided values substituting the template's parameters.
-Prepared statements offer many benefits, such as reusability, maintainability and higher security.

glossary/Promise.md

@@ -1,7 +0,0 @@
----
-title: Promise
-tags: Promise
----
-
-The Promise object represents the eventual completion (or failure) of an asynchronous operation, and its resulting value.
-A Promise can be in one of these states: pending(initial state, neither fulfilled nor rejected), fulfilled(operation completed successfully), rejected(operation failed).

glossary/Prototype-based-programming.md

@@ -1,7 +0,0 @@
----
-title: Prototype-based programming
-tags: Prototype-based programming
----
-
-Prototype-based programming is a style of object-oriented programming, where inheritance is based on object delegation, reusing objects that serve as prototypes.
-Prototype-based programming allows the creation of objects before defining their classes.

glossary/Pseudo-class.md

@@ -1,6 +0,0 @@
----
-title: Pseudo-class
-tags: Pseudo-class
----
-
-In CSS, a pseudo-class is used to define a special state of an element and can be used as a selector in combination with an id, element or class selector.

glossary/Pseudo-element.md

@@ -1,6 +0,0 @@
----
-title: Pseudo-element
-tags: Pseudo-element
----
-
-In CSS, a pseudo-element is used to style specific parts of an element and can be used as a selector in combination with an id, element or class selector.