The search bar should support typeahead, so that when you start typing "sq" a dropdown shows you relevant search results with each new keystroke, like "sql" and "sql insert", which you can click on to navigate directly to the article.

This should also support basic keyboard interaction: the up and down arrow keys to select a result, the enter key to open selected result, and escape to dismiss suggested results.

We should show the titles of up to 8 matching results (they needn't be capitalized).

Here's what Facebook's look like:

Nothing fancy - just fast and functional :)

Currently, Gatsby sorts the guide pages by their position in the src/pages directory. The way we currently have the directory structured, all of your paths are prefixed with articles, because we have all of our pages in an articles directory.

When released in the wild, this guide will be found at guide.freecodecamp.org/ and the way things are, navigation around our site would be guide.freecodecamp.org/articles/<some-category>/<some-article>.

We would like to have URLs like guide.freecodecamp.org/<some-category>/<some-article>, removing the articles path level.

For this to be accomplished, all articles need to be removed from articles and placed into src/pages/. _normaliseAriticles and createNavData will need to be refactored to remove the dependency on the articles dir.

The CI builds are taking on an average of 30 mins.
This is creating a trickle-down effect on all other repositories under the org as well.

Do we really need so many config types i.e: 2 OS-types X 3 Node Env = 6 separate configs?
Considering these are C++ builds it's adding even more to the workload on the builds.

Adjust titleify found here so that if a stop word (the, of a...) is at the beginning of the string, it must be capitalised.

After running yarn install and running yarn run dev I am getting this in the terminal:
Is it with me or everyone else:

yarn run v0.27.5
$ node seed && gatsby develop
/home/invinciblycool/FCC/guides/node_modules/rx/dist/rx.js:77
    throw e;
    ^

Error: Error: ENOTDIR: not a directory, scandir '/home/invinciblycool/FCC/guides/src/pages/articles/sql/sql-alter-table/'
    at AnonymousObserver.listAllDirs.toArray.subscribe.err [as _onError] (/home/invinciblycool/FCC/guides/seed/_createNavData.js:50:15)
    at AnonymousObserver.Rx.AnonymousObserver.AnonymousObserver.error (/home/invinciblycool/FCC/guides/node_modules/rx/dist/rx.js:1836:12)
    at AnonymousObserver.Rx.internals.AbstractObserver.AbstractObserver.onError (/home/invinciblycool/FCC/guides/node_modules/rx/dist/rx.js:1772:14)
    at AnonymousObserver.tryCatcher (/home/invinciblycool/FCC/guides/node_modules/rx/dist/rx.js:63:31)
    at AutoDetachObserverPrototype.error (/home/invinciblycool/FCC/guides/node_modules/rx/dist/rx.js:5891:52)
    at AutoDetachObserver.Rx.internals.AbstractObserver.AbstractObserver.onError (/home/invinciblycool/FCC/guides/node_modules/rx/dist/rx.js:1772:14)
    at InnerObserver.error (/home/invinciblycool/FCC/guides/node_modules/rx/dist/rx.js:2501:59)
    at InnerObserver.Rx.internals.AbstractObserver.AbstractObserver.onError (/home/invinciblycool/FCC/guides/node_modules/rx/dist/rx.js:1772:14)
    at InnerObserver.tryCatcher (/home/invinciblycool/FCC/guides/node_modules/rx/dist/rx.js:63:31)
    at AutoDetachObserverPrototype.error (/home/invinciblycool/FCC/guides/node_modules/rx/dist/rx.js:5891:52)
error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.

A lot of the folders are currently capitalized. We should probably lowercase these.

I noticed that on Amazon, all search results in their autocomplete are lowercase - even for proper nouns. I think we could do the same.

The only place where capitalization might be important outside of the individual article itself is in the side navigation. So we may need to figure out a way to make this happen.

If we can't figure this out, we may just want to leave the side navigation all lowercase for now.

When running the development version of guides (npm run dev) I see a warning message that states:

Warning: Accessing factories like React.DOM.style has been deprecated and will be removed in v16.0+. Use the react-dom-factories package instead. Version 1.0 provides a drop-in replacement. For more info, see https://fb.me/react-dom-factories

I'm not sure what needs to be done to correct this warning however it's a matter of concern I figured I would bring up.

function titleify() {} found in this file should account for SQL keywords like COUNT, AND, AVG, INSERT, WHERE and so on.

I envisage titleify checking if the title contains the word sql, where is will then call another function to deal with SQL keywords.

Perhaps @SteveChevalier or @vanessasena could provide a list of keywords as a reference?

We should replace the current font on the guide articles with Lato so it's consistent with the rest of the text on freeCodeCamp. We should also bump the font size up to at least 14px.

@QuincyLarson for some reason, Travis is still not turned on for this repo.

The longer build times have helped with regards to more pages.

During the netlify build, we now have webpack running out of memory

This is the log from #74 which adds a load of javascript standard objects methods

11:12:09 AM: Build started
11:12:10 AM: Fetching cached dependencies
11:12:10 AM: Starting to download cache of 163.8MB
11:12:11 AM: Finished downloading cache in 1.32342502s
11:12:20 AM: Preparing Git Reference pull/74/head
11:12:23 AM: Running build command: npm run build
11:12:26 AM: v6.11.1 is already installed.
11:12:27 AM: Now using node v6.11.1 (npm v3.10.10)
11:12:27 AM: Using version v6.11.1 of node
11:12:27 AM: Using /opt/buildhome/.rvm/gems/ruby-2.1.2
11:12:28 AM: Installing NPM modules using Yarn version 0.18.1
11:12:29 AM: yarn install v0.18.1
11:12:29 AM: [1/4] Resolving packages...
11:12:30 AM: success Already up-to-date.
11:12:31 AM: Done in 1.49s.
11:12:31 AM: NPM modules installed using Yarn
11:12:31 AM: > [email protected] build /opt/build/repo> node seed && gatsby build
11:12:32 AM: navData createdIt took 296ms to create the nav data for 2396 pages
11:12:33 AM: success open and validate gatsby-config.js — 0.006 s
11:12:33 AM: success copy gatsby files — 0.030 s
11:13:06 AM: success source and transform nodes — 32.838 s
11:13:09 AM: success building schema — 2.695 s
11:13:29 AM: success createPages — 20.125 s
11:13:32 AM: success createPagesStatefully — 2.644 s
11:13:32 AM: success extract queries from components — 0.305 s
11:14:34 AM: success run graphql queries — 62.399 s
11:14:34 AM: success write out page data — 0.149 s
11:15:12 AM: success update schema — 37.498 s
11:15:12 AM: 
11:15:12 AM: bootstrap finished, time since started: 160.132 s
11:15:12 AM: Generating CSS
11:15:26 AM: Compiling production bundle.js
11:15:27 AM: [BABEL] Note: The code generator has deoptimised the styling of "/opt/build/repo/.cache/async-requires.js" as it exceeds the max of "500KB".
11:17:16 AM: Generating static HTML for pages
11:22:50 AM: FATAL ERROR: CALL_AND_RETRY_LAST Allocation failed - JavaScript heap out of memory
11:22:51 AM: <--- Last few GCs --->  617558 ms: Mark-sweep 1386.7 (1419.2) -> 1386.7 (1425.2) MB, 301.6 / 0.0 ms [allocation failure] [GC in old space requested].  617855 ms: Mark-sweep 1386.7 (1425.2) -> 1386.7 (1425.2) MB, 297.1 / 0.0 ms [allocation failure] [GC in old space requested].  618161 ms: Mark-sweep 1386.7 (1425.2) -> 1390.7 (1419.2) MB, 305.6 / 0.0 ms [last resort gc].  618466 ms: Mark-sweep 1390.7 (1419.2) -> 1394.7 (1419.2) MB, 304.5 / 0.0 ms [last resort gc].<--- JS stacktrace --->==== JS stack trace =========================================    2: arguments adaptor frame: 2->3Security context: 0x1fb5a053fa99 <JS Object>    3: renderButton [render-page.js:107034] [pc=0x1071ddef60ed] (this=0x1d3a922ce9a9 <a Button with map 0xe57f392b031>,_ref=0x1d3a922cd191 <an Object with map 0xe57f392b089>,className=0x1d3a922cd4a1 <String[15]: btn btn-default>)    4: render [render-page.js:107062] [pc=0x1071ddef5599] (this=0x1d3a922ce9a9 <a Button with map 0xe57f392b031>)    5: _renderVa...
11:22:51 AM:  1:
11:22:51 AM: node::Abort() [node] 2:
11:22:51 AM: 0x109bf8c [node] 3:
11:22:51 AM: v8::Utils::ReportApiFailure(char const*, char const*) [node] 4:
11:22:51 AM: Build complete: exit code: 1
11:22:51 AM: v8::internal::V8::FatalProcessOutOfMemory(char const*, bool) [node] 5:
11:22:51 AM: Cleaning up docker container
11:22:51 AM: v8::internal::Factory::NewCode(v8::internal::CodeDesc const&, unsigned int, v8::internal::Handle<v8::internal::Object>, bool, bool, int, bool) [node] 6:
11:22:51 AM: v8::internal::CodeGenerator::MakeCodeEpilogue(v8::internal::MacroAssembler*, v8::internal::CompilationInfo*) [node] 7:
11:22:51 AM: Error running command: Build script returned non-zero exit code: 1
11:22:51 AM: v8::internal::FullCodeGenerator::MakeCode(v8::internal::CompilationInfo*) [node] 8:
11:22:51 AM: 0xb4c51e [node] 9:
11:22:51 AM: 0xb4e900 [node]10:
11:22:51 AM: 0xb55fc6 [node]11:
11:22:51 AM: v8::internal::Compiler::Compile(v8::internal::Handle<v8::internal::JSFunction>, v8::internal::Compiler::ClearExceptionFlag) [node]12:
11:22:51 AM: An error occurred while building the site, skipping the deploy and cache refresh.
11:22:51 AM: v8::internal::Runtime_CompileLazy(int, v8::internal::Object**, v8::internal::Isolate*) [node]13: 0x1071d81060c7
11:22:51 AM: Aborted (core dumped)
11:22:51 AM: 
11:22:51 AM: npm
11:22:52 AM:  ERR!
11:22:52 AM: Build script returned non-zero exit code: 1
11:22:52 AM:  Linux 3.19.0-66-generic
11:22:52 AM: npm
11:22:52 AM: ERR!
11:22:52 AM: 
11:22:52 AM: argv
11:22:52 AM:  "/opt/buildhome/.nvm/versions/node/v6.11.1/bin/node" "/opt/buildhome/.nvm/versions/node/v6.11.1/bin/npm" "run" "build"
11:22:52 AM: npm
11:22:52 AM: ERR!
11:22:52 AM: node v6.11.1
11:22:52 AM: npm ERR!
11:22:52 AM:  npm
11:22:52 AM:  v3.10.10
11:22:52 AM: npm ERR!
11:22:52 AM: code ELIFECYCLE
11:22:52 AM: npm
11:22:52 AM: ERR!
11:22:52 AM:  [email protected] build: `node seed && gatsby build`npm ERR!
11:22:52 AM:  Exit status 134npm
11:22:53 AM:  ERR!
11:22:53 AM:  npm
11:22:53 AM: ERR!
11:22:53 AM:  Failed at the [email protected] build script 'node seed && gatsby build'.npm
11:22:53 AM:  ERR! Make sure you have the latest version of node.js and npm installed.
11:22:53 AM: npm ERR!
11:22:53 AM:  If you do, this is most likely a problem with the freecodecamp-guide package,npm ERR!
11:22:53 AM:  not with npm itself.
11:22:53 AM: npm
11:22:53 AM: ERR!
11:22:53 AM:  Tell the author that this fails on your system:npm ERR!
11:22:53 AM:      node seed && gatsby buildnpm
11:22:53 AM:  ERR!
11:22:53 AM:  You can get information on how to open an issue for this project with:npm ERR!
11:22:53 AM:      npm bugs freecodecamp-guidenpm
11:22:53 AM:  ERR!
11:22:53 AM:  Or if that isn't available, you can get their info via:npm ERR!
11:22:53 AM:      npm owner ls freecodecamp-guidenpm
11:22:53 AM: Finished processing build request in 10m43.814809973s
11:22:53 AM: ERR! There is likely additional logging output above.
11:22:53 AM: 
11:22:54 AM: npm
11:22:54 AM: 
11:22:54 AM: ERR! Please include the following file with any support request:npm
11:22:54 AM:  ERR!     /opt/build/repo/npm-debug.log
11:22:54 AM: Cached NPM modules
11:22:54 AM: Saved Yarn cache
11:22:54 AM: Saved Cache Directory

We resolved this before by moving to gatsby V1, I am going to upgrade to the latest gatsby tonight to see if it helps, but I fear this is going to be an ongoing issue as the site grows.

We currently have ~2400 individual pages

Ideas/advice @BerkeleyTrue @QuincyLarson @KyleAMathews

DevDocs has exceptional side navigation accordion design, and I think we should follow their example.

Basically:

• clicking on a topic should
  1. toggle the carrot from a chevron right symbol to a chevron down symbol
  2. expand to show that topic's children articles
  3. show that topic's index.md content in the article view pane
• clicking the topic a second time should collapse it
• the topics should use a finger on-hover
• the side navigation pane should scroll independently of the article
• All navigation items should be the same font size and color, and we should instead use left-indention to visually indicate that one item is a child of another
• We can optionally add a number to the right-hand side indicating the number of articles.
• If possible, we should indicate that an article is a stub in the navigation to save people disappointment of clicking on it - perhaps by lightening its text-color.
• We can consider the use Font Awesome or a similar icon library to put icons the the left of top-level topics

We can then also use this same CSS for the updated challenge map at beta.freecodecamp.com/map

CC @BerkeleyTrue

All "re-canonical" meta tags should point to https://www.freecodecamp.org/guide/[article-specific-path]

The navbar should be 40px tall, which is what we're planning to use throughout freecodecamp.org. The logo and search box should be vertically centered within the nav bar.

UNHANDLED REJECTION TypeError: Cannot read property 'internal' of undefined

Use npm module object-assign instead.

the module can be found here

A discussion in the CT suggested the potential of associating audio content to the guides.

This thread opens a discussion about the desirability and feasibility of this proposition and if approved then start designing the corresponding road map.

@QuincyLarson @Bouncey @raisedadead @dhcodes

Sometimes while running the repo locally, it gets stuck at the point where it reads Bootstrap finished.

Create a good index.md file for the root directory (that shows when you navigate to Guides directly.

This file should be situated in src/pages/ .

The dev npm script does not work on Windows. It directly refers to ./node_modules/.bin/gatsby, which is a bash file. It does not run on Windows. If I change it to the .cmd version, it tries to run it as if it's a Javascript file, so it fails too.

I noticed that the all that the bash file does. I'm wondering whether the extra available memory transfers to that process. @Bouncey Have you seen that this was working?

I have a couple of ideas on how we could potentially fix this.

1. Instead of referencing the bin file, we could reference the js file that the bin file references directly.
2. We could have one script that runs gatsby normally, then another script that runs that script with more memory available. I'm not sure if this would work.

"dev-low-memory": "gatsby develop",
"dev": "npm run dev-low-memory -- --max_old_space_size=7168"

3. We could try creating a node script that runs Gatsby as a child process, and create an npm script that runs that node script with more available memory. Again, I'm not sure if this would work.

I cloned the repo and did everything with npm and lerna bootstrap kept on failing when it came across any jsx. I tried removing the postinstall script that triggered lerna but now gatsby wouldn't build the site. I updated to [email protected] and it tripped up at

ERROR in ./.cache/dev-404-page.js
Module not found: Error: Cannot resolve module 'gatsby-link' in /home/stuart/guides/.cache
 @ ./.cache/dev-404-page.js 15:18-40

Issue

Guide sidebar feels unresponsive. It's not obvious that it's clickable. For instance, I tried to click audio, which currently has no sub-pages, and thus did not expand. I thought my click didn't register. (It did.)

Solution

Add cursor:pointer on hover.

Here is a checklist of things I propose we do before announcing guides:

• Remove the articles directory #147 PR #242

• Create a good index.md file for the root article directory (that shows when you navigate to Guides directly, this should be situated in src/pages/ #148

• Make sure search works properly

• Set up a redirect in NGINX to guide.freecodecamp.org to guide.netlify.com

• HTTPS

• Ad a new Google Analytics code #248

• QA and merge all existing articles submissions (to minimize merge conflicts when I recategorize articles)

• Create a 0.1.0 GitHub release

• Recategorize some of the loose articles into more descriptive subfolders.

• Write a Medium article announcing Guides and explaining what it does (I will do this)

Date of announcement: Wednesday, September 20

Leave a comment

Should be parserOptions instead of parserOption in line number 2 in the .eslintrc file.
Node version: 8.2.1
npm version: 5.3.0
ESlint version:4.3.0
ESlint was giving the error as below.

Create a sitemap using the gatsby-plugin-sitemap

Usage is described here

Expand this object to inclued the correct formatting for PHP, SQL, MongoDB, DynamoDB and any other words/names that wont look right if they are title cased e.g. Sql, Php, Jquery

Since internal links will use relative paths, we can just apply the target="_blank" and rel="nofollow" to any non-relative path URL. Is it possible to configure this within Gatsby?

Should guides have a section on React? I think it would add a lot of value to freeCodeCamp's guides site.

With 1000 + pages, webpack takes over two minutes to compile the bundle.

At over 1100 pages, node runs out of memory and splits this out the the console

<--- Last few GCs --->

[13202:0x24445f0]   117474 ms: Mark-sweep 1418.5 (1679.5) -> 1418.4 (1662.0) MB, 387.4 / 0.1 ms  (+ 0.0 ms in 0 steps since start of marking, biggest step 0.0 ms, walltime since start of marking 388 ms) last resort 
[13202:0x24445f0]   117870 ms: Mark-sweep 1418.4 (1662.0) -> 1418.6 (1662.5) MB, 395.1 / 0.0 ms  last resort 


<--- JS stacktrace --->

==== JS stack trace =========================================

Security context: 0x113605ea9891 <JS Object>
    1: addModule [/home/stuart/guides/node_modules/webpack/lib/Compilation.js:~69] [pc=0x5d8659798c1](this=0x28f49cd1de81 <a Compilation with map 0x8c9d49ada19>,module=0x20b6d60a1809 <a NormalModule with map 0x23a3fd3d8419>,cacheGroup=0x1a2e60a02201 <null>)
    2: /* anonymous */ [/home/stuart/guides/node_modules/webpack/lib/Compilation.js:~214] [pc=0x5d8660f72d9](this=0x24e9bc00ef49 <JS Global...

FATAL ERROR: CALL_AND_RETRY_LAST Allocation failed - JavaScript heap out of memory
 1: node::Abort() [node]
 2: 0x13647ec [node]
 3: v8::Utils::ReportOOMFailure(char const*, bool) [node]
 4: v8::internal::V8::FatalProcessOutOfMemory(char const*, bool) [node]
 5: v8::internal::Factory::NewInternalizedStringImpl(v8::internal::Handle<v8::internal::String>, int, unsigned int) [node]
 6: v8::internal::InternalizedStringKey::AsHandle(v8::internal::Isolate*) [node]
 7: v8::internal::StringTable::LookupString(v8::internal::Isolate*, v8::internal::Handle<v8::internal::String>) [node]
 8: v8::internal::LookupIterator::PropertyOrElement(v8::internal::Isolate*, v8::internal::Handle<v8::internal::Object>, v8::internal::Handle<v8::internal::Object>, bool*, v8::internal::LookupIterator::Configuration) [node]
 9: v8::internal::Runtime_SetProperty(int, v8::internal::Object**, v8::internal::Isolate*) [node]
10: 0x5d86548437d
Aborted (core dumped)

We are currently at 1261 pages.

From what I can figure out, gatsby creates one huge JSON like structure for webpack to work with, with so many pages, node runs out of memory. I have not yet found a way of adjusting the node memory allocation as this is all contained inside gatsby

I will see if v1 addresses this

Articles that are meant for articles/math are also appearing in articles/javascript/standard-objects/math in the Side Nav

I suspect that createNavData requires a refactor.

The Stub needs to be removed from this article.

https://github.com/freeCodeCamp/guides/blob/b35ec79ed1223c3ea480c49491a6a79cf21ce3fa/src/pages/articles/html/iframes/index.md

This article cannot be parsed correctly due do __proto__ doing weird things inside node, even as a string.

https://github.com/freeCodeCamp/guides/blob/c43d5ef36de772ce86224260825647d82d9c7d8c/src/pages/articles/javascript/standard-objects/object/object-prototype-__proto__/index.md

We need to change cplusplus to C++ in titleify.

This can be added to the formatting object in src/seed

@raisedadead @QuincyLarson @Bouncey

A discussion in CT started about deployment for mobility of FCC resources. "Guides" was suggested as target.

This post opens a discussion about the desirability and feasibility of this request and if decided to start working on a road map.

https://github.com/freeCodeCamp/guides/blob/master/README.md#how-to-contribute

This section in the README references a long forgotten script.

It needs to be removed.

It currently reads

Write your article, run npm run meta, commit your changes locally, and push your new branch to GitHub with the command git push origin <new-branch-name>

It should read

Write your article, commit your changes locally, and push your new branch to GitHub with the command 'git push origin `

Whilst working on a different PR, I noticed at least three different articles talking about Array.prototype.forEach