The https://freeCodeCamp.com open source codebase and curriculum. Learn to code and help nonprofits.

Questions about bootstrap column padding

So I am doing the freecodecamp lessons and I am at the section on designing a portfolio mock-up. I have a few issues that are really troubling me..

The goal of the project is to build a working recreation of this page - https://codepen.io/freeCodeCamp/full/YqLyXB

There isn't a specific piece of code that I can think of...

Here is mine so far - https://codepen.io/illpill/pen/WRgoVo?editors=1100

Code in question:

.navbar-brand {
   padding-left: 180px;

My problem is this: I don't understand how he pads his navbar. When I shrink my browser window, my brand in the bar stays in the same place. While his kind of aligns on the left when resizing. Is there a better way for me to do it?

Source: (StackOverflow)

jQuery color animate not syncing across multiple elements

I'm having trouble syncing a color change animation using jQuery. For some reason, the font color inside a button element only changes when every other color change has finished processing. Here is the code:

$(".jumbotron-fluid, .btn").animate({
    backgroundColor: colors[seed]["background"]
    backgroundColor: colors[seed]["container"]
$("p, blockquote footer, .btn, a:link, a:visited, a:hover, a:active, a").animate({
    color: colors[seed]["font"]

Here is a link to a CodePen that shows this project in action: http://codepen.io/christianflorez/full/OWdYRm/

When clicking on the "Get a new quote" button, every time the font color in the button changes to white, it doesn't change in sync with the rest of the DOM. Anyone know why this might be happening? I've tried testing the code across multiple browsers and the same issue appears. Thanks everyone for your help.

Source: (StackOverflow)

How to modify and queue arrays with a function using .push and .shift

Basically, I need to know how to move an array through a queue so that "1' gets knocked off and "6" gets added. I already know to do this I need to use the .push() and .shift() elements. I, however, am stumped on how to do so. Particularly how to structure the code and what to tell the .push() and .shift() to look at. Ex. "blank.push();". The farthest I got was to include "arr.push()" and "arr.shift()" within the function but all that did was knock off the "1". I also need to know why and what I need to change the "return item;" line to. Below is the code I was provided.

function nextInLine(arr, item) {
  // Your code here
  return item;  // Change this line

// Test Setup
var testArr = [1,2,3,4,5];

// Display Code
console.log("Before: " + JSON.stringify(testArr));
console.log(nextInLine(testArr, 6)); // Modify this line to test
console.log("After: " + JSON.stringify(testArr));

If all you want to do is provide a solution that works, I should be able to follow the bread crumbs of what goes where and figure out how and why it works but I would very much appreciate a detailed as possible explanation of what is happening in this code for everything above the "//Display Code" line. I have some working knowledge of JS but the less you assume I know the happier I will be. :)

BONUS ROUND: Just curious but if some could tell me why "arr.shift()" is acceptable code (regardless of it's function) but "item.push()" or "item.shift()" errors as "TypeError: item.push is not a function." To me, they are both just similar parameters of this function. Why does one error out while the other doesn't? Is there a programmed meaning to "arr" or trait I am unaware of?

Source: (StackOverflow)

Missing letters freecodecamp

Actually I found an answer a few minutes ago. But I found something strange.

This is my answer for 'Missing letters' in freeCodeCamp challenges.

function fearNotLetter(str) {

var string; 

for (i=0;i<str.length;i++) {
  if(str.charCodeAt(i)+1 < str.charCodeAt(i+1)){
    string = String.fromCharCode(str.charCodeAt(i)+1);

return string;


When I change < operator in if statement into != (not same), it doesn't work! For me, it seems that != works exactly same as < operator does. (Because 'not same' can mean something is bigger than the other.)

What is the difference between < and != in the code above?

Source: (StackOverflow)

Return early pattern for functions

I'm stuck on this problem re: javascript from FreeCodeCamp. Below is the code given. I'm supposed to modify the function abText so that if a or b are less than 0 the function will immediately exit with a value of undefined. Any suggestions? Thanks a lot for the help! Donny

// Setup
function abTest(a, b) {
// Only change code below this line
  if (a < 0 && b < 0) {

  } else if() {


// Only change code above this line

  return Math.round(Math.pow(Math.sqrt(a) + Math.sqrt(b), 2));

// Change values below to test your code

Source: (StackOverflow)

Freecodecamp - Drop it.. Can't find the bug on my code

"Drop the elements of an array (first argument), starting from the front, until the predicate (second argument) returns true.

The second argument, func, is a function you'll use to test the first elements of the array to decide if you should drop it or not.

Return the rest of the array, otherwise return an empty array."

function dropElements(arr, func) {

  for (var i=0; i<arr.length; i++) {

   if (func(arr[0])) {
   } else {


  return arr;


dropElements([1, 2, 3, 4], function(n) {return n > 5;});

In all the other cases the code works, but in this one the loop stop prematurely on the second itineration.

Source: (StackOverflow)

How to convert a string to title case in javascript? [duplicate]

This question already has an answer here:

I was solving algorithms problems on FreeCodeCamp . Now with this code I thought I would make every ar[i] (every word of the sentence) titlecase. and unfortunately it returns only the first word. I mean I created the for loop to get every element until it reaches the array length ar[0], ar[1]... etc. Also getting the return order outside the for loop but that failed too. I know there will be one more join job to convert the array to a sentence again but I just can't wrap my mind around it. I didn't want to see the solution on the internet as I wanted to get the solution myself so can you please give hints about the problem and not give away the whole solution? Thanks a lot :)

function titleCase(str) {
  var ar = [];
  str = str.toLowerCase();
  ar = str.split(" ");
  for (var i=0;i<ar.length;i++){
    var x = ar[i];
    x = x.split("");
    x[0] = x[0].toUpperCase();
    x = x.join("");
    return x;

titleCase("I'm a little tea pot");

Source: (StackOverflow)

Find smallest commons multiple - a different algorithm

I am follow FreeCodeCamp challenge at "Smallest common multiples" Here it is:

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. I have an idea for an algorithm but I dont know how to translate it into code. Here are my algorithm:

Suppose the given array is [1,3].

First, find the min and max of the array:(min = 1 and max = 3).

Second: assign max value to the common multiples : var result = max;

Third: remainders = result % i (i in range of [min, max-1]).

If all remainders are 0; we return the result, else we update the result by +max, then repeat the process until all the remainders are 0

Source: (StackOverflow)

Why is my var (lon & lat) returning undefined? [duplicate]

This question already has an answer here:

the jist of it is that I want the value I recieved from my first API which grabs the longitude + latitude to display in the URL of the second API which would display the weather. However the lon + lat is returning as undefined? I have no idea what im doing wrong, I have declared lon and lat as a global variable. Thanks!

var lon;
var lat;
var city;

$(function() {

    var url = "http://ip-api.com/json";
    $.getJSON(url, function(data) {
            lon = data.lon;
            lat = data.lat;
            city = data.city;
            $("#geo").html("Longitude " + lon + " Latitude " + lat + " City: " + city);

            return lon;
            return lat;


    var url2 = "http://api.openweathermap.org/data/2.5/weather?lat=" + lat + "&lon=" + lon + "&appid=2e261bce8053ef6131bb74b9d613dc6e"; //be very careful of the url

    $.getJSON(url2, function(data) {


Source: (StackOverflow)

Running FreeCodeCamp on local environment failing with

I am trying to setup FreeCodeCamp locally as per instructions on the wiki. https://forum.freecodecamp.com/t/how-to-clone-and-setup-the-free-code-camp-website-on-a-windows-pc/19366

However when I run "node seed"

vagrant@freecodecamp:~/FreeCodeCamp$ node seed
Error: Cannot find module '../rev-manifest'
    at Function.Module._resolveFilename (module.js:337:15)
    at Function.Module._load (module.js:287:25)
    at Function._load (/home/vagrant/FreeCodeCamp/node_modules/pmx/lib/transaction.js:62:21)
    at Module.require (module.js:366:17)
    at require (module.js:385:17)
    at Object.<anonymous> (/home/vagrant/FreeCodeCamp/server/middlewares/jade-helpers.js:1:1)
    at Module._compile (module.js:435:26)
    at loader (/home/vagrant/FreeCodeCamp/node_modules/babel-register/lib/node.js:144:5)
    at Object.require.extensions.(anonymous function) [as .js] (/home/vagrant/FreeCodeCamp/node_modules/babel-register/lib/node.js:154:7)
    at Module.load (module.js:356:32)
    at Function.Module._load (module.js:311:12)
    at Function._load (/home/vagrant/FreeCodeCamp/node_modules/pmx/lib/transaction.js:62:21)
    at Module.require (module.js:366:17)
    at require (module.js:385:17)
    at /home/vagrant/FreeCodeCamp/node_modules/loopback-boot/lib/executor.js:343:19
    at Array.forEach (native)

I tried installing rev-manifest module. But it does not seem to have helping.

I wish somebody out here can help me.

Source: (StackOverflow)

Returning an javascript object property value from an array of objects [duplicate]

I was doing one of the questions in free code camp. They asked me to return the value of a property of an object, from an array of objects. My question is when I ran the same code with return contacts[nm].props it didn't run, whereas when I used contacts[nm][props], it did. Why is that? the whole code is given below

var contacts = [
        "firstName": "Akira",
        "lastName": "Laine",
        "number": "0543236543",
        "likes": ["Pizza", "Coding", "Brownie Points"]
        "firstName": "Harry",
        "lastName": "Potter",
        "number": "0994372684",
        "likes": ["Hogwarts", "Magic", "Hagrid"]
        "firstName": "Sherlock",
        "lastName": "Holmes",
        "number": "0487345643",
        "likes": ["Intriguing Cases", "Violin"]
        "firstName": "Kristian",
        "lastName": "Vos",
        "number": "unknown",
        "likes": ["Javascript", "Gaming", "Foxes"]

function lookUpProfile(firstname,prop)
{ var nm;
    for(var i=0;i<=3;i++)
      {if (contacts[i].firstName==firstname)
         { if (contacts[nm].hasOwnProperty(prop))
            {return contacts[nm][prop];//works
             /*return contacts[nm].props*/ // this does not}
            else return "No such property";

     else return "No such contact";                                       

// Change these values to test your function


Source: (StackOverflow)

getJSON query for freecodecamp not retrieving data

I'm a little at the end of my tether at the moment. I've been trying to do the absolute start of the Random Quote Machine task on freecodecamp, and retrieve a quote through a JSON API. I know the JSON is solid 'cos it's working in the browser, but the button for whatever reason does not work!

Can anyone shed some light on this?

(document).ready(function() {
  $("#button").on("click", function() {
    $.getJSON("http://quotes.rest/qod.json?category=inspire", function(json) {
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<button id="button">
<section id="quote"></section>

Source: (StackOverflow)

JavaScript Closure: array.push is not reflecting current value

I am trying to complete "No Repeats Please" challenge of #FreeCodeCamp.

I am not able to understand there is difference in output of result.push(array); and result.push(array.join()); Below is my code.

function permAlone(str) {
  //Variables for main function
  var result = [];
  str = str.split("");
  generateArray(str, 3);

  //function to swap the array members
  function swap(array, pos1, pos2) {
    var temp;
    temp = array[pos1];
    array[pos1] = array[pos2];
    array[pos2] = temp;

  //function to generate array Permutations
  function generateArray(array, n) {
    if (n == 1) {
      result.push(array); //returns 2d array and with each element has "ABC"
      //result.push(array.join('')); //return correct value
    } else {
      for (var i = 1; i <= n; i++) {
        generateArray(array, n - 1);
        if (n % 2) { //If n is Odd
          var j = 1;
        } else {
          var j = i;
        swap(array, j - 1, n - 1); //to counter zero indexing of JavaScript	
      } //end for
    } //end else
  } // end generateArray



Source: (StackOverflow)

backslash free code camp [closed]

I am attempting to escape the sequences in this string with backslash's. Ive been working on making it look like this :

FirstLine \SecondLine\ ThirdLine

here is my code.

var myStr = "FirstLine\n\SecondLine\r\ThirdLine";

Source: (StackOverflow)

How does this function remove all falsy values from an array?

function bouncer( arr ){
return arr.filter( function( value ){
    return value;

This function removes all falsy values from an array. I don't understand how it works. Does filter automatically only return non-falsy values?

Source: (StackOverflow)