24th
Jan 2017
Tyler Moeller
@TylerMoeller
Jan 24 2017 00:03 UTC
@mrs-coder What you're looking for is called Scroll Spy. Here are the instructions: http://getbootstrap.com/javascript/#scrollspy
John Nunns
@johnnunns
Jan 24 2017 00:06 UTC
hey guys just need a little help here:
function getCount(str) {
var vowelsCount = 0;

str.split(' ')
switch (str){
case "a": vowelsCount + 1;
break;
case "e": vowelsCount + 1;
break;
case "i": vowelsCount + 1;
break;
case "o": vowelsCount + 1;
break;
case "u": vowelsCount + 1;
break;
};

return vowelsCount;
}
just need to return the vowel count in a given string
probably not using the split property correctly though
c0d0er
@c0d0er
Jan 24 2017 00:19 UTC
could anybody help for the following 2 questions?
var arr = [
[0,0,0]
];
var x=[...arr, [1,1,1,]]
console.log(x)//[ [ 0, 0, 0 ], [ 1, 1, 1 ] ]
x[0][0]=1;
console.log(x)//[ [ 1, 0, 0 ], [ 1, 1, 1 ] ]
console.log(arr)//[ [ 1, 0, 0 ] ]---> why use spread operator, the arr element is still changed?
var arr = [
[0,0,0]
];
var x=arr.concat([[1,1,1]]);
console.log(x)//[ [ 0, 0, 0 ], [ 1, 1, 1 ] ]
x[0][0]=1;
console.log(x)//[ [ 1, 0, 0 ], [ 1, 1, 1 ] ]
console.log(arr)//[ [ 1, 0, 0 ] ]---> why use concat, the arr element is still changed?
Tyler Moeller
@TylerMoeller
Jan 24 2017 00:40 UTC
@johnnunns Correct, .split(' ') will separate your string by spaces rather than characters. Use str.split('') instead. You could then to a str.split('').map to loop through the string and evaluate each character.
@c0d0er Not sure how to answer that question - I'd have to know the context.
c0d0er
@c0d0er
Jan 24 2017 00:43 UTC
@TylerMoeller there is no other contexts, you can just run, it will comes the result
Tyler Moeller
@TylerMoeller
Jan 24 2017 00:44 UTC
Are you asking which is better to use?
.concat() vs. spread operator for a case like that, I mean
@c0d0er Or are you asking why the original arr changes when you're only updating x?
c0d0er
@c0d0er
Jan 24 2017 00:48 UTC
@TylerMoeller yes
@TylerMoeller i am asking why the original arr changes when you're only updating x?
Tyler Moeller
@TylerMoeller
Jan 24 2017 00:49 UTC
In JavaScript arrays are objects and variables are references to objects. When you update the variable, you are also updating the object. To prevent it, you need to clone the array first.
@c0d0er
Ben Mayer Davis
@benmayerdavis
Jan 24 2017 00:51 UTC
has anybody else run into problems with adding icons to your document? I'm trying to use Font Awesome but the icons just won't show up in my document
c0d0er
@c0d0er
Jan 24 2017 00:52 UTC
@TylerMoeller thanks! how to clone? could you give me a simple pseudo code?
CamperBot
@camperbot
Jan 24 2017 00:52 UTC
:star2: 1388 | @tylermoeller |http://www.freecodecamp.com/tylermoeller
c0d0er sends brownie points to @tylermoeller :sparkles: :thumbsup: :sparkles:
Tyler Moeller
@TylerMoeller
Jan 24 2017 00:54 UTC
For a shallow copy, you can just do: var copyOfMyArray = myArray.slice(0);
John Nunns
@johnnunns
Jan 24 2017 00:57 UTC
without going into high level functions yet @TylerMoeller could you tell me where I'm going wrong here?
function getCount(str) {
var sum=0
var i = str.split(");
switch (i){
case 'a': sum + 1;
break;
case 'e': sum +1;
break;
case 'i': sum + 1;
break;
case 'o': sum + 1;
break;
case 'u': sum + 1;
break;
};

return sum

}
c0d0er
@c0d0er
Jan 24 2017 00:58 UTC
@TylerMoeller this is a really good one! thanks!
CamperBot
@camperbot
Jan 24 2017 00:58 UTC
c0d0er sends brownie points to @tylermoeller :sparkles: :thumbsup: :sparkles:
:warning: c0d0er already gave tylermoeller points
John Nunns
@johnnunns
Jan 24 2017 01:00 UTC
It's something wrong in my switch statement it looks to me
Tyler Moeller
@TylerMoeller
Jan 24 2017 01:00 UTC
@johnnunns str.split('') needs to be two apostrophes, not a double quote, for starters :)
John Nunns
@johnnunns
Jan 24 2017 01:00 UTC
I changed it back to str.split('') forgot to change before i copy pasted
Tyler Moeller
@TylerMoeller
Jan 24 2017 01:00 UTC
But yes, your switch statement runs once against the array
John Nunns
@johnnunns
Jan 24 2017 01:00 UTC
yeah ^ :)
Tyler Moeller
@TylerMoeller
Jan 24 2017 01:01 UTC
For example, say str='hello world';
You are doing:
  switch (['h', 'e', 'l', 'l', 'o', ' ', 'w', 'o', 'r', 'l', 'd']){
case 'a': sum + 1;
break;
case 'e': sum + 1;
break;
case 'i': sum + 1;
break;
case 'o': sum + 1;
break;
case 'u': sum + 1;
break;
};
If you don't want to use higher order functions, you can use a simple for() loop and evaluate each element returned from str.split('')
John Nunns
@johnnunns
Jan 24 2017 01:03 UTC
right
because case 'a' doesn't equal hello world split up
Tyler Moeller
@TylerMoeller
Jan 24 2017 01:04 UTC
Long story short - don't use a switch
There are lots of options though and you could make it work with a switch statement if you have to, I just think it would be cleaner with a simple if it's a vowel, add 1 statement.
John Nunns
@johnnunns
Jan 24 2017 01:05 UTC
function getCount(str) {
var sum=0
var i = str.split('');
for(var x=i; x<str.length; x++){

return sum

}
I'm just not sure how to say if one of those vowels inside the string equals a vowel
Tyler Moeller
@TylerMoeller
Jan 24 2017 01:06 UTC
Start by trying to console.log each letter individually
Your for() loop needs to start at 0, then go to index 1, 2, 3 etc.
John Nunns
@johnnunns
Jan 24 2017 01:08 UTC
how will I tie it into the split then if i don't set something equal to i?
Tyler Moeller
@TylerMoeller
Jan 24 2017 01:08 UTC
You'll start at 0 and end when it's less than str.split('').length
Don't know how much of a hint you're looking for here ^^ that may be too much
John Nunns
@johnnunns
Jan 24 2017 01:10 UTC
right, so then I can just put i.length
Tyler Moeller
@TylerMoeller
Jan 24 2017 01:10 UTC
Correct
John Nunns
@johnnunns
Jan 24 2017 01:11 UTC
now nest an if statement inside the for?
Tyler Moeller
@TylerMoeller
Jan 24 2017 01:11 UTC
Yes, test if it's a vowel, if so, add 1 to sum
John Nunns
@johnnunns
Jan 24 2017 01:12 UTC
still seems I'll run into the same problem as my switch
Salomon
@zarruk
Jan 24 2017 01:12 UTC
Does anybody know how to put the transcurrido div justified in the center (instead of starting all the way from the center to the left)? I mean, if not with justify-content: center, then how? http://codepen.io/zarruk/pen/VPWrWL?editors=1100
John Nunns
@johnnunns
Jan 24 2017 01:12 UTC
actually. let me try
Salomon
@zarruk
Jan 24 2017 01:13 UTC
Also, why is my stop button on top of the start one? Does anybody know how to put the transcurrido div justified in the center (instead of starting all the way from the center to the left)? I mean, if not with justify-content: center, then how? http://codepen.io/zarruk/pen/VPWrWL?editors=1100
Tyler Moeller
@TylerMoeller
Jan 24 2017 01:13 UTC
Try to get it to console.log() each letter in the string first.
brb
John Nunns
@johnnunns
Jan 24 2017 01:15 UTC
like a console.log(i[0])?
Tyler Moeller
@TylerMoeller
Jan 24 2017 01:16 UTC
Yes
That's just my approach though - make sure the for loop is working as intended before adding logic
John Nunns
@johnnunns
Jan 24 2017 01:17 UTC
for loop is working good right now
where I'm running a blank though
I could write a lot of code right now but I'll ask before it doesn't work
an if statement like
if(i = "a") sum+1 ..... etc
Tyler Moeller
@TylerMoeller
Jan 24 2017 01:18 UTC
A regular expression would be a little cleaner looking
John Nunns
@johnnunns
Jan 24 2017 01:18 UTC
I'll show you what I have
function getCount(str) {
var sum=0
var i = str.split('');
for(var x=0; x<i.length; x++){
if (i === 'a' || 'e' || 'i' || 'o' || 'u'){
return sum + 1;
};
};

return sum

}
I'm sure you see what I'm trying to do, I see why it's only returning 1 because the loop is completed
I'm just not sure how to rework it
Tyler Moeller
@TylerMoeller
Jan 24 2017 01:21 UTC
In your for() loop, what does i equal?
John Nunns
@johnnunns
Jan 24 2017 01:23 UTC
str.split
Tyler Moeller
@TylerMoeller
Jan 24 2017 01:23 UTC
Right, you want to compare against i[0], i1, i[2], etc..
Also, you will have to do if (i === 'a' || i === 'e' || etc...
John Nunns
@johnnunns
Jan 24 2017 01:24 UTC
seems like an absolute ton of code :)
because I'm not using higher level function I'm presuming
but ok
Tyler Moeller
@TylerMoeller
Jan 24 2017 01:25 UTC
The next problem is that return will stop the for loop - so you just want to add, not return inside the loop
Yes, and not using a regex :)
Melissa Guerrero
@Mmgfrog
Jan 24 2017 01:25 UTC
Good evening. I am desperately seeking ideas as to why my Tweet This Quote button won't capture or tweet a quote from my Random Quote Machine. I have read the Twitter docs at length. I have tried Stack Overflow. I have asked at a Meetup. I'm out of ideas to try to get it to work. http://codepen.io/Mmgfrog/pen/egOxwq?editors=1010#0
John Nunns
@johnnunns
Jan 24 2017 01:25 UTC
so there's no way to make it so that it can naturally go from I[0] to the end of i
if I'm not doing a higher lvl function
like if( i[0]-i[end of i] === a | e | i | o | u) sum + 1
Tyler Moeller
@TylerMoeller
Jan 24 2017 01:27 UTC
I'm not sure, their may be other methods out there, but a higher order function would definitely make it cleaner
Melissa Guerrero
@Mmgfrog
Jan 24 2017 01:27 UTC
What is happening is that I can generate a quote from my array, no problem. But once that's done, my Twitter button is un-clickable.
John Nunns
@johnnunns
Jan 24 2017 01:27 UTC
gotch
Tyler Moeller
@TylerMoeller
Jan 24 2017 01:27 UTC
Like .includes() I think? but I haven't used it: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/includes
Melissa Guerrero
@Mmgfrog
Jan 24 2017 01:28 UTC
Or, on page refresh/load, I can get a Twitter window to open, but no quote inside.
Tyler Moeller
@TylerMoeller
Jan 24 2017 01:29 UTC
@Mmgfrog Most people create a button with the same style as your twitter button and make it a hyperlink rather than using the Twitter widget code. The documentation can be confusing
Melissa Guerrero
@Mmgfrog
Jan 24 2017 01:30 UTC
@TylerMoeller Would that strategy still capture the quote? Thanks for your input
CamperBot
@camperbot
Jan 24 2017 01:30 UTC
mmgfrog sends brownie points to @tylermoeller :sparkles: :thumbsup: :sparkles:
:star2: 1389 | @tylermoeller |http://www.freecodecamp.com/tylermoeller
Ronit
@rfried99
Jan 24 2017 01:31 UTC
Hello campers! I could really use your help. I can't seem to get a background image to rend. Here is the code: http://codepen.io/rfried99/pen/QGYyXy
Tyler Moeller
@TylerMoeller
Jan 24 2017 01:31 UTC
@Mmgfrog Yes, it should - you are getting the quote text from the page, so there isn't a scope issue to worry about.
Melissa Guerrero
@Mmgfrog
Jan 24 2017 01:32 UTC
@TylerMoeller OK I will redo that part without the widget. I appreciate it!
John Nunns
@johnnunns
Jan 24 2017 01:33 UTC
@TylerMoeller semi cheating here, because I know the word is 'abracadabra' but to save time i wrote this
function getCount(str) {
var sum=0
var i = str.split('');
for(var x=0; x<i.length; x++){
if (i[0] === 'a'){
sum + 1;
} else if (i[3] === 'a'){
sum+1;
} else if (i[5] === 'a') {
sum + 1;
} else if (i[7] === 'a') {
sum + 1;
} else if (i[10] === 'a') {
sum + 1;

};

};

return sum;

}
still returning zero though
Tyler Moeller
@TylerMoeller
Jan 24 2017 01:34 UTC
@Mmgfrog Good luck - also, you will need to update your URL to use the web intent without the widget code:
https://twitter.com/intent/tweet?text=The text you want to tweet
Melissa Guerrero
@Mmgfrog
Jan 24 2017 01:34 UTC
@rfried99 Is the image you're trying to render in your header? Or is it supposed to be in some other part of the page?
Tyler Moeller
@TylerMoeller
Jan 24 2017 01:35 UTC
@johnnunns You'll need to add 1 to the existing sum variable: sum++ or sum = sum + 1
Melissa Guerrero
@Mmgfrog
Jan 24 2017 01:35 UTC
@TylerMoeller OK. That line looks familiar. Pretty sure I read through that in the docs. LOL
John Nunns
@johnnunns
Jan 24 2017 01:36 UTC
did the sum += 1
returned 11 :)
Tyler Moeller
@TylerMoeller
Jan 24 2017 01:37 UTC
:)
Now to clean it up
At least you're adding to the original now
John Nunns
@johnnunns
Jan 24 2017 01:38 UTC
Well shoot, it's not only testing me on abracadabra haha
first lets clean it up though, why would it return 11?
Ronit
@rfried99
Jan 24 2017 01:40 UTC
@Mmgfrog thank you! It's supposed to be in the main
CamperBot
@camperbot
Jan 24 2017 01:40 UTC
rfried99 sends brownie points to @mmgfrog :sparkles: :thumbsup: :sparkles:
Matt Kieffer
@luna9
Jan 24 2017 01:41 UTC
Ronit// take a look at your CSS / main / you are linking to a local asset. Try pushing it up and use http
Tyler Moeller
@TylerMoeller
Jan 24 2017 01:42 UTC
@johnnunns it gives 11 because it's looping through the array once for each letter in abracadabra and adding 1 every time because if (i[0] === 'a') is true every time
John Nunns
@johnnunns
Jan 24 2017 01:44 UTC
how do we stop that?
Tyler Moeller
@TylerMoeller
Jan 24 2017 01:44 UTC
You were closer before with your previous if(), but you need to be using i[x] instead: if (i[x] === 'a' || i[x] === 'e' || i[x] === 'i' || i[x] === 'o' || i[x] === 'u') {
I could have been clearer here: :point_up: January 23, 2017 5:23 PM
Ronit
@rfried99
Jan 24 2017 01:45 UTC
@luna9 I feel silly for asking this, but what do you mean by "pushing it up"
John Nunns
@johnnunns
Jan 24 2017 01:46 UTC
haha you don't want to see what I've just coded. The worst code ever I typed if ( i[0] === a i[0] === e etc all the way to i[10] so far
Tyler Moeller
@TylerMoeller
Jan 24 2017 01:46 UTC
lol, yeah, no need for that when you have x incrementing for you
Keep in mind though, that's only looking at lower-case vowels
Matt Kieffer
@luna9
Jan 24 2017 01:47 UTC
Look at the source for the CSS / header - you are linking to a hosted image, http. Not look at the image you are linking to in the CSS / main. It does not have http it has file / bla / bla .
John Nunns
@johnnunns
Jan 24 2017 01:47 UTC

@TylerMoeller function getCount(str) {
var sum=0
var i = str.split('');
for(var x=0; x<i.length; x++){
if (i[x] === 'a' || i[x] === 'e' || i[x] === 'i' || i[x] === 'o' || i[x] === 'u'){
sum ++;
};

};

return sum;

}

function getCount(str) {
var sum=0
var i = str.split('');
for(var x=0; x<i.length; x++){
if (i[x] === 'a' || i[x] === 'e' || i[x] === 'i' || i[x] === 'o' || i[x] === 'u'){
sum ++;
};

};

return sum;

}
that worked
Tyler Moeller
@TylerMoeller
Jan 24 2017 01:48 UTC
:+1:
For lower-case vowels :)
John Nunns
@johnnunns
Jan 24 2017 01:48 UTC
could have have put str.tolowercase()?
could I*
Tyler Moeller
@TylerMoeller
Jan 24 2017 01:48 UTC
yes, that works
Much better than more IFs
John Nunns
@johnnunns
Jan 24 2017 01:48 UTC
haha yes
is that the correct syntax?
Tyler Moeller
@TylerMoeller
Jan 24 2017 01:49 UTC
str.toLowerCase()
John Nunns
@johnnunns
Jan 24 2017 01:49 UTC
str.toLowerCase()
ok, just making sure nothing inside ()
Tyler Moeller
@TylerMoeller
Jan 24 2017 01:49 UTC
Correct
John Nunns
@johnnunns
Jan 24 2017 01:50 UTC
function getCount(str) {
return (str.match(/[aeiou]/ig)||[]).length;
}
that was the highest rated one btw
do you know what the ig mean?
Tyler Moeller
@TylerMoeller
Jan 24 2017 01:51 UTC

This was my version:

function getCount(str) {
var vowelCount = 0;
str.split('').map(val => {if (val.match(/[aeiou]/i)) vowelCount++});
return vowelCount;
}

I like the one you gave better

Matt Kieffer
@luna9
Jan 24 2017 01:51 UTC
@ronit looks like you just added http in from of that image link. That will not work. For testing, copy the same image URL that you are using in CSS / header and paste it in the CSS / main. This was you can see the image work. Then upload the image you want and link it.
Tyler Moeller
@TylerMoeller
Jan 24 2017 01:52 UTC
@johnnunns the ig means ignore case and evaluate all characters in the string (g = global)
Ronit
@rfried99
Jan 24 2017 01:55 UTC
@luna9 thx!
CamperBot
@camperbot
Jan 24 2017 01:55 UTC
rfried99 sends brownie points to @luna9 :sparkles: :thumbsup: :sparkles:
Salomon
@zarruk
Jan 24 2017 02:12 UTC
Can somebody help me here please? How do I do for the transcurrido div to be in the center of the circle? http://codepen.io/zarruk/pen/VPWrWL?editors=1010
John Nunns
@johnnunns
Jan 24 2017 02:25 UTC
@TylerMoeller still on?
@jdtdesigns
Jan 24 2017 02:48 UTC
@johnnunns need some help?
John Nunns
@johnnunns
Jan 24 2017 02:50 UTC
Yeah man! @jdtdesigns
You've already solved it though haha
sounds fun I'm sure! :)
but with the knowledge gained from the recent codewars problem I just did, I was hoping for some direction
function getCount(str) {
var sum=0
var i = str.split('');
for(var x=0; x<i.length; x++){
if (i[x] === 'a' || i[x] === 'e' || i[x] === 'i' || i[x] === 'o' || i[x] === 'u'){
sum ++;
};

};

return sum;

}
so I just wrote this function in order to count the vowels
it works well, it could be condensed I saw from the other answers, but it works
Now, back to that prep course challenge, I'm hoping to apply this knowledge to it
@jdtdesigns
Jan 24 2017 02:52 UTC
@zarruk All the very high margins are screwing with your layout. I cleaned up some of the html and changed some css http://codepen.io/jdtadlock/pen/wgeyeB?editors=0100
John Nunns
@johnnunns
Jan 24 2017 02:53 UTC
Instructions from your teacher:
Write a function called "countAllCharacters".

Given a string, "countAllCharacters" returns an object where each key is a character in the given string. The value of each key should be how many times each character appeared in the given string.

Notes:
* If given an empty string, countAllCharacters should return an empty object.

var output = countAllCharacters('banana');
console.log(output); // --> {b: 1, a: 3, n: 2}

Starter Code :
function countAllCharacters(str) {
}
@jdtdesigns
Jan 24 2017 02:53 UTC
lol
still doesn't work i see
do you have a link to the challenge?
@johnnunns
John Nunns
@johnnunns
Jan 24 2017 02:54 UTC
so the code I just posted above was the answer to a codewars problem
different but similar
that one works to count vowels
but after doing that I thought why not give a go at the prep course one, which I have not written code for as yet
Coding Machine
@EphremL
Jan 24 2017 02:55 UTC
Hello, I am recruiting people to work a project with the skills of HTML and CSS also Javascript. If you think your the right canidate, join : https://gitter.im/Project-Awesome-1/Lobby?utm_source=share-link&utm_medium=link&utm_campaign=share-link
@jdtdesigns
Jan 24 2017 02:55 UTC
@johnnunns My answer is still failing or are you wanting to solve it yourself? @johnnunns
John Nunns
@johnnunns
Jan 24 2017 02:55 UTC
well when i looked at your answer, I realized I was pretty far from solving it myself
I may be a little closer now
I believed you used regex correct?
@jdtdesigns
Jan 24 2017 02:57 UTC
@johnnunns Yep
and .reduce()
and .map() i believe
John Nunns
@johnnunns
Jan 24 2017 02:58 UTC
you know what, let me rewatch those higher level function vids you showed me. and then also watch one on regex
@jdtdesigns
Jan 24 2017 02:59 UTC
for regex, you'll just google 'match blah blah' most of the time
John Nunns
@johnnunns
Jan 24 2017 03:00 UTC
is match and regex the same method?
@jdtdesigns
Jan 24 2017 03:00 UTC
i google regex all the time cause i'm not going to spend time figuring out the expression myself if i know it's been done 1000 times
.match() uses regex to 'match' a certain pattern in a string
Johnny
@JohnnyBizzel
Jan 24 2017 03:01 UTC
alexbuster
@alexbuster
Jan 24 2017 03:05 UTC
How can I import a picture from facebook can anybody help me please.
John Nunns
@johnnunns
Jan 24 2017 03:27 UTC
@jdtdesigns alright jd
gonna need some clarification :)
so I'm trying to apply map to my function
function countAllCharacters(str){
var i = str.split('')
var x = i.map(function(str){

})
return i
}

countAllCharacters('banana')
I'm really not sure if this is even close
@jdtdesigns
Jan 24 2017 03:30 UTC
@johnnunns the argument in the .map() callback refers to the current value in the array as the map iterates through it
John Nunns
@johnnunns
Jan 24 2017 03:32 UTC
.map(countAllCharacters(str)?
is that what I should set it to
I think I'm confused on how to put map inside of a function
J.S.
@jspeda
Jan 24 2017 03:39 UTC
you wouldn't use map in this situation
map is for when you have an array, and you want to perform some type of transformation on that array
good video^
John Nunns
@johnnunns
Jan 24 2017 03:41 UTC
just watched it haha @jspeda
which higher order function would you use to solve the problem then?
J.S.
@jspeda
Jan 24 2017 03:42 UTC
you can just call .length on the string
and call it a day
or wait
John Nunns
@johnnunns
Jan 24 2017 03:43 UTC
nah it's way more complicated unfortunately :)
J.S.
@jspeda
Jan 24 2017 03:43 UTC
what are you trying to do exactly
John Nunns
@johnnunns
Jan 24 2017 03:44 UTC
count each character and separate them - example 'banana' becomes b - 1 a - 3 n - 2
var output = countAllCharacters('banana');
console.log(output); // --> {b: 1, a: 3, n: 2}
J.S.
@jspeda
Jan 24 2017 03:45 UTC
ohhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhh
@jdtdesigns
Jan 24 2017 03:45 UTC
@jspeda You can use .map() on an object or array
@johnnunns I used .reduce() and .map()
you have my code lol
John Nunns
@johnnunns
Jan 24 2017 03:46 UTC
man unfortunately I do not! closed out of chrome that day before bed and lost it :(
J.S.
@jspeda
Jan 24 2017 03:47 UTC
sorry to lead you astray, I should have asked what you were doing more specifically!
John Nunns
@johnnunns
Jan 24 2017 03:47 UTC
sorry bud @jdtdesigns
@jdtdesigns
Jan 24 2017 03:48 UTC
Ve Vanderpool
@VanAmoVe
Jan 24 2017 03:50 UTC
hey everyone! I am working on my tribute page and I am stuck! I cant figure out how to change the opacity of my background image without changing everything. Help! This is my code
body
{
background-image:url("https://static-wp.lonewolfmag.com/140717134225-frida-kahlo-photo-horizontal-large-gallery.jpg");
background-attachment:fixed;
background-size: cover;
background-repeat: no-repeat;
}
sorry didnt know it was going to post that way
@jdtdesigns
Jan 24 2017 03:53 UTC
@VanAmoVe You can just set the background on a pseudo element and then lower the opacity
Sunny Wong
@swong194
Jan 24 2017 03:53 UTC
@VanAmoVe try making a class and setting a opacity?
@jdtdesigns
Jan 24 2017 03:53 UTC
it won't affect the text then
Ve Vanderpool
@VanAmoVe
Jan 24 2017 03:53 UTC
@jdtdesigns what do you mean by a pseudo element?
i did try making a class and it just made the image go into the div and not the background
John Nunns
@johnnunns
Jan 24 2017 03:56 UTC
@jdtdesigns I took out the part of the code that changes '.' and '?' and the lower case replaces
Just so I can grasp it a bit more without overcomplicating
var string = 'banana';

function countAllCharacters(str) {

str.split('')
str.reduce(function(result, letter) {
var regex = new RegExp('[^' + letter + ']', 'g');
result[letter] = string.replace(regex, '').length;

return result;
}, {})
}

countAllCharacters(string)
var string = 'banana';

function countAllCharacters(str) {

return str.split('')
.reduce(function(result, letter) {
var regex = new RegExp('[^' + letter + ']', 'g');
result[letter] = string.replace(regex, '').length;

return result;
}, {})
}

countAllCharacters(string)
ok figured out it needs to look like this
the regexp looks a bit confusing did you say I should just look up match() and replace it with that?
@jdtdesigns
Jan 24 2017 03:59 UTC
@johnnunns It depends on the way you're coding it
John Nunns
@johnnunns
Jan 24 2017 04:02 UTC
what's the '[^' @jdtdesigns
@jdtdesigns
Jan 24 2017 04:04 UTC
The ^ matches everything except that character
Ve Vanderpool
@VanAmoVe
Jan 24 2017 04:04 UTC
@jdtdesigns thank you, I think I see what your are saying brb
CamperBot
@camperbot
Jan 24 2017 04:04 UTC
vanamove sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
@jdtdesigns
Jan 24 2017 04:04 UTC
@johnnunns
John Nunns
@johnnunns
Jan 24 2017 04:05 UTC
someone in the js help spot just solved it before you logged in. While your code passes 2/3 tests, this code passes all. @jdtdesigns
function countAllCharacters(str) {
var array = str.split("")
var object = {};

if(str.length === 0) return object;
else{
for(var i = 0; i < array.length; i++){
if(object[array[i]]) object[array[i]]++;
else object[array[i]] = 1;
}
return object;
}

}

var output = countAllCharacters('banana');
console.log(output);
can you spot a difference?
@jdtdesigns
Jan 24 2017 04:08 UTC
@johnnunns It's counting spaces lol
John Nunns
@johnnunns
Jan 24 2017 04:09 UTC
@jdtdesigns
Jan 24 2017 04:11 UTC
nope
i removed all non word charactes
characters*
John Nunns
@johnnunns
Jan 24 2017 04:12 UTC
yeap works
@jdtdesigns
Jan 24 2017 04:12 UTC
John Nunns
@johnnunns
Jan 24 2017 04:13 UTC
doesn't run html
:) haha didn't see it's on the other side
oops
only completes 1 of 3 tests @jdtdesigns
well the third one should be an easy fix it returns and empty object if it's an empty string
Jan 24 2017 04:16 UTC
hey, so i am trying to learn react, and i am making a tic tac toe game. anyway, this is the piece of code that i have for trying to check if there is a winner. when i test it, it hits my debugger when there is 3 in a row, so i know the function is running properly. but the alert will never appear. and when i type in this.checkForWinner in the console, it gives me undefined. I'm pretty lost and don't know what the issue is, or what to do
  checkForWinner() {
var combos = [[0,1,2], [0,3,6], [0,4,8], [1,4,7], [2,5,8], [2,4,6], [3,4,5], [6,7,8]]
combos.find(function(combo) {
if(this.state.board[combo[0]] !== "" && this.state.board[combo[0]] === this.state.board[combo[1]] && this.state.board[combo[1]] === this.state.board[combo[2]]) {
debugger
return this.state.board[combo[0]]
} else {
return false
}
}.bind(this))
}

componentDidUpdate() {
if (this.checkForWinner()) {
debugger
}
}
@jdtdesigns
Jan 24 2017 04:17 UTC
@johnnunns put this inside the function on the challenge :
return string.replace(/(.)(?=.*\1)/g, '')
.split('')
.reduce(function(result, letter) {
var regex = new RegExp('[^' + letter + ']', 'g');
result[letter] = string.replace(regex, '').length;

return result;
}, {})
i looked over the other person's code and they're not removing capital copies or non word characters
i over-complicated it basically :P
John Nunns
@johnnunns
Jan 24 2017 04:20 UTC
that's the one! :)
do you mind explaining it?
string.replace
you're replacing everying inside / /
why the parentheses?
@jdtdesigns
@jdtdesigns
Jan 24 2017 04:21 UTC
all you need to know is this expression '/(.)(?=.*\1)/g' replaces any duplicate copies of characters in the string
so i'm creating a string that has no duplicates, then iterating through each character and getting the amount of duplicates from the original string using string.replace(regex, '').length
a simple regex to match everything except a single character is [^a] where 'a' is the character to leave out
the '/g' at the end just means to match as many as it can find in the entire string
without the 'g' it would just find the first then stop
@jdtdesigns
Jan 24 2017 04:28 UTC
make sense at all @johnnunns ?
John Nunns
@johnnunns
Jan 24 2017 04:29 UTC
that top expression is just a known one to do that? and I can find that where when I need to look it up?
@jdtdesigns
@jdtdesigns
Jan 24 2017 04:29 UTC
any regex can be found pretty quickly with google :P
John Nunns
@johnnunns
Jan 24 2017 04:29 UTC
what would I type into google to find that?
@jdtdesigns
Jan 24 2017 04:29 UTC
search 'replace duplicates regex'
John Nunns
@johnnunns
Jan 24 2017 04:30 UTC
gotcha
@jdtdesigns
Jan 24 2017 04:30 UTC
like i said before, i'm not a master regex'er
i google a lot myself when the need rises
John Nunns
@johnnunns
Jan 24 2017 04:30 UTC
right on
ok cool so duplicate copies of characters
Abdijabar Yussuf Mohamed
@aymohamed
Jan 24 2017 04:31 UTC
Hello guys, Any suggestion on how I can improve my tribute page ? https://codepen.io/aymohamed/pen/egWgmQ
John Nunns
@johnnunns
Jan 24 2017 04:31 UTC
don't we need those duplicates thought o count those?
to*
I guess what I'm not seeing is the need for the replace code
Abdijabar Yussuf Mohamed
@aymohamed
Jan 24 2017 04:32 UTC
Hello guys, Any suggestion on how I can improve my tribute page ? https://codepen.io/aymohamed/pen/egWgmQ
@jdtdesigns
Jan 24 2017 04:32 UTC
@johnnunns I basically through that in to thwart any potential errors and didn't even try it without it. It actually works without the replacement :P
John Nunns
@johnnunns
Jan 24 2017 04:33 UTC
yeah just tried it too :)
ok we just shortened our code! you're right though may not be error proof now :)
Jan 24 2017 04:34 UTC
@aymohamed the picture of mandela isn't centered. thats one thing i'd fix
Abdijabar Yussuf Mohamed
@aymohamed
Jan 24 2017 04:34 UTC
Ok. @chaddd980 , let me try
John Nunns
@johnnunns
Jan 24 2017 04:35 UTC
function countAllCharacters(string){

return string.split('')
.reduce(function(result, letter) {
var regex = new RegExp('[^' + letter + ']', 'g');
result[letter] = string.replace(regex, '').length;

return result;
}, {})
}

countAllCharacters('banana')
Abdijabar Yussuf Mohamed
@aymohamed
Jan 24 2017 04:37 UTC
John Nunns
@johnnunns
Jan 24 2017 04:44 UTC
@jdtdesigns alright, since you pretty much walked me through that, I should be able to complete this one still maybe with a bit of help
thanks for everything so far though @jdtdesigns
CamperBot
@camperbot
Jan 24 2017 04:44 UTC
johnnunns sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
John Nunns
@johnnunns
Jan 24 2017 04:44 UTC
ok the next one - very similar
Instructions from your teacher:
Write a function called "countWords".

Given a string, "countWords" returns an object where each key is a word in the given string, with its value being how many times that word appeared in th given  string.

Notes:
* If given an empty string, it should return an empty object.

var output = countWords('ask a bunch get a bunch');
console.log(output); // --> {ask: 1, a: 2, bunch: 2, get: 1}

Starter Code :
function countWords(str) {
}
I'm going to not look at the code you just gave me and lets see if I can figure this out
@jdtdesigns
Jan 24 2017 04:45 UTC
@johnnunns lol, good luck ;)
Abdijabar Yussuf Mohamed
@aymohamed
Jan 24 2017 04:51 UTC
Any hint on how I can link my html code with the CSS
?
John Nunns
@johnnunns
Jan 24 2017 04:51 UTC
function countWords(str) {
str.split(' ')
.reduce()
}
@jdtdesigns and that's how far I got. hows that for retention :) hahaha @jdtdesigns
reduce(function(sum, words)?
@jdtdesigns
Jan 24 2017 04:56 UTC
the first arg is the result or thing you'll be creating after the reduce is finished
so in your case an object
John Nunns
@johnnunns
Jan 24 2017 04:57 UTC
and not to go to far ahead, but the {}) at the end of the reduce is to pass it into those brackets correct?
@jdtdesigns
Jan 24 2017 04:57 UTC
words would be word because you're splitting the str into words and the second arg will refer to each 'word' in the split array
the {} at the end refers to the result arg
.reduce(result, word)
where result is {}
so the result starts as an empty object and you add to it in the function
John Nunns
@johnnunns
Jan 24 2017 04:58 UTC
gotcha, that's why with a sum reduce you can make the sum start at 0
@jdtdesigns
Jan 24 2017 04:59 UTC
correct
you can use this site to test your regex https://regex101.com/
John Nunns
@johnnunns
Jan 24 2017 05:00 UTC
ok I get to this point and now I'm thinking I need a regex method. What would I search?
or do I need to do any matching at all?
yeah I will actually I see it's going to pass a string that has the same word multiple times
@jdtdesigns
@jdtdesigns
Jan 24 2017 05:03 UTC
you need to match words, but probably remove special characters like commas, question marks and such
John Nunns
@johnnunns
Jan 24 2017 05:04 UTC
I think once again they're going more basic than that
all lower case string sentences
@jdtdesigns
Jan 24 2017 05:04 UTC
they might not have any special characters
i'm just thinking of what fcc usually does lol
they do a ton of test cases
John Nunns
@johnnunns
Jan 24 2017 05:05 UTC
not here lol we're still "basic"
John Nunns
@johnnunns
Jan 24 2017 05:14 UTC
@jdtdesigns yikes man trying to find the regex match words in mdn and not finding anything only character matches
@jdtdesigns
Jan 24 2017 05:25 UTC
@johnnunns It's very easy to match words
/(myWord)/g would be the regex
John Nunns
@johnnunns
Jan 24 2017 05:26 UTC
haha why isn't that the first thing I see after searching regex match words?
@jdtdesigns
Jan 24 2017 05:26 UTC
this is a good one for .match()
i just typed 'match a word regex' to test and it's the first response lol
@johnnunns
John Nunns
@johnnunns
Jan 24 2017 05:27 UTC
no way!
haha
@jdtdesigns
Jan 24 2017 05:28 UTC
yep
John Nunns
@johnnunns
Jan 24 2017 05:30 UTC
/\b($word)\b/i does that one work? JD Tadlock @jdtdesigns Jan 24 2017 05:32 UTC /(word)/g easy John Nunns @johnnunns Jan 24 2017 05:34 UTC function countWords(str) { str.split(' ') .reduce(function(result, word){ var regex = new Regexp(/word/g) },{}) return result how are we looking? @jdtdesigns JD Tadlock @jdtdesigns Jan 24 2017 05:35 UTC @johnnunns That won't work because the regex will only match the word 'word' ;) you need to create the expression using a string and concat the word into it new RegExp('expression', 'options') options would just be 'g' for this one John Nunns @johnnunns Jan 24 2017 05:36 UTC g is global? JD Tadlock @jdtdesigns Jan 24 2017 05:36 UTC and you don't need the two '/' in the expression string yes John Nunns @johnnunns Jan 24 2017 05:37 UTC I'm really not sure JD I only put /word/g in there because you said haha JD Tadlock @jdtdesigns Jan 24 2017 05:37 UTC /(word)/g is the expression to match 'word' Darth Skywalker @adityaparab Jan 24 2017 05:37 UTC @johnnunns g is global? g is global as in it will match all occurances. Otherwise, Reg Ex only matches first occurance. John Nunns @johnnunns Jan 24 2017 05:37 UTC so that would only match one word and we need it to match all the words JD Tadlock @jdtdesigns Jan 24 2017 05:38 UTC /(pickles)/g will match all the 'pickles' Darth Skywalker @adityaparab Jan 24 2017 05:38 UTC @johnnunns so that would only match one word No. That will only match a string word it won't match anything else. John Nunns @johnnunns Jan 24 2017 05:38 UTC right sorry that's what I mean so what regexp matches all the words together that match? Darth Skywalker @adityaparab Jan 24 2017 05:39 UTC the right regex for that is \w or [A-Za-z] the w in \w should be small capital W like \W will match nonword characters John Nunns @johnnunns Jan 24 2017 05:40 UTC var regex = new Regexp(\w, 'g') JD Tadlock @jdtdesigns Jan 24 2017 05:40 UTC so to create an expression using the RegExp object, you would do it like this var regex = new RegExp('(' + word + ')', 'g') John Nunns @johnnunns Jan 24 2017 05:41 UTC aha... JD Tadlock @jdtdesigns Jan 24 2017 05:41 UTC which outputs /(myword)/g John Nunns @johnnunns Jan 24 2017 05:41 UTC what's the reason for ' ' around ()? JD Tadlock @jdtdesigns Jan 24 2017 05:43 UTC you can't place the argument into the expression without string concatenation otherwise it will just match the exact word you put in that's the only reason you need to use the RegExp object otherwise you could just use straight regex John Nunns @johnnunns Jan 24 2017 05:45 UTC function countWords(str) { str.split(' ') .reduce(function(result, word){ var regex = new Regexp( '(' + word + ')', 'g') },{}) return result } fair enough! JD Tadlock @jdtdesigns Jan 24 2017 05:45 UTC lookin good but John Nunns @johnnunns Jan 24 2017 05:45 UTC ok so now we need to set the counter JD Tadlock @jdtdesigns Jan 24 2017 05:45 UTC result needs to be inide the callback inside* John Nunns @johnnunns Jan 24 2017 05:46 UTC so I don't need to return result outside? JD Tadlock @jdtdesigns Jan 24 2017 05:46 UTC result refers to object you are building inside the callback it needs to be returned inside John Nunns @johnnunns Jan 24 2017 05:47 UTC I thought it automatically did that in reduce I guess.. alright so the counter. result[word] = regex something something something JD Tadlock @jdtdesigns Jan 24 2017 05:48 UTC result[word] = .... ;) you're building result lol result starts as {} and inside the callback you build it with each value in the array passed to it so you split the string and reduce is iterating over each word each word is passed to the callback and you do something with the word and add it to the result object John Nunns @johnnunns Jan 24 2017 05:53 UTC so the values that we want to put inside it is the regex amounts regex.length? JD Tadlock @jdtdesigns Jan 24 2017 05:53 UTC that's where .match() comes into play you can use the regex you created to match the amount of those words ;) John Nunns @johnnunns Jan 24 2017 05:54 UTC haha I thought we matched them already? JD Tadlock @jdtdesigns Jan 24 2017 05:54 UTC the regex is just regex lol it needs to be used somehow John Nunns @johnnunns Jan 24 2017 05:55 UTC ok fair enough. so how about result[word] = str.match(regex)? .length h1tag @h1tag Jan 24 2017 05:56 UTC How do you create html elements using jquery? I found multiple ways on google, not sure which one is right. John Nunns @johnnunns Jan 24 2017 05:57 UTC it's definitely wrong after submitting haha, but a good try right ? man I hope my learning curve is at least on par with everyone else, this stuff is hard... @jdtdesigns JD Tadlock @jdtdesigns Jan 24 2017 05:57 UTC @johnnunns str.match(regex).length should work ;) John Nunns @johnnunns Jan 24 2017 05:57 UTC ok let me show you the whole thing then maybe error is somewhere else JD Tadlock @jdtdesigns Jan 24 2017 05:58 UTC you need to return result below the .match John Nunns @johnnunns Jan 24 2017 05:58 UTC function countWords(str) { str.split(' ') .reduce(function(result, word){ var regex = new Regexp( '(' + word + ')', 'g'); result[word] = str.match(regex).length return result; },{}) } countWords("hey whta updsls a dgfg s") JD Tadlock @jdtdesigns Jan 24 2017 05:58 UTC return str.split(' ')..... John Nunns @johnnunns Jan 24 2017 05:58 UTC ohh right Ritvars @RitvarsZ Jan 24 2017 05:58 UTC @fortMaximus I think that there is no wrong way. Use .append or .html or whatever fits your needs John Nunns @johnnunns Jan 24 2017 05:59 UTC Regexp is not defined JD Tadlock @jdtdesigns Jan 24 2017 05:59 UTC @fortMaximus var link =$('</ li>');
it's RegExp not Regexp
@johnnunns
John Nunns
@johnnunns
Jan 24 2017 06:00 UTC
passing 1 of 3!
pretty good! :) haha
h1tag
@h1tag
Jan 24 2017 06:01 UTC
@jdtdesigns then how do I add it to html file/code?
John Nunns
@johnnunns
Jan 24 2017 06:01 UTC
weird though man it's working just fine. But I'm failing at :
should_return_an_object_where_each_property_gives_a_word_in_the_string_with_its_number_of_appearances
should_return_an_object_empty_object_ifpassed
@jdtdesigns
Jan 24 2017 06:01 UTC
@fortMaximus sorry, that's 2.1
in version 3 just use $('h1'); @fortMaximus what are you trying to do? @johnnunns Show me some test cases they are passing to your function John Nunns @johnnunns Jan 24 2017 06:03 UTC found the error not sure how to fix 'ask a bunch get a bunch' returns - { ask: 1, a: 3, bunch: 2, get: 1 } so it's returning 'a' 3 times JD Tadlock @jdtdesigns Jan 24 2017 06:04 UTC correct cause a is a word and it's in there 3 times :D o wait 2 times h1tag @h1tag Jan 24 2017 06:04 UTC @jdtdesigns I'm on the Wiki Viewer project, and I want add the links I get from the response (links to wiki pages) from the API to the html file as paragraphs or list elements John Nunns @johnnunns Jan 24 2017 06:07 UTC yeah weird right? @jdtdesigns JD Tadlock @jdtdesigns Jan 24 2017 06:12 UTC @johnnunns Here's a way to overcome that bug var regex = new RegExp('(' + word + ')', 'g'), amount = str.match(regex).length, output = amount < 2 ? amount : word.length < 2 ? amount - 1 : amount; John Nunns @johnnunns Jan 24 2017 06:12 UTC how'd you go about figuring that out? JD Tadlock @jdtdesigns Jan 24 2017 06:13 UTC coded it out just now :D John Nunns @johnnunns Jan 24 2017 06:13 UTC I want to know the thought process behind it JD Tadlock @jdtdesigns Jan 24 2017 06:13 UTC did it work? that's the first question lol John Nunns @johnnunns Jan 24 2017 06:14 UTC amount is not defined JD Tadlock @jdtdesigns Jan 24 2017 06:15 UTC result[word] = output; John Nunns @johnnunns Jan 24 2017 06:17 UTC function countWords(str) { if(str.length===0){ return {}; } return str.split(' ') .reduce(function(result, word){ var regex = new RegExp( '(' + word + ')', 'g'); output = amount < 2 ? amount : word.length < 2 ? amount - 1 : amount; result[word] = output return result; },{}) } countWords("ask a bunch get a bunch") still says amount is not defined JD Tadlock @jdtdesigns Jan 24 2017 06:18 UTC @fortMaximus this is a typical way of first clearing the old results then adding the new: var output =$('.output');

output.empty();

output.append(
'<h3>' + data.title + '</h3>' +
'<p>' + data.content + '</p>' +
'</a>'
);
the append would be in the data iteration of course
you would loop through the returned object and append each link
@johnnunns You left this line out that goes above output = amount....
 amount = str.match(regex).length,
you don't need the if (str.length.....) line
the reduce will return an empty object if the string is empty automagically
John Nunns
@johnnunns
Jan 24 2017 06:23 UTC
that one works!
yeah added it just so I could pass one of the tests it wasnt passing
yeah still it actually doesnt work without if statement
{ '': 1 }
it's counting
Abdijabar Yussuf Mohamed
@aymohamed
Jan 24 2017 06:24 UTC
Any hint on how I can better show "my copyright " and link my tribute page to an external website
@jdtdesigns
Jan 24 2017 06:25 UTC
have you looked up ternaries yet? @johnnunns
John Nunns
@johnnunns
Jan 24 2017 06:25 UTC
nope I will though
@jdtdesigns
Jan 24 2017 06:26 UTC
that's what i'm using to do that ? blah : something
those are called ternary expressions
it's just a shortcut way of doing if/else
condition ? true : false
that's how it works
Abdijabar Yussuf Mohamed
@aymohamed
Jan 24 2017 06:28 UTC
Any hint on how I can better show "my copyright " and link my tribute page to an external website : https://codepen.io/aymohamed/pen/egWgmQ
@jdtdesigns
Jan 24 2017 06:28 UTC
lol @aymohamed
Abdijabar Yussuf Mohamed
@aymohamed
Jan 24 2017 06:29 UTC
does that mean I use a div class ?
@jdtdesigns
Jan 24 2017 06:30 UTC
and use that class in the css
Abdijabar Yussuf Mohamed
@aymohamed
Jan 24 2017 06:30 UTC
Ok. Let me try that and I will get back to you. @ JD Tadlock. Thanks
@jdtdesigns, can the wrapper class have any name or just "container" etc?
@jdtdesigns
Jan 24 2017 06:34 UTC
it can be any name @aymohamed
they need to be space separated
<div class="my-class row another-class one-more"></div>
Abdijabar Yussuf Mohamed
@aymohamed
Jan 24 2017 06:37 UTC
Ok. Thanks @jdtdesigns .I am doing that now
CamperBot
@camperbot
Jan 24 2017 06:37 UTC
aymohamed sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
h1tag
@h1tag
Jan 24 2017 06:38 UTC
@jdtdesigns Thank you for help and spending the time writing the code :smile: Although I didn't ask about the "clearing" part but you knew I'm gonna' ask about later, right? ;) :p
CamperBot
@camperbot
Jan 24 2017 06:38 UTC
fortmaximus sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
h1tag
@h1tag
Jan 24 2017 06:39 UTC
and thanks @RitvarsZ
CamperBot
@camperbot
Jan 24 2017 06:39 UTC
fortmaximus sends brownie points to @ritvarsz :sparkles: :thumbsup: :sparkles:
@jdtdesigns
Jan 24 2017 06:39 UTC
@fortMaximus right ;)
@johnnunns To fix the result outputting an object with a space, you can just return this inside the reduce callback instead
return str ? result : {}
abhijith shenoy
@shenoyabhijith
Jan 24 2017 06:57 UTC
whats wrong with my weather app
it was working f9 till yesterday
Abdijabar Yussuf Mohamed
@aymohamed
Jan 24 2017 07:03 UTC
Please let me know what y'all think of this : https://codepen.io/aymohamed/pen/egWgmQ
Constructive criticism is welcomed
Suggestions for what I can add or subtract is highly appreciated
abhijith shenoy
@shenoyabhijith
Jan 24 2017 07:10 UTC
@aymohamed u could use some bullet points !
just my opinion
defc0de
@defc0de
Jan 24 2017 07:20 UTC
anybody around?
Vasile Botnaru
@VasileBotnaru
Jan 24 2017 07:21 UTC
@defc0de !
defc0de
@defc0de
Jan 24 2017 07:21 UTC
oh hi there!
Vasile Botnaru
@VasileBotnaru
Jan 24 2017 07:21 UTC
hey
defc0de
@defc0de
Jan 24 2017 07:21 UTC
do you guys experience crashing with the gitter app?
im on ubuntu 14 and it crashes most of the time
Vasile Botnaru
@VasileBotnaru
Jan 24 2017 07:21 UTC
hmm no, ubuntu 16
defc0de
@defc0de
Jan 24 2017 07:22 UTC
hmm weird. ok thanks for letting me know!
Vasile Botnaru
@VasileBotnaru
Jan 24 2017 07:23 UTC
welcome
Abdijabar Yussuf Mohamed
@aymohamed
Jan 24 2017 07:25 UTC
@shenoyabhijith , Please take a look now after I added the bullet list
abhijith shenoy
@shenoyabhijith
Jan 24 2017 07:26 UTC
:+1:
@aymohamed
Vasile Botnaru
@VasileBotnaru
Jan 24 2017 07:26 UTC
@aymohamed type="circle" ???
remove it
Abdijabar Yussuf Mohamed
@aymohamed
Jan 24 2017 07:27 UTC
@VasileBotnaru , what should I replace with lol
there is no type "bullet"
Also @shenoyabhijith , there are some spaces that the circle/bullet appears and there is no content that I put. Is it possible to specify only for lines of the list that have content/
Vasile Botnaru
@VasileBotnaru
Jan 24 2017 07:29 UTC
you could use an <ul>, but I'm talking about the type="circle" showing on the page
@aymohamed
right below the Timeline
Abdijabar Yussuf Mohamed
@aymohamed
Jan 24 2017 07:30 UTC
I mean, @VasileBotnaru , do you think it looks better with no type "circle"
as in type = "none"?
Vasile Botnaru
@VasileBotnaru
Jan 24 2017 07:32 UTC
@aymohamed It looks ok the way it is right now, you're the one who has to like it
Sung Guk Lee
@katsuya245126
Jan 24 2017 07:32 UTC
Hey guys!
Vasile Botnaru
@VasileBotnaru
Jan 24 2017 07:32 UTC
@katsuya245126 hi
Abdijabar Yussuf Mohamed
@aymohamed
Jan 24 2017 07:32 UTC
lool
Sung Guk Lee
@katsuya245126
Jan 24 2017 07:32 UTC
What's the basic template for a website? Like html>header>body>container, etc
I'm trying to use bootstrap grids but I don't know how to start
Vasile Botnaru
@VasileBotnaru
Jan 24 2017 07:33 UTC
@katsuya245126 codepen or not?
Sung Guk Lee
@katsuya245126
Jan 24 2017 07:33 UTC
codepen
trying to make a portfolio
made good progress but decided to start over
Vasile Botnaru
@VasileBotnaru
Jan 24 2017 07:34 UTC
Sung Guk Lee
@katsuya245126
Jan 24 2017 07:34 UTC
oh yeah I know that
Vasile Botnaru
@VasileBotnaru
Jan 24 2017 07:34 UTC
Sung Guk Lee
@katsuya245126
Jan 24 2017 07:34 UTC
just as an example
Vasile Botnaru
@VasileBotnaru
Jan 24 2017 07:36 UTC
<html>
<body>

<div class="container">
...
</div>

</body>
</html>
@katsuya245126
Sung Guk Lee
@katsuya245126
Jan 24 2017 07:38 UTC
so the container is everything you see on the page right?
Vasile Botnaru
@VasileBotnaru
Jan 24 2017 07:39 UTC
the body is what you see on the page
Khang Duy
@KD158
Jan 24 2017 07:39 UTC
<body></body> is everything you see on page
Vasile Botnaru
@VasileBotnaru
Jan 24 2017 07:39 UTC
but the container is in the body
@katsuya245126
Sung Guk Lee
@katsuya245126
Jan 24 2017 07:50 UTC
why do you need a container?
Sung Guk Lee
@katsuya245126
Jan 24 2017 07:56 UTC
I just don't know what other containers I should make after <div class="container-fluid">
Joel Santos
@St3ps
Jan 24 2017 08:46 UTC

Hello everyone! Anyone out there could give a rather broad insight on how to approach building a website, a sort of landing page, in this manner?
http://www.buildinamsterdam.com/

The main features i'm intending to capture are the style of the page transitions.
I was refered I could approach this with Angular UI, but i'm looking for a second opinion

Kushagra Gour
@chinchang
Jan 24 2017 08:56 UTC
Since all of us are here to learn web development, I think this can prove super useful for everyone to tryout and experiment things as you learn them -> https://kushagragour.in/lab/web-maker
Its a web playground that even works offline!
Kasmin Fernandes
@Kasmin23
Jan 24 2017 09:07 UTC
hello everyone. Is this group particularly for a challenge or the whole programme?
8i meant this room
*i meant this room
Joel Santos
@St3ps
Jan 24 2017 09:09 UTC
@Kasmin23 I feel you can always ask things in a general way, even if it's not strictly related to what the room is about, but the content of concern in his room is the frontend part of the programme
so, css, html
js i guess although theres a room for that
Coy Sanders
@coymeetsworld
Jan 24 2017 09:23 UTC
heres a list of rooms with their general purpose @Kasmin23 https://forum.freecodecamp.com/t/free-code-camp-official-chat-rooms/19390
this chatroom is generally for FrontEnd project help, but you can ask other questions here it's just they may be better suited in other rooms.
Chris Cullen
@123xylem
Jan 24 2017 09:43 UTC

## Jquery%20Bootstrap%20JS%20CDNs.html:5 GET file://netdna.bootstrapcdn.com/font-awesome/3.2.1/css/font-awesome.css net::ERR_FILE_NOT_FOUND

Im getting these errors when I try to put a fontawesome icon in my website.. However I added the cdns provided in the head secton lie they tell me to.. How do i fix?

My code

<!DOCTYPE html>
<html>
<title>Gallery</title>
</head>
Sorin Ruse
@sorinr
Jan 24 2017 09:50 UTC
@123xylem look into this https://www.bootstrapcdn.com/ for linking bootstrap
@123xylem and to this https://www.bootstrapcdn.com/fontawesome/ for fontawesome
Chris Cullen
@123xylem
Jan 24 2017 09:52 UTC
@sorinr thanks.. i was usng an old fontawesome cdn
CamperBot
@camperbot
Jan 24 2017 09:52 UTC
:star2: 1133 | @sorinr |http://www.freecodecamp.com/sorinr
123xylem sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
Sorin Ruse
@sorinr
Jan 24 2017 09:52 UTC
@123xylem and load first bootstrap and after fa
Chris Cullen
@123xylem
Jan 24 2017 09:52 UTC
@sorinr i have it loaded up now but they still wont show
Sorin Ruse
@sorinr
Jan 24 2017 09:53 UTC
are u on codepen?
or u develop locally on your pc? @123xylem
Chris Cullen
@123xylem
Jan 24 2017 09:58 UTC
@sorinr pc
@sorinr when i inspect the fontawesome it shows its there but doesnt really say anything
top 3 things under my font awesome inspection
element.style {
}
• {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
user agent stylesheet
i, cite, em, var, address, dfn {
font-style: italic;
}
Sorin Ruse
@sorinr
Jan 24 2017 10:01 UTC
@123xylem in order to see the fa working is to put an <i class="fa fa-icon name u want"></i> on the page
Chris Cullen
@123xylem
Jan 24 2017 10:02 UTC
@sorinr yeai have that
<h1> <i class="fa fa-camera-retro" aria-hidden="true"></i> Image Gallery</h1>
it shows on the page when i inspect
but doesnt do anyting
Sorin Ruse
@sorinr
Jan 24 2017 10:03 UTC
@123xylem don't u see the fa-camera-retro icon?
Chris Cullen
@123xylem
Jan 24 2017 10:04 UTC
@sorinr no
the code is there
when i inspect it shows aswell
but the code does nothing
Sorin Ruse
@sorinr
Jan 24 2017 10:05 UTC
@123xylem go to devtools.->sources and look for the libs if they have been loaded
Chris Cullen
@123xylem
Jan 24 2017 10:16 UTC
unsplash is there
cant see fontawesome
Sorin Ruse
@sorinr
Jan 24 2017 10:18 UTC
Chris Cullen
@123xylem
Jan 24 2017 10:21 UTC
<!DOCTYPE html>
<html>

<title>Gallery</title>

<style>
.fa fa-camera-retro{
width:30px;
height:20px;}
.standard{width: 100%;
height:200px;}
.jumbotron{
background-color:#ccc;
color:#2c3e50;
}
.navbar-inverse{
background:#2c3e50;

}
.navbar-inverse .navbar-nav>.active>a, .navbar-inverse .navbar-nav>.active>a:focus, .navbar-inverse .navbar-nav>.active>a:hover{
background:#2c3e50;
}
}
.navbar-inverse .navbar-brand {
color: white;
}
.navbar-inverse .navbar-nav>li>a {
color: white;
}

</style>
<body>

<nav class="navbar navbar-inverse navbar-fixed-top">
<div class="container-fluid">
<!-- Brand and toggle get grouped for better mobile display -->
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="#"> <span class="glyphicon glyphicon-picture"></span> Images</a>

</div>

<!-- Collect the nav links, forms, and other content for toggling -->
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<ul class="nav navbar-nav">
<li class="active"><a href="#">Home <span class="sr-only">(current)</span></a></li>
<li><a href="#">Contact</a></li>

</ul>
<ul class="nav navbar-nav  navbar-right active">   <li ><a href="#">Login </a></li>
</ul>
</div><!-- /.navbar-collapse -->
</div><!-- /.container-fluid -->
</nav>

<div class="container">
<div class="jumbotron">

<h1> <i class="fa fa-camera-retro" aria-hidden="true"></i>
Image Gallery</h1>

</div>

<script   src="https://code.jquery.com/jquery-3.1.1.min.js" </script>
<script src="https://maxcdn.bootstrapcdn.com/bootstr
That is my site
rap/3.3.7/js/bootstrap.min.js"</script>
</body>
</html>
@sorinr
With that at the end
alpox
@alpox
Jan 24 2017 10:22 UTC
You close it before
@123xylem
Move the </head> down to right before <body>
Chris Cullen
@123xylem
Jan 24 2017 10:23 UTC
@alpox thanks but no worky
CamperBot
@camperbot
Jan 24 2017 10:23 UTC
123xylem sends brownie points to @alpox :sparkles: :thumbsup: :sparkles:
Sorin Ruse
@sorinr
Jan 24 2017 10:24 UTC
@123xylem this is wrong <link rel="stylesheet" href="path/to/font-awesome/css/font-awesome.min.css">
alpox
@alpox
Jan 24 2017 10:24 UTC
Also your link to fontawesome is wrong: <link rel="stylesheet" href="path/to/font-awesome/css/font-awesome.min.css">
Try <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
Sorin Ruse
@sorinr
Jan 24 2017 10:24 UTC
@123xylem and load it after bootstrap
Chris Cullen
@123xylem
Jan 24 2017 10:25 UTC
@sorinr @alpox YES
@sorinr @alpox thanks
CamperBot
@camperbot
Jan 24 2017 10:25 UTC
123xylem sends brownie points to @sorinr and @alpox :sparkles: :thumbsup: :sparkles:
:warning: 123xylem already gave alpox points
:warning: 123xylem already gave sorinr points
Chris Cullen
@123xylem
Jan 24 2017 10:25 UTC
I used the cdn that fontawesome had on their site i htink

Using CSS
Copy the entire font-awesome directory into your project.

Check out the examples to start using Font Awesome!
THATS WHAT I COPIED

not sure why it didnt work
or why there href is like that
alpox
@alpox
Jan 24 2017 10:26 UTC
@123xylem Well look at the path. They just wanted to tell you that you have to link to your own copy of the css on your disk
Riccardo M. Pesce
@RiccardoMPesce
Jan 24 2017 10:28 UTC
Guys I have a doubt.
When I select say img[src] in css, it will only select all the imgs which has the src attribute, right?
And not img without src
alpox
@alpox
Jan 24 2017 10:30 UTC
@RiccardoMPesce Yes
Riccardo M. Pesce
@RiccardoMPesce
Jan 24 2017 10:30 UTC
Thanks @alpox
CamperBot
@camperbot
Jan 24 2017 10:30 UTC
riccardompesce sends brownie points to @alpox :sparkles: :thumbsup: :sparkles:
alpox
@alpox
Jan 24 2017 10:30 UTC
@RiccardoMPesce You can read more here: http://www.w3schools.com/css/css_attribute_selectors.asp
Riccardo M. Pesce
@RiccardoMPesce
Jan 24 2017 10:31 UTC
I better advise mdn over shay howe and w3schools
MDN is very coincisive
alpox
@alpox
Jan 24 2017 10:32 UTC
@RiccardoMPesce Right, i prefer MDN too. Because its specific and defining.
I heard here a lot though that people didn't understand MDN because they didn't have the terminology knowledge yet so it was too complicated.
So i sometimes show w3schools here :-)
Riccardo M. Pesce
@RiccardoMPesce
Jan 24 2017 10:33 UTC
@alpox I think mdn covers less topics. But it does cover them completely
alpox
@alpox
Jan 24 2017 10:33 UTC
@RiccardoMPesce MDN just covers the exact web API whereas w3schools etc. also define some other stuff around web
Vasile Botnaru
@VasileBotnaru
Jan 24 2017 10:36 UTC
how much did it take you to finish your portfolio?
alpox
@alpox
Jan 24 2017 10:36 UTC
@VasileBotnaru I can only refer to what i heard here already, but its usually a lot :-) people invest a load and quite some days into their portfolio
Vasile Botnaru
@VasileBotnaru
Jan 24 2017 10:37 UTC
it feeld daunting
alpox
@alpox
Jan 24 2017 10:38 UTC
@VasileBotnaru I'm not of importance in a comparison since i did web dev for quite some time already and don't actually need ffc. I'm here to help only :-)
I did the portfolio though.
But i didn't take long time for details in styling etc. :D
@VasileBotnaru I know that development sometimes or even often can feel daunting. You'll have to get your head around that and not think too much about it. Just try to go on and find your resources, and when something doesn't work out, ask here :-)
Its even usual that it can happen that you're stuck with one single problem for some days when it works out badly
I think every programmer experiences that
I remember times when i went to work and changed only 1 line of code by the end of the day because i was just looking for the issue - changing code - rollback. change code - rollback.
Vasile Botnaru
@VasileBotnaru
Jan 24 2017 10:42 UTC
@alpox The thing is I don't know how to approach the task, do I have to know how to do it and then start doing, do I have to do while I see others code, do I have to understand that code well from the beggining, or I can go on without thinking too much about it, that's my problem.
alpox
@alpox
Jan 24 2017 10:43 UTC
@VasileBotnaru Last one :-)
Vasile Botnaru
@VasileBotnaru
Jan 24 2017 10:43 UTC
you mean i can borrow code, without understanding it?
just so i can perform the task?
@alpox
alpox
@alpox
Jan 24 2017 10:44 UTC
@VasileBotnaru Best thing, as i stated earlier, is that you just have to get going. Usually just learning doesn't help you that much because in development you ALWAYS have special cases. This means that you are always learning while coding.
Best and easiest to learn programming / web dev, is to just jump into something you want to do and do it, no matter you have no idea about the matter
@VasileBotnaru No, not borrowing code without understanding it. Rewrite code you find yourself (No copy), try to change the code in some ways and see the result. That makes you understand what it does
While doing so, just try to bend the code you find somewhere to do something else/similar. For that you can also look into other sources.
This is the way i'm always going when learning something new
Vasile Botnaru
@VasileBotnaru
Jan 24 2017 10:47 UTC
@alpox I see, thank you
CamperBot
@camperbot
Jan 24 2017 10:47 UTC
vasilebotnaru sends brownie points to @alpox :sparkles: :thumbsup: :sparkles:
Vasile Botnaru
@VasileBotnaru
Jan 24 2017 10:47 UTC
@alpox what do you think about it?
alpox
@alpox
Jan 24 2017 10:49 UTC
@VasileBotnaru hmm hint: remove all the html, body, head tags from the html and put everything what was in head in the settings under stuff for head
It was right like this, but that's a codepen speciality that it doesn't like to have these tags in the html part because it creates them itself
@VasileBotnaru Its good so far :-) you can try to put the links more centered and sticking to the right
Vasile Botnaru
@VasileBotnaru
Jan 24 2017 10:50 UTC
alpox
@alpox
Jan 24 2017 10:51 UTC
@VasileBotnaru Hmm actually i think that its your title picture which makes the nav bar grow too much
The bootstrap navbar usually takes an exact height
Vasile Botnaru
@VasileBotnaru
Jan 24 2017 10:52 UTC
@alpox wait I don't get it, you mean centered vertically?
alpox
@alpox
Jan 24 2017 10:53 UTC
@VasileBotnaru yes

What i see it that you mix quite some bootstrap and your own css @VasileBotnaru

If you want to go with bootstrap, you should probably stick to their exact rules and elements which work together. (It doesn't like mixes)
If you want to go with your own css (Makes your page more unique), you should better take out bootstrap and don't use their elements

Thats because bootstrap works best with its own elements.
The navbar they define, needs a setup like shown here:
http://getbootstrap.com/components/#navbar
Vasile Botnaru
@VasileBotnaru
Jan 24 2017 10:56 UTC
so that would be the general rule - don't use your own css alongside with bootstrap?
alpox
@alpox
Jan 24 2017 10:56 UTC
@VasileBotnaru You can use it - if you know what you're doing.
I see lots of people having a hard time because of this here ^^
Vasile Botnaru
@VasileBotnaru
Jan 24 2017 10:56 UTC
but since I'm a beginner - i don't - so don't
alpox
@alpox
Jan 24 2017 10:57 UTC
There are certain unspoken rules in bootstrap - like if you use an element with a class row - The next inner element should always be a col-x-x (Some column)
Otherwise you get some artifacts like unwanted padding/margins
Vasile Botnaru
@VasileBotnaru
Jan 24 2017 10:58 UTC
well yeah they teach you this in the courses
i mean fcc
alpox
@alpox
Jan 24 2017 10:58 UTC
@VasileBotnaru I don't think i can tell you exactly what you'd better use. Its hard to make a page with all your own css as a beginner. But its also hard to stick to all rules bootstrap set you up.
@VasileBotnaru Well, they don't teach you everything about it there. Like they don't show you what exact structure a navbar needs
And where own css doesn't mess it up
Maybe someone else here could tell what's easier as a beginner here :-) i cannot tell much
Anyone? :-)
Vasile Botnaru
@VasileBotnaru
Jan 24 2017 11:00 UTC
:D
alpox
@alpox
Jan 24 2017 11:00 UTC
Well, i think i would prefer own css... takes longer to create it but you learn much more
Vasile Botnaru
@VasileBotnaru
Jan 24 2017 11:00 UTC
who's an expert but understand the point of view of a beginner?
:D
alpox
@alpox
Jan 24 2017 11:00 UTC
Yea thats always the thing ;-)
I'm not sure i can still see through the eyes of a beginner much
Vasile Botnaru
@VasileBotnaru
Jan 24 2017 11:03 UTC
@alpox can you make a nav bar on your own, without help?
alpox
@alpox
Jan 24 2017 11:03 UTC
@VasileBotnaru Yup
Vasile Botnaru
@VasileBotnaru
Jan 24 2017 11:03 UTC
@alpox cool
so you always have to use ul for it?
<ul>
alpox
@alpox
Jan 24 2017 11:04 UTC
Have to? No... You can do things in a lot of different ways usually
Vasile Botnaru
@VasileBotnaru
Jan 24 2017 11:04 UTC
I see
alpox
@alpox
Jan 24 2017 11:04 UTC
But usually, an ul defines an unordered list with bullet points
So without bootstrap or anything you have to care yourself about getting rid of the bullet points and make the elements show up horizontally instead of vertically
thats like
ul li {
list-style-type: none; // No bullet points
display: inline-block; // Show horizontally
}
As example
Usually there is also some margin or padding defined on the left side which one can get rid of etc.
You have to do such tweaks until you get there, but it teaches you some things on the way
Vasile Botnaru
@VasileBotnaru
Jan 24 2017 11:07 UTC
@alpox thank you
CamperBot
@camperbot
Jan 24 2017 11:07 UTC
vasilebotnaru sends brownie points to @alpox :sparkles: :thumbsup: :sparkles:
:warning: vasilebotnaru already gave alpox points
alpox
@alpox
Jan 24 2017 11:07 UTC
So, i think i'll be afk for some time
@VasileBotnaru No problem :-)
David Griffin
@dgriffin123
Jan 24 2017 11:51 UTC
Anyone willing to help me with an issue that's driving me insane?
Sorin Ruse
@sorinr
Jan 24 2017 11:54 UTC
@dgriffin123 whats the issue?
David Griffin
@dgriffin123
Jan 24 2017 11:54 UTC
Should I give a link to my codepen so I can explain my problem easier?
@sorinr
Sorin Ruse
@sorinr
Jan 24 2017 11:55 UTC
@dgriffin123 better. this way i can see the behaviour
David Griffin
@dgriffin123
Jan 24 2017 11:55 UTC
that's the project. I know its ugly as hell, but my images aren't lining up right. Several aren't even working on mobile either but just fixing the alignment of them would be awesome.
Sorin Ruse
@sorinr
Jan 24 2017 11:56 UTC
@dgriffin123 what is the problem?
David Griffin
@dgriffin123
Jan 24 2017 11:56 UTC
I looked up fixes for the alignment but they involved things much more advanced than what I've learned yet, using javascript etc
Jan 24 2017 11:57 UTC
how can i execute a function on key press from keyboard without jquery using simple JS.
@sorinr
alpox
@alpox
Jan 24 2017 11:59 UTC
someDOMObject.addEventListener("keypress", function() { ... });
Jan 24 2017 11:59 UTC
@alpox so how can i get that which key is pressed?
alpox
@alpox
Jan 24 2017 12:03 UTC
someDOMObject.addEventListener("keypress", function(keyEvent) {
if(keyEvent.key === 'a') {
// Key a is pressed
}
});
Jan 24 2017 12:04 UTC
@alpox Thanks
CamperBot
@camperbot
Jan 24 2017 12:04 UTC
mohammadhasham sends brownie points to @alpox :sparkles: :thumbsup: :sparkles:
alpox
@alpox
Jan 24 2017 12:04 UTC
https://codepen.io/pen/?editors=1010
Jan 24 2017 12:04 UTC
@alpox Thanks
CamperBot
@camperbot
Jan 24 2017 12:04 UTC
mohammadhasham sends brownie points to @alpox :sparkles: :thumbsup: :sparkles:
alpox
@alpox
Jan 24 2017 12:04 UTC
Sorin Ruse
@sorinr
Jan 24 2017 12:04 UTC
@dgriffin123 take a look at the example . this is what u want?
David Griffin
@dgriffin123
Jan 24 2017 12:07 UTC
Yeah that seems to be what I wanted. They're all the same height.
img {
max-height: 216px;
margin: 0 auto;
}
Sorin Ruse
@sorinr
Jan 24 2017 12:10 UTC
@dgriffin123 yes. because the last image was smaller height then the othersi put max-height: 216px as the last one. you can also add class="img-responsive" to each of your img tags so they scale well on lower screens
David Griffin
@dgriffin123
Jan 24 2017 12:11 UTC
hmm. Well I really appreciate your help with that. I feel like I get stuck on the dumbest things.
Sorin Ruse
@sorinr
Jan 24 2017 12:12 UTC
@dgriffin123 its quite ok for the beginning
Milos Ratkovic
Jan 24 2017 12:19 UTC
guys anyone knows a good weather API, I made a weather app like a week ago , and now i got an email from OpenWeather that my API got blocked.
Sorin Ruse
@sorinr
Jan 24 2017 12:21 UTC
@Shadow032 there is also apixu.com, wunderground and some others. as soon as i remember i'll tell you
Milos Ratkovic
Jan 24 2017 12:22 UTC
@sorinr thanks, i'll google it out.
CamperBot
@camperbot
Jan 24 2017 12:22 UTC
shadow032 sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
:star2: 1134 | @sorinr |http://www.freecodecamp.com/sorinr
Sorin Ruse
@sorinr
Jan 24 2017 12:22 UTC
David Griffin
@dgriffin123
Jan 24 2017 12:23 UTC
@sorin I hate to bother you, but I can't seem to figure out how to fix these issues. Your solution fixed the height, but there are a couple that have different widths. I tried messing with max-width but I can't figure out why it isn't getting the effect I want.
It's very frustrating
Sorin Ruse
@sorinr
Jan 24 2017 12:27 UTC
@dgriffin123 no need for max-width because you have the imgs placed into <div class="col-xs-6"> so they take the full width of of this col-xs-6 div. to mee they seem to have same width and height
David Griffin
@dgriffin123
Jan 24 2017 12:29 UTC
the only one with a different width was the Dark Souls pic, it is slightly wider than the one under it
Maybe that's just my display or something
Jarvis1247
@Jarvis1247
Jan 24 2017 12:31 UTC
m getting this: CORS header ‘Access-Control-Allow-Origin’ missing
What to do?
Sorin Ruse
@sorinr
Jan 24 2017 12:32 UTC
@dgriffin123 no no. u r right. the breaking bad is less wider then all the others. let me think
David Griffin
@dgriffin123
Jan 24 2017 12:32 UTC
Honestly though @sorin I think I need to just move past it lol. I've been obsessing over those damn pictures not being exactly 100% the same I haven't moved on in like 2 days lol
Jarvis1247
@Jarvis1247
Jan 24 2017 12:33 UTC
any solution to my prob??
Sorin Ruse
@sorinr
Jan 24 2017 12:34 UTC
@dgriffin123 no. just add width: 100%; in css to img selector
@Jarvis1247 can u share the pen link to see what causing it?
David Griffin
@dgriffin123
Jan 24 2017 12:36 UTC
@sorinr Such an easy fix, can't believe I didn't think of that. Thank you again
CamperBot
@camperbot
Jan 24 2017 12:36 UTC
dgriffin123 sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
:star2: 1135 | @sorinr |http://www.freecodecamp.com/sorinr
Jarvis1247
@Jarvis1247
Jan 24 2017 12:36 UTC
i am working on my text editor @dgriffin123
Sorin Ruse
@sorinr
Jan 24 2017 12:37 UTC
@dgriffin123 yes but now you have the same problem of height with dexter img. try to find another one bigger then that
David Griffin
@dgriffin123
Jan 24 2017 12:38 UTC
@sorin I actually decided to change it to 2 rows instead of 3, and all the images seem to look good
Jan 24 2017 12:39 UTC
which one is better document.getElementById('') or document.quereySelector()
@sorinr
Sorin Ruse
@sorinr
Jan 24 2017 12:40 UTC
@dgriffin123 nope . they are all same width but on 2nd row the first and the last are shorter in height
@MohammadHasham getbyid if the tag has an id.
David Griffin
@dgriffin123
Jan 24 2017 12:42 UTC
jeez. you're right. How do you avoid these problems? Should I crop images before I even use them?
Sorin Ruse
@sorinr
Jan 24 2017 12:43 UTC
@dgriffin123 yep. better to have them same dimensions
David Griffin
@dgriffin123
Jan 24 2017 12:44 UTC
@sorinr I see. 'll have to do that, this is too much of a hassle. Thank you so much for the help and for being patient.
CamperBot
@camperbot
Jan 24 2017 12:44 UTC
dgriffin123 sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
:warning: dgriffin123 already gave sorinr points
Sorin Ruse
@sorinr
Jan 24 2017 12:45 UTC
@dgriffin123 np
Jan 24 2017 12:58 UTC
<p onclick = "name()" id="para">
Hello
</p>
$(document).ready(function(){ function name(){ document.getElementById("para").innerHTML = "wow"; } }); why is it not working? @sorinr Sander Berntsen @sbxn14 Jan 24 2017 13:01 UTC I know this is cheating but can someone answer something for me? I got super lost on what to do so I took a look at the example but in the example it refers to data alot in the js/angular. I dont see Data defined anywhere? what is it referring to? http://codepen.io/freeCodeCamp/pen/bELRjV Sorin Ruse @sorinr Jan 24 2017 13:03 UTC @MohammadHasham you don't need the doc.ready just function name(){} Muhammad Hasham @MuhammadHasham23 Jan 24 2017 13:03 UTC @sorinr Thanks CamperBot @camperbot Jan 24 2017 13:03 UTC mohammadhasham sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles: :star2: 1136 | @sorinr |http://www.freecodecamp.com/sorinr Sander Berntsen @sbxn14 Jan 24 2017 13:03 UTC as I now know how to actually refer to my ip api and my weather api I still dont know what its doing exactly, and I'd like to know that so I can learn from it Sorin Ruse @sorinr Jan 24 2017 13:06 UTC @sbxn14 the ip api callreturns you the city that you are using later in constructing the url for the weather api to retrieve thge weather for that city Sander Berntsen @sbxn14 Jan 24 2017 13:07 UTC so the$scope.data refers to the api's?
Sorin Ruse
@sorinr
Jan 24 2017 13:12 UTC
@sbxn14 the $scope.data its like defining local variables available only for ng-app. this is the way you refer variables in an angular app Sander Berntsen @sbxn14 Jan 24 2017 13:14 UTC yea I knew that but I was just wondering as it referred to data.something and I didnt see data defined anywhere Sorin Ruse @sorinr Jan 24 2017 13:16 UTC @sbxn14 with this$scope.Data = {}; its like var myvarr = {}; then you add keys and values to it like myvarr.city = responsefromapi.city and so on
Sander Berntsen
@sbxn14
Jan 24 2017 13:17 UTC
thanks @sorinr
CamperBot
@camperbot
Jan 24 2017 13:17 UTC
:star2: 1137 | @sorinr |http://www.freecodecamp.com/sorinr
sbxn14 sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
Sander Berntsen
@sbxn14
Jan 24 2017 13:17 UTC
oo im dumb
Sorin Ruse
@sorinr
Jan 24 2017 13:18 UTC
@sbxn14 welcome
Bikal Khawas
@bikalkhawas
Jan 24 2017 13:30 UTC
Hello, I'am working in local weather app and in calling weather API I found both min and max temperature the same, here is my codepen link http://codepen.io/bikal/pen/OWmJMj?editors=1010 Any help will be appreciated, thank you.
bwongcodes
@bwongcodes
Jan 24 2017 13:41 UTC
Hello, just wondering if anyone knew how i could make my text non transparent
https://codepen.io/bwongcodes/pen/egROdR
appreciate the help, thankyou!
Sorin Ruse
@sorinr
Jan 24 2017 13:42 UTC
@bikalkhawas if you console.table(apiData) you will see they are slightly different but because of the mathround function you see same values
Bikal Khawas
@bikalkhawas
Jan 24 2017 13:54 UTC
@sorinr on calling API directly in browser also raw data looks the same.Looks like there is no need to mention min and max temperature.
Sorin Ruse
@sorinr
Jan 24 2017 13:55 UTC
@bikalkhawas for me there is only 0.6 degree of difference
Bikal Khawas
@bikalkhawas
Jan 24 2017 13:56 UTC
:smile:
Sorin Ruse
@sorinr
Jan 24 2017 13:58 UTC
@bwongcodes use background: rgba(0,0,0,.5); instead of opacity: 0.5
bwongcodes
@bwongcodes
Jan 24 2017 13:59 UTC
Thankyou @sorinr
CamperBot
@camperbot
Jan 24 2017 13:59 UTC
:star2: 1138 | @sorinr |http://www.freecodecamp.com/sorinr
bwongcodes sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
Sorin Ruse
@sorinr
Jan 24 2017 14:01 UTC
@bwongcodes welcome
Jan 24 2017 14:15 UTC
var key = document.querySelector("audio[data-key=${x}]"); why is this not working my html is <audio data-key="65" src="E:\Web Development\Javascript 30\Drumkit Challenge\boom.wav"></audio> @sorinr anyone there? Clyde Lobo @oppiniated Jan 24 2017 14:20 UTC @MohammadHasham is x a variable? Muhammad Hasham @MuhammadHasham23 Jan 24 2017 14:20 UTC yeah from a function /** Javascript File **/ document.addEventListener("keydown",function(x){ var key = document.querySelector("audio[data-key=x]"); console.log(key); }); @oppiniated Clyde Lobo @oppiniated Jan 24 2017 14:21 UTC ok then replace the " with the  Philipp Scholz @philipp32 Jan 24 2017 14:21 UTC Hey, my function doesn't get triggered when I press the enter key? Why is that? $('#search-bar').bind("enterKey",function(e){
$('#random-button').fadeOut("slow");$( '#search-bar').animate({
top: "-200px"
}, 1000, function() {
// Animation complete.
});

});
$('#search-bar').keyup(function(e){ // if enter is pressed if(e.keyCode == 13) {$(this).trigger("enterKey");
}

});
Clyde Lobo
@oppiniated
Jan 24 2017 14:21 UTC
Since you are doing a string interpolation and need to use instead of" for it
Jan 24 2017 14:22 UTC
it is returning me a null
@oppiniated
Clyde Lobo
@oppiniated
Jan 24 2017 14:22 UTC
This message was deleted
Jan 24 2017 14:24 UTC
i am still struggling
Clyde Lobo
@oppiniated
Jan 24 2017 14:24 UTC
var key = document.querySelector(audio[data-key=${x}]); Muhammad Hasham @MuhammadHasham23 Jan 24 2017 14:24 UTC can you tell me where am i doing it wrong var key = document.querySelector("audio[data-key='${x}']");
@oppiniated
Clyde Lobo
@oppiniated
Jan 24 2017 14:25 UTC
Sorin Ruse
@sorinr
Jan 24 2017 14:25 UTC
@MohammadHasham what do you want to get into the key var?
Jan 24 2017 14:25 UTC
i have written that provided by you but it says that it is not a valid queryselector
@sorinr i want to get the keycode and use that further.
Sorin Ruse
@sorinr
Jan 24 2017 14:26 UTC
@MohammadHasham a valid selector is like "audio[data-key]"
Jan 24 2017 14:27 UTC
actually i have set some data-keys in audio in html so i want to get the desired keypress to make it equal to data-key
@sorinr
i figured that out!
@oppiniated @sorinr Thanks
CamperBot
@camperbot
Jan 24 2017 14:29 UTC
mohammadhasham sends brownie points to @oppiniated and @sorinr :sparkles: :thumbsup: :sparkles:
:star2: 1139 | @sorinr |http://www.freecodecamp.com/sorinr
Sorin Ruse
@sorinr
Jan 24 2017 14:33 UTC
@MohammadHasham and if you wanted the value of data-key you needed key.dataset.key
Nathan
@Nathandim
Jan 24 2017 14:37 UTC
Can someone help me with something about the weather app?
https://codepen.io/nathandim/pen/JENvXE is there a way to get the values of latitude and longitude outside of the callback function?
Sorin Ruse
@sorinr
Jan 24 2017 14:46 UTC
@Nathandim you can do it like example
Jianhao Tan
@jaanhio
Jan 24 2017 14:48 UTC
Dear all, i am attempting the "Build a personal portfolio webpage" challenge. may i know if it is actually possible to build that with html/css/bootstrap alone?
Nathan
@Nathandim
Jan 24 2017 14:48 UTC
ohh nice idea
that makes the code a lot more cleaner
thank you @jaanhio
CamperBot
@camperbot
Jan 24 2017 14:49 UTC
nathandim sends brownie points to @jaanhio :sparkles: :thumbsup: :sparkles:
Jianhao Tan
@jaanhio
Jan 24 2017 14:51 UTC
@Nathandim what are you thanking me for? haha
Nathan
@Nathandim
Jan 24 2017 14:52 UTC
lol dude
thank you @sorinr
CamperBot
@camperbot
Jan 24 2017 14:52 UTC
nathandim sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
:star2: 1140 | @sorinr |http://www.freecodecamp.com/sorinr
Nathan
@Nathandim
Jan 24 2017 14:53 UTC
if only my family could understand :D
J.S.
@jspeda
Jan 24 2017 14:56 UTC
@jaanhio yes you don't need javascript
Vasile Botnaru
@VasileBotnaru
Jan 24 2017 15:04 UTC
@jaanhio you're still here?
Sander Berntsen
@sbxn14
Jan 24 2017 15:07 UTC
http://codepen.io/sbxn14/pen/apmJJQ implemented the most important features of my weather app but how do I connect icons to it? I inserted a CSS file that adds weather icons but I got no clue on how to use them
also is bootstrap a must?
Hello911
@Hello911
Jan 24 2017 15:14 UTC

// Setup
var testString = "There are 3 cats but 4 dogs.";

// Only change code below this line.

var expression = /\d+/g;  // Change this line

// Only change code above this line

// This code counts the matches of expression in testString
var digitCount = testString.match(expression).length;
Why is the test returning 2? Does /\d+/g count the # of numbers in testString?
Moisés Man
@moigithub
Jan 24 2017 15:21 UTC
u should start learning about regex www.regexone.com
then regex methods mdn.io/match
and finally length property mdn.io/array.length
@Hello911
Hello911
@Hello911
Jan 24 2017 15:22 UTC
@moigithub I know how to use array.length.
Moisés Man
@moigithub
Jan 24 2017 15:23 UTC
...then 1 less thing to check :)
Hello911
@Hello911
Jan 24 2017 15:24 UTC
But thankk you for the links
Joshua Steele
@joshuapsteele
Jan 24 2017 15:35 UTC
@TylerMoeller Thanks for the <main> tip. How do I keep it centered?
CamperBot
@camperbot
Jan 24 2017 15:35 UTC
joshuapsteele sends brownie points to @tylermoeller :sparkles: :thumbsup: :sparkles:
:star2: 1390 | @tylermoeller |http://www.freecodecamp.com/tylermoeller
Joshua Steele
@joshuapsteele
Jan 24 2017 15:36 UTC
@TylerMoeller nvm. I figured it out. Still had my col-md-8 div in place. I removed it and it fixed the problem.
Unknown
@Unknownhezipaz
Jan 24 2017 15:37 UTC
echo "<p><b>".strtoupper($thearrayprod['prodName'])."</b></center>"; echo "<img src="images/".$arrayprod['prodPicName'].">";
echo "<p><center>".($thearrayprod['prodDescrip'])."</center>"; echo "GBP<center>".($thearrayprod['prodPrice'])"</center>";
echo "<br>";
echo "<br>";
echo "Number in stock:<center>".(thearrayprod['prodQuantity'])"</center>"; I want to display the name,pic,price and quantity on a website using PHP .I have done this but there is error also I want all of the above line of code to have an alignment of center CamperBot @camperbot Jan 24 2017 15:37 UTC @majedmahmood27 said: echo "<p><b>".strtoupper(thearrayprod['prodName'])."</b></center>";
echo "<img src="images/".$arrayprod['prodPicName'].">"; echo "<p><center>".($thearrayprod['prodDescrip'])."</center>";
echo "GBP<center>".($thearrayprod['prodPrice'])"</center>"; echo "<br>"; echo "<br>"; echo "Number in stock:<center>".($thearrayprod['prodQuantity'])"</center>";
I want to display the name,pic,price and quantity on a website using PHP .I have done this but there is error also I want all of the above line of code to have an alignment of center
Tyler Moeller
@TylerMoeller
Jan 24 2017 15:40 UTC
@majedmahmood27 We don't learn PHP at Free Code Camp
Sorin Ruse
@sorinr
Jan 24 2017 15:43 UTC
@sbxn14 weater icons support the openweather api and have special mapping for that. here some info:https://erikflowers.github.io/weather-icons/api-list.html
Sander Berntsen
@sbxn14
Jan 24 2017 15:45 UTC
@sorinr alright sweet but how the hell do iuse that
as I just tried sth on my own http://codepen.io/sbxn14/pen/apmJJQ and it doesnt work at all
Tyler Moeller
@TylerMoeller
Jan 24 2017 15:48 UTC

@joshuapsteele Happy to help! Good luck :+1:
I find this to be a good outline for the portfolio:

<header>
<nav></nav>
<main>
<section></section>
<section></section>
<section></section>
</main>
<footer></footer>

The nav can also go above the <header> if you want it fixed to the top of your page.

Sorin Ruse
@sorinr
Jan 24 2017 15:48 UTC
@sbxn14 simple. <i class="wi wi-owm-"+json.condition code you get from the api response></i>
Sander Berntsen
@sbxn14
Jan 24 2017 15:52 UTC
uhm
Nathan
@Nathandim
Jan 24 2017 15:52 UTC
@TylerMoeller Are you using sections for things like projects and bio?
Sander Berntsen
@sbxn14
Jan 24 2017 15:52 UTC
do i have to do that for every single one? for every single code?
cant i make a function that does that automatically?
Jan 24 2017 15:53 UTC
....
Nathan
@Nathandim
Jan 24 2017 15:53 UTC
to append classes in i elements? I don't see why not
Tyler Moeller
@TylerMoeller
Jan 24 2017 15:53 UTC
@Nathandim Yes, for me at least, it helps organize the content in the page.
Nathan
@Nathandim
Jan 24 2017 15:53 UTC
@TylerMoeller Cool, will check it out :)
Sorin Ruse
@sorinr
Jan 24 2017 15:54 UTC
@sbxn14 not for single one the i tag will be composed automathically when the api call is made. you just render on page the composed i tag
Sander Berntsen
@sbxn14
Jan 24 2017 15:55 UTC
i get what you're saying but i got 0 clue on how to do to it lmao
Tyler Moeller
@TylerMoeller
Jan 24 2017 15:55 UTC
@johnnunns Sorry, stepped away. I think you solved it already, but this is my approach for comparison:
function countAllCharacters(string) {
var charCount = {};
string.split('').map(val => {
charCount[val] = (charCount[val] || 0) + 1;
});

return charCount;
}
Jan 24 2017 15:56 UTC
you are using angular and don't know how to do that ?
Sander Berntsen
@sbxn14
Jan 24 2017 15:57 UTC
im using angular just cause I know its handy to place things in the html that auto generate
Tyler Moeller
@TylerMoeller
Jan 24 2017 15:57 UTC
@johnnunns By the way, there's another room for codewars. Some of us are over there too: https://gitter.im/Codewars/codewars.com
Sander Berntsen
@sbxn14
Jan 24 2017 15:57 UTC
but im far from experienced on it xd
with the {{}} tags n all
yoni chanowitz
@yonichanowitz
Jan 24 2017 16:08 UTC
anyone did "Build a random Quote Machine" ? where is he getting the quotes from? there is no way he manually wrote those in
Tyler Moeller
@TylerMoeller
Jan 24 2017 16:08 UTC
@yonichanowitz They are from an API that provides quotes for you.
Nathan
@Nathandim
Jan 24 2017 16:11 UTC
@yonichanowitz Some people just copy-paste quotes in an array but I would advise against it. I feel like the goal for that exercise is to get our feet wet in API calls. The most commonly used one is the one found at http://forismatic.com/en
yoni chanowitz
@yonichanowitz
Jan 24 2017 16:25 UTC
WTF, i was working on this for months and it says nothing about using API's!!!
where do i get these apis?
@TylerMoeller
Tyler Moeller
@TylerMoeller
Jan 24 2017 16:28 UTC
@yonichanowitz Lots of them out there to choose from: https://www.google.com/search?q=random+quotes+api
I'd recommend choosing one that works with HTTPS. You can also just build your own array of quotes - not a requirement to use an API.
Joshua Steele
@joshuapsteele
Jan 24 2017 16:29 UTC
For the Personal Portfolio, what's the easiest way to go about adding basic social media buttons?
Tyler Moeller
@TylerMoeller
Jan 24 2017 16:30 UTC
@joshuapsteele Most people use Font Awesome: http://fontawesome.io/icons/
yoni chanowitz
@yonichanowitz
Jan 24 2017 16:31 UTC
it says i need AJax @TylerMoeller . any good places to learn that?
Tyler Moeller
@TylerMoeller
Jan 24 2017 16:33 UTC
@yonichanowitz $.getJSON is a simplified way to use Ajax, we get a basic introduction here: https://www.freecodecamp.com/challenges/get-json-with-the-jquery-getjson-method A more detailed description is here: https://api.jquery.com/jQuery.getJSON/ There are lots of youtube tutorials out there too I learned it through trial and error after reading through the jQuery documentation, so don't really have any recommendations aside from the above :/ Sorin Ruse @sorinr Jan 24 2017 16:57 UTC @sbxn14 here your icon showing solution Kevin Robertson @kevnbot Jan 24 2017 17:26 UTC Hello everyone, Im on the "build a random quote machine" challenge and am having trouble figuring out how the tweet button will tweet the quote that is showing. Can someone point me in the right direction? J.S. @jspeda Jan 24 2017 17:33 UTC have you checked the twitter docs? yoni chanowitz @yonichanowitz Jan 24 2017 17:33 UTC thanks @TylerMoeller CamperBot @camperbot Jan 24 2017 17:33 UTC yonichanowitz sends brownie points to @tylermoeller :sparkles: :thumbsup: :sparkles: :star2: 1393 | @tylermoeller |http://www.freecodecamp.com/tylermoeller yoni chanowitz @yonichanowitz Jan 24 2017 17:33 UTC thanks @jdtdesigns . my firewall is blocking it, but i assume its an informative video CamperBot @camperbot Jan 24 2017 17:33 UTC yonichanowitz sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles: :cookie: 881 | @jdtdesigns |http://www.freecodecamp.com/jdtdesigns Kevin Robertson @kevnbot Jan 24 2017 17:35 UTC Yes @jspeda I have added the Tweet button and can do basic things, but im unsure how to tweet the current quote that is being shown. yoni chanowitz @yonichanowitz Jan 24 2017 17:37 UTC @kevnbot , according to what @TylerMoeller just told me, if you have a JSON object, you can write a function to change the quote into text when a user clicks a link, that will put it out as a tweet. .. i think Kevin Robertson @kevnbot Jan 24 2017 17:37 UTC hmm ok. ill explore that @TylerMoeller sorry, @yonichanowitz J.S. @jspeda Jan 24 2017 17:38 UTC i don't remember exactly how that api works but you'll need to save the quote into a variable and probably concatenate it into the URL string that is triggered when you click the share button @kevnbot Kevin Robertson @kevnbot Jan 24 2017 17:39 UTC Ok thats making sense, Ill try that JD Tadlock @jdtdesigns Jan 24 2017 17:45 UTC @kevnbot It may take you some time to figure out how to retrieve the data and use it in your project, but that's what the challenge is all about. The normal person can take quite a lot of time to learn each new thing you're challenged with. It's just the reality of web dev. ;) Kevin Robertson @kevnbot Jan 24 2017 17:48 UTC Yea ive been chipping away at this project. this is the last hurdle for me. almost there! yoni chanowitz @yonichanowitz Jan 24 2017 17:51 UTC @kevnbot , i'm just thinking here, maybe https://dev.twitter.com/web/tweet-button/parameters the parameter data-text= followed by a variable that you assign as the current quote with some javascript? i don't know , im up to where you are JD Tadlock @jdtdesigns Jan 24 2017 17:51 UTC @kevnbot Hate to inform you, but im 8 years in and i still hit hurdles every day lol. yoni chanowitz @yonichanowitz Jan 24 2017 17:52 UTC @jdtdesigns how do you keep on going? i would have commited suicide by now JD Tadlock @jdtdesigns Jan 24 2017 17:54 UTC @yonichanowitz You have to have a passion for this stuff. If you dont love it, you'll burn out quick yoni chanowitz @yonichanowitz Jan 24 2017 17:57 UTC @jdtdesigns like everything in life. i'm burnt out already, but i keep on pushing because i have to make more money, and i have a family to feed. Ghulam Shabir @ghulamshabir Jan 24 2017 17:59 UTC hello dear campers, can any one tell me why even padding-top: 1px causes overlapping in dynamically generated divs. I am .article class in them like this .article { background-color: #bcc6cc; padding-left: 15px; padding-bottom: 5px; /*padding-top: 1px;*/ padding-right: 15px; } and here is my pen https://codepen.io/ghulamshabir/pen/vXELwL?editors=0000 JD Tadlock @jdtdesigns Jan 24 2017 17:59 UTC Its the mountain that will never plateaus. The higher you get in skill, the more challenging the next step will be. It's the way of the world for devs.You love it or hate. I'm either/or on any give day lol. @yonichanowitz I wouldnt rely on web dev to bring in much your first 2 to 3 years of learning yoni chanowitz @yonichanowitz Jan 24 2017 18:03 UTC @jdtdesigns anything is better than nothing @ghulamshabir where is the article element? Ghulam Shabir @ghulamshabir Jan 24 2017 18:04 UTC @yonichanowitz it's in js section @yonichanowitz I am creating the elements dynamically yoni chanowitz @yonichanowitz Jan 24 2017 18:06 UTC @ghulamshabir i may be an idiot, but i don't see it Ghulam Shabir @ghulamshabir Jan 24 2017 18:09 UTC @yonichanowitz sorry might be codepen save issue, I have enabled autosave so I suppose codepen saves my work Sander Berntsen @sbxn14 Jan 24 2017 18:10 UTC http://codepen.io/sbxn14/pen/apmJJQ?editors=1010 what did I do wrong? my icon aint working Adel @AdelMahjoub Jan 24 2017 18:12 UTC @jdtdesigns do you complete freeCodeCamp ziplines kirbyedy @kirbyedy Jan 24 2017 18:13 UTC @sbxn14 data.weather[0].id; Sander Berntsen @sbxn14 Jan 24 2017 18:14 UTC oo sweet thanks! @kirbyedy CamperBot @camperbot Jan 24 2017 18:15 UTC sbxn14 sends brownie points to @kirbyedy :sparkles: :thumbsup: :sparkles: :star2: 1702 | @kirbyedy |http://www.freecodecamp.com/kirbyedy JD Tadlock @jdtdesigns Jan 24 2017 18:15 UTC @AdelMahjoub I stopped at like 900 points. Just had more important things to do. I go on codewars and similar sites to keep my brain tweeked though. ;) Adel @AdelMahjoub Jan 24 2017 18:16 UTC @jdtdesigns if you have done the roguelike game zipline can you post a link Sander Berntsen @sbxn14 Jan 24 2017 18:16 UTC woohoo its almost done JD Tadlock @jdtdesigns Jan 24 2017 18:16 UTC @AdelMahjoub didn't do the game sorry :/ Adel @AdelMahjoub Jan 24 2017 18:17 UTC @jdtdesigns np, I'm using rot.js random map generator, wanted to check others, since there are not a lot written in javascript Tyler Moeller @TylerMoeller Jan 24 2017 18:17 UTC @ghulamshabir there is no .article CSS in your pen or any dynamically generated HTML ;) I see one form element get created when clicking on the icon JD Tadlock @jdtdesigns Jan 24 2017 18:19 UTC @AdelMahjoub you may want to see if @TylerMoeller did the game challenge Tyler Moeller @TylerMoeller Jan 24 2017 18:21 UTC Never did the dungeon crawler either Adel @AdelMahjoub Jan 24 2017 18:23 UTC I found this dungeon generator, but it is written in perl http://donjon.bin.sh/5e/dungeon/ Ghulam Shabir @ghulamshabir Jan 24 2017 18:23 UTC @TylerMoeller yes I realized that, it's codepen which does not have my current work i don't know why, I even changed to manual saving the work but save button is not displayed Tyler Moeller @TylerMoeller Jan 24 2017 18:25 UTC .sh = saint helena? That's a new one for me :) Adel @AdelMahjoub Jan 24 2017 18:25 UTC this is what I did so far, but I think I'll just use rot.js map generator, and use a different render https://codepen.io/SultanCodeCamper/full/NdjyWq/ it moves and console the current target Ghulam Shabir @ghulamshabir Jan 24 2017 18:30 UTC @TylerMoeller @yonichanowitz I think this link should have my current work https://codepen.io/anon/pen/bgrNjO?editors=1111 Tyler Moeller @TylerMoeller Jan 24 2017 18:33 UTC @ghulamshabir The padding-top works for me in your CSS with that pen Nevermind... misunderstood - let me take a closer look Ghulam Shabir @ghulamshabir Jan 24 2017 18:36 UTC @TylerMoeller I want to have top padding as well as margins between every divs vertically but having top padding causes the background to overlap other divs for some reason Tyler Moeller @TylerMoeller Jan 24 2017 18:47 UTC @ghulamshabir I think what you're hitting here is a case of collapsing margins: https://www.w3.org/TR/CSS21/box.html#collapsing-margins The fix is to use margins in addition to the padding properties you want. One of many fixes, anyway Ghulam Shabir @ghulamshabir Jan 24 2017 18:50 UTC @TylerMoeller thanks alot, I really appreciate your help, you helped me before and this time again. :clap: thank you I will follow the link you gave me. CamperBot @camperbot Jan 24 2017 18:50 UTC ghulamshabir sends brownie points to @tylermoeller :sparkles: :thumbsup: :sparkles: :star2: 1395 | @tylermoeller |http://www.freecodecamp.com/tylermoeller JD Tadlock @jdtdesigns Jan 24 2017 18:50 UTC @ghulamshabir Seems as simple as adding .article { margin-bottom: 10px; } Tyler Moeller @TylerMoeller Jan 24 2017 18:51 UTC This is also a great read for lots more detail on the topic: https://www.sitepoint.com/web-foundations/collapsing-margins/ Ghulam Shabir @ghulamshabir Jan 24 2017 18:52 UTC @jdtdesigns I have tried that but it causes overlapping of background colors of div so it appears as if I have put all my paragraph into only one div Tyler Moeller @TylerMoeller Jan 24 2017 18:54 UTC @ghulamshabir Also, this line: $('#wiki').append($('<div class="article"><h2>'+pages[i].title+"</h2><p>"+pages[i].extract+"</p>")); doesn't need the $( in it and it's missing a closing </div>

@jdtdesigns
Jan 24 2017 18:54 UTC
@ghulamshabir Not following you. It works fine in google and firefox.
Ghulam Shabir
@ghulamshabir
Jan 24 2017 18:55 UTC
@jdtdesigns I am using chrome
@TylerMoeller yeah I used $( to try if that may help I will remove it Tyler Moeller @TylerMoeller Jan 24 2017 18:56 UTC I see, just out of curiosity, have you tried using template literals yet? Makes it a little easier for dynamic HTML, IMO: $('#wiki').append(
<div class="article">
<h2>${pages[i].title}</h2> <p>${pages[i].extract}</p>
</div>
);
Just started using it more and seems to help, at least for me
Ghulam Shabir
@ghulamshabir
Jan 24 2017 19:00 UTC
no I haven't, I have just read about it on the internet but could not understand what is it but your code snippet made it clear :smile: thanks again
Sorin Ruse
@sorinr
Jan 24 2017 19:12 UTC
@sbxn14 :point_up: January 24, 2017 6:57 PM
@jdtdesigns
Jan 24 2017 19:15 UTC
@ghulamshabir Here's an example of a simple approach to creating spacing http://jsbin.com/raneyi/edit?css,js,output
Brandon Armstrong
@calmcoolcollected
Jan 24 2017 19:15 UTC
Could someone help me with my pomodoro clock? Right now the problem is that when the clock switches to the break time ("Relax"), I can't seem to pause the clock (done by clicking the big button) and then clicking it again makes it go faster. There's something wrong with the break interval but I can't seem to figure it out. Possibly a scope problem or things being out of order? http://codepen.io/brandon327/pen/mREZaN/?editors=0010
Ghulam Shabir
@ghulamshabir
Jan 24 2017 19:16 UTC
@jdtdesigns thanks for helping me I will definitely look into it :smile: thanks alot
CamperBot
@camperbot
Jan 24 2017 19:16 UTC
ghulamshabir sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
Ghulam Shabir
@ghulamshabir
Jan 24 2017 19:20 UTC
@jdtdesigns it looks like you have typed all that just for me to solve my problem because I am seeing most of code similar to mine :smile: thank you
CamperBot
@camperbot
Jan 24 2017 19:20 UTC
ghulamshabir sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
:warning: ghulamshabir already gave jdtdesigns points
clydrampage
@clydrampage
Jan 24 2017 19:20 UTC
how should I start building my personal portofolio webpage?
I forgot almost everything i learned in tutorials
@jdtdesigns
Jan 24 2017 19:21 UTC
@ghulamshabir Tried to make it as understandable as possible
Ghulam Shabir
@ghulamshabir
Jan 24 2017 19:21 UTC
@jdtdesigns it's neat and clean code I am loving it
clydrampage
@clydrampage
Jan 24 2017 19:22 UTC
any recommendation?
Ghulam Shabir
@ghulamshabir
Jan 24 2017 19:23 UTC
@jdtdesigns oh it means you did it for me :smile: millions of thanks to you
CamperBot
@camperbot
Jan 24 2017 19:23 UTC
ghulamshabir sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
:warning: ghulamshabir already gave jdtdesigns points
@jdtdesigns
Jan 24 2017 19:27 UTC
@clydrampage Look up tutorials on html, css. There's plenty on youtube
You can also take free interactive courses like codecademy.com
Patrick Black Jr
@patrickblackjr
Jan 24 2017 19:59 UTC
Say I am GETing a JSON API. I get this as part of my response.
"weather":[{"id":804,"main":"clouds","description":"overcast clouds","icon":"04n"}],
How do access the object (icon for example) to get the correct return value? I am currently using weatherData.weather.icon. Why doesn't this work?
Ivan Ngundela
@ingundela
Jan 24 2017 20:07 UTC
Hello everyone, I hope you all doing well... I'm starting a project.. I want to build a web page... I need to have some contacts in horizontal and the keeps on displaying vertical why... my code is
div id="menu">

<ul>
<li>Solucoes</li>
<li>Internet</li>
<li>Voz</li>
<li>Suporte</li>
<li>Loja</li>
</ul>

</div>

<!DOCTYPE html>

<html>

<title>EBU PAGE</title>

<body>

<ul>
<li>Solucoes</li>
<li>Internet</li>
<li>Voz</li>
<li>Suporte</li>
<li>Loja</li>
</ul>

</div>

</body>

</html>
help... this is not displaying the content in horizontal way.. why?
CamperBot
@camperbot
Jan 24 2017 20:09 UTC
no wiki entry for: this is not displaying the content in horizontal way why
Tyler Moeller
@TylerMoeller
Jan 24 2017 20:09 UTC
@Mortiferr weather is an array - as a hint, how do you access the first element of an array?
Patrick Black Jr
@patrickblackjr
Jan 24 2017 20:09 UTC
weatherData.weather[0].icon
thanks @TylerMoeller
Tyler Moeller
@TylerMoeller
Jan 24 2017 20:09 UTC
:)
CamperBot
@camperbot
Jan 24 2017 20:09 UTC
mortiferr sends brownie points to @tylermoeller :sparkles: :thumbsup: :sparkles:
:star2: 1396 | @tylermoeller |http://www.freecodecamp.com/tylermoeller
Patrick Black Jr
@patrickblackjr
Jan 24 2017 20:10 UTC
http://codepen.io/Mortiferr/pen/oBZJzp?editors=1011
I have a document.write in my HTML and and if-then statement that writes a different character based on a variable. Why isn't it printing to the page?
Tyler Moeller
@TylerMoeller
Jan 24 2017 20:11 UTC
@Mortiferr You can also right-click the output in your browser's console and select copy property path
Patrick Black Jr
@patrickblackjr
Jan 24 2017 20:11 UTC
oh okay, thank you
Tyler Moeller
@TylerMoeller
Jan 24 2017 20:12 UTC
Patrick Black Jr
@patrickblackjr
Jan 24 2017 20:13 UTC
Tyler Moeller
@TylerMoeller
Jan 24 2017 20:14 UTC
@Mortiferr your script in your html is likely running before you get the data back from the API
Also, 'units' is undefined in that chunk of code
Patrick Black Jr
@patrickblackjr
Jan 24 2017 20:14 UTC
Are you sure? I have units globally defined I thought
But yeah you're probably right I need to specify
Tyler Moeller
@TylerMoeller
Jan 24 2017 20:15 UTC
Even if 'units' and 'imperial' are both globally defined, they don't have a value until you get some data back from the API - that takes some time to visit the API URL and then come back
In the browser console, I see this error when running your codepen:
index.html:20 Uncaught ReferenceError: units is not defined
at index.html:20
@ingundela That's how lists work by default, they list items vertically
Joe Green
@JGreenusff
Jan 24 2017 20:18 UTC
I have no clue how to make a nav bar for my portfolio webpage
Ivan Ngundela
@ingundela
Jan 24 2017 20:20 UTC
@TylerMoeller ok.. but I want it to be horizontal
Abdijabar Yussuf Mohamed
@aymohamed
Jan 24 2017 20:23 UTC
Hey guys.
what do you think of my tribute page : https://codepen.io/aymohamed/pen/egWgmQ
Any suggestion before I submit ?
Tyler Moeller
@TylerMoeller
Jan 24 2017 20:26 UTC
@ingundela <li> is a block element, so to make it horizontal, you can use display: inline. I'm not sure that's the look you want to achieve though - if you can be more specific, I might be able to give a better answer
@JGreenusff Are you running into errors with what you have tried or having problems searching for how to build a navbar?
Jan 24 2017 20:28 UTC
Hey, anyone online?
Ivan Ngundela
@ingundela
Jan 24 2017 20:29 UTC
@TylerMoeller is it fine if I show my code like this.. to have it horizontally?


<ul>
Solucoes
Internet
Voz
Suporte
Loja
</ul>
@TylerMoeller I want to have in the top right of my page Solucoes Internet Voz Suporte Loja
Tyler Moeller
@TylerMoeller
Jan 24 2017 20:30 UTC
@aymohamed It looks nice, good job. It would be nice to make the image responsive. http://getbootstrap.com/css/#images
Jan 24 2017 20:31 UTC
Is anyone familiar with the MERN stack?
Tyler Moeller
@TylerMoeller
Jan 24 2017 20:32 UTC
@ingundela I believe <ul> needs to have <li> inside. Why not use <div> or <p>?
@adrianwarholm You may want to try https://gitter.im/FreeCodeCamp/HelpBackEnd, this room is for front-end
Jan 24 2017 20:33 UTC
Oh, thanks! But I thought front-end was with html and css?
Tyler Moeller
@TylerMoeller
Jan 24 2017 20:33 UTC
@adrianwarholm Also, this is a good resource: https://hashnode.com/n/mern
@adrianwarholm Yeah, no mongo or node.js here :)
Jan 24 2017 20:34 UTC
@TylerMoeller I was actually just confused more on implementing my html and css files with the stack? Should I go to the back-end chatroom for methods of implementation or ask it here?
Tyler Moeller
@TylerMoeller
Jan 24 2017 20:35 UTC
@adrianwarholm If it's specific to HTML, CSS, JavaScript, jQuery, maybe we can help
This room is for help with the Free Code Camp Front-end Development Certification assignments though: https://www.freecodecamp.com/map
The back-end chatroom is for help with the back-end certification projects
Jan 24 2017 20:38 UTC
@TylerMoeller Thanks! But it's just a personal project I'm on that freecodecamp got me interested with. Since MERN is isomorphic, I think that may be the issue. I just want my application to display my HTML and CSS files. I don't know how to get them to show on the screen though other than MERN's default template.
CamperBot
@camperbot
Jan 24 2017 20:38 UTC
adrianwarholm sends brownie points to @tylermoeller :sparkles: :thumbsup: :sparkles:
:star2: 1397 | @tylermoeller |http://www.freecodecamp.com/tylermoeller
Ivan Ngundela
@ingundela
Jan 24 2017 20:38 UTC
@TylerMoeller is it find if I show my code like this to have it horizontal
<div id=" menu ">
Solucoes
Internet
Voz
Suporte
Loja

</div>
@TylerMoeller let me know the options
Tyler Moeller
@TylerMoeller
Jan 24 2017 20:40 UTC
@ingundela I'm not sure I understand the question. It is fine, yes, but it looks like this:
Solucoes Internet Voz Suporte Loja
Abdijabar Yussuf Mohamed
@aymohamed
Jan 24 2017 20:40 UTC
Appreciated @TylerMoeller . I did that now. Thanks.
CamperBot
@camperbot
Jan 24 2017 20:40 UTC
aymohamed sends brownie points to @tylermoeller :sparkles: :thumbsup: :sparkles:
:star2: 1398 | @tylermoeller |http://www.freecodecamp.com/tylermoeller
Tyler Moeller
@TylerMoeller
Jan 24 2017 20:41 UTC
@aymohamed :+1: Nice work
@ingundela Maybe you are looking for something like this? https://getbootstrap.com/examples/navbar/
cas_dd
@casdidier
Jan 24 2017 20:42 UTC
Hello guys ,
I m having issue with reading my json format from API ... I try to display that data into a div
Ivan Ngundela
@ingundela
Jan 24 2017 20:42 UTC
@TylerMoeller yes, that's want I want it to look
Josie
@Josie-N
Jan 24 2017 20:43 UTC

So since I don't really understand the basic CSS grid/ layout system, I decided to try and build a simple header-main-sidebar-footer type of layout.
So I tried following this: http://vanseodesign.com/css/2-column-layout-code/

## And of course after copy pasting the html-css in Codepen, it doesn't work.

I tried building it again by myself this time, and this is for far I got:
https://codepen.io/CMYK/pen/zNdvwM?editors=1100
Why in the world does my main section overlap like that over the header section?

Tyler Moeller
@TylerMoeller
Jan 24 2017 20:43 UTC
@ingundela Okay, good :) hope that helps. the blue button on that page links to the documentation and has some sample code you can try
@casdidier In your HTML, the ID should not have a # in it. Also, your button ID does not match the ID used in your jQuery. Fix those issues, and your quotes should work.
Ivan Ngundela
@ingundela
Jan 24 2017 20:45 UTC
@TylerMoeller how do I check in a page the code that was written for a specific thing?
cas_dd
@casdidier
Jan 24 2017 20:47 UTC
@TylerMoeller thanks... !! Forgot those basics on HTML naming , good refreshing !
CamperBot
@camperbot
Jan 24 2017 20:47 UTC
casdidier sends brownie points to @tylermoeller :sparkles: :thumbsup: :sparkles:
:star2: 1399 | @tylermoeller |http://www.freecodecamp.com/tylermoeller
Toffanelly
@Toffanelly
Jan 24 2017 20:48 UTC

oooops
Tyler Moeller
@TylerMoeller
Jan 24 2017 20:48 UTC

@Josie-N One small typo here:

   <div id="header">
<div id="nav"></nav>
</div>

Take note of the opening/closing tags

@ingundela I don't understand the question :/ I'm sorry
Right-click -> Inspect Element?
Toffanelly
@Toffanelly
Jan 24 2017 20:50 UTC


$(document).ready(function() { if (navigator.geolocation) { navigator.geolocation.getCurrentPosition(function(position) {$("#latlon").html(position.coords.latitude + " " + position.coords.longitude);
});

}



I'm doing the weather challenge on codepen but even this code doesnt output anything, what am I doing wrong?

$(document).ready(function() { // var lat; // var lon; if (navigator.geolocation) { navigator.geolocation.getCurrentPosition(function(position) { //lat = position.coords.latitude; //lon = position.coords.longitude;$("#latlon").html(position.coords.latitude + " " + position.coords.longitude);
});

}
Austin Kiekintveld
@akiekintveld
Jan 24 2017 20:51 UTC
I'm currently working on the Wikipedia Viewer project. Can anyone take a look at my ajax/JSONP request and see why my callback function isn't executing? https://codepen.io/akiekintveld/pen/apybYx
Tyler Moeller
@TylerMoeller
Jan 24 2017 20:52 UTC
@Toffanelly If you're using Chrome, you need to load your page over HTTPS. Check your browser's console for errors/warnings
Toffanelly
@Toffanelly
Jan 24 2017 20:54 UTC
@TylerMoeller So there is like an option to do so? Or should i just work in another browser?
Tyler Moeller
@TylerMoeller
Jan 24 2017 21:00 UTC
@Toffanelly navigator.geolocation only supports HTTPS, so you can still use it but need a fallback to an ip-based location method if users visit your page over HTTP. This issue may give some background: FreeCodeCamp/FreeCodeCamp#7853
This pen may help you with figuring out how to fall back: http://s.codepen.io/TylerMoeller/pen/ZBBEGq
Toffanelly
@Toffanelly
Jan 24 2017 21:01 UTC
@TylerMoeller I figured out i just needed to add https:// before the ULR, thanks a lot
CamperBot
@camperbot
Jan 24 2017 21:01 UTC
toffanelly sends brownie points to @tylermoeller :sparkles: :thumbsup: :sparkles:
:star2: 1400 | @tylermoeller |http://www.freecodecamp.com/tylermoeller
djemellow
@djemellow
Jan 24 2017 21:08 UTC
Hey if you go <div id="container"> is that the same as <div class="container">? i cant find the answer...
ohh wait i found the answer lol
Nicholas Liu
@jumpship91
Jan 24 2017 21:09 UTC
can anyone go through my code? Can't get my beginning script to work. It's supposed to change "The message" to "Testing!!!". http://codepen.io/Jumpship91/pen/GrvJOL/
Tyler Moeller
@TylerMoeller
Jan 24 2017 21:15 UTC
@akiekintveld When you have an input in a form and submit the data, it refreshes the page. Do this to prevent that from happening:
  $("#search").submit(function(e) { e.preventDefault(); @jumpship91 It looks like you need to add jQuery to your project Nicholas Liu @jumpship91 Jan 24 2017 21:16 UTC @TylerMoeller oh man, of course.. @TylerMoeller thanks Tyler! CamperBot @camperbot Jan 24 2017 21:16 UTC jumpship91 sends brownie points to @tylermoeller :sparkles: :thumbsup: :sparkles: :star2: 1401 | @tylermoeller |http://www.freecodecamp.com/tylermoeller Tyler Moeller @TylerMoeller Jan 24 2017 21:17 UTC no problem :+1: :) hernanfinucci @hernanfinucci Jan 24 2017 21:18 UTC hii guys how can i have more fonts like Lato or Open Sans?? Nicholas Liu @jumpship91 Jan 24 2017 21:18 UTC @TylerMoeller spoke too soon..still doesn't work? Is there anything else I need to add? Nicholas Liu @jumpship91 Jan 24 2017 21:23 UTC @JohnnyBizzel is there a reason it doesn't work inline the HTML? Tyler Moeller @TylerMoeller Jan 24 2017 21:23 UTC @jumpship91 If you add jQuery to the codepen settings, you'll need to use the JavaScript panel to hold your code. Otherwise, add a <script> tag with the link to jQuery in your HTML and put all your <script> tags at the end of your HTML. Nicholas Liu @jumpship91 Jan 24 2017 21:23 UTC @JohnnyBizzel Thanks Johnny! CamperBot @camperbot Jan 24 2017 21:23 UTC jumpship91 sends brownie points to @johnnybizzel :sparkles: :thumbsup: :sparkles: :star2: 1182 | @johnnybizzel |http://www.freecodecamp.com/johnnybizzel Johnny @JohnnyBizzel Jan 24 2017 21:24 UTC @jumpship91 Not sure what the problem was. You don't need body or html tags on codepen. Nicholas Liu @jumpship91 Jan 24 2017 21:25 UTC @TylerMoeller gotcha, thanks for that explanation! CamperBot @camperbot Jan 24 2017 21:25 UTC :warning: jumpship91 already gave tylermoeller points jumpship91 sends brownie points to @tylermoeller :sparkles: :thumbsup: :sparkles: Tyler Moeller @TylerMoeller Jan 24 2017 21:27 UTC @jumpship91 No problem, I have to head out, but this is a working fork of your codepen for comparison if you run into any problems: http://s.codepen.io/TylerMoeller/pen/KavzrN Johnny's pen is a good approach too - it's a bit easier to work with the JavaScript, IMO, when it's not in your HTML Josie @Josie-N Jan 24 2017 21:30 UTC @TylerMoeller THANK YOU SO MUCH 😁💐 CamperBot @camperbot Jan 24 2017 21:30 UTC :star2: 1402 | @tylermoeller |http://www.freecodecamp.com/tylermoeller josie-n sends brownie points to @tylermoeller :sparkles: :thumbsup: :sparkles: Toffanelly @Toffanelly Jan 24 2017 21:39 UTC navigator.geolocation.getCurrentPosition(function(position) { lat = position.coords.latitude; lon = position.coords.longitude; var latInteger = Math.round(lat); var lonInteger = Math.round(lon);$("#latlon").html(lat + " " + lon);
var address = "api.openweathermap.org/data/2.5/weather?lat=" + latInteger + "&lon=" + lonInteger + "&APPID=a75682a6c2b68e86092711fc2e591d34";
$("#address").html(address);$.getJSON(address, function (json) {
\$("#json").html(JSON.stringify(json));

});
});
I'm here again. Basically instead of getting the json object printed on screen i get nothing. The console outputs error 404 (in particular "Failed to load resource: the server responded with a status of 404 ()"). The address of the api is working because if i open it in another tab i get the object i need. Im clueless really
Moisés Man
@moigithub
Jan 24 2017 21:40 UTC
else it will be taken as relative address.... @Toffanelly
Toffanelly
@Toffanelly
Jan 24 2017 21:45 UTC
i tried that, still doesnt work
Nikki L.R.
@nikkilr88
Jan 24 2017 21:46 UTC
Hello! Could anyone help me out? I am working on "Responsive Design with Bootstrap", and I just have one question.
Vincent B
@vberrios
Jan 24 2017 21:53 UTC
I need some help with getting Font Awesome to work. This is what i have
Nikki L.R.
@nikkilr88
Jan 24 2017 21:53 UTC
They said that we can use bootstrap by inserting a link and that they have already done it for us. Where exactly is the link?
Vincent B
@vberrios
Jan 24 2017 21:53 UTC
<div class="btnList text-center">
@nikkilr88 codepen?
or what challenge
@vberrios the font should work if you apply it to something, ...with some style tags or css font-family: lobster;
Vincent B
@vberrios
Jan 24 2017 22:04 UTC

so like this

@moT01 I'm using Codepen it has bootsrap I don't think it needs style tags
maybe im not sure how to use what your after, but you should just need the <link> with the font in it like you have it
thats a js file, i dont think you need that at all
so keep your <link> as is, then you should be able to use the font on whatever you want, in your css you could use it like so...
body {
font-family: lobster; }
Nikki L.R.
@nikkilr88
Jan 24 2017 22:19 UTC
@nikkilr88 codepen? I am just starting the section. It was talking about how to use bootstrap in your project.
codepen.io its a place to make some projects or practice or whatever, ...there should be a link in the challenge description somewhere, if i remember, that you can just copy and paste
Ve Vanderpool
@VanAmoVe
Jan 24 2017 23:04 UTC
hey everyone, I am almost done with my tribute page. If you have time to take a look and let me know your thoughts, I would gladly appreciate it!
aRtoo
@artoodeeto
Jan 24 2017 23:20 UTC
guys quick question. if you want to do a webpage using bootstrap so you wonot need the media quiries right?? thanks
Jessi L Wasell
@JessiW
Jan 24 2017 23:46 UTC
@artoodeeto - If you don't want to use them you don't have to. It really depends on how you want to build it but you don't need them to use bootstrap or if you use bootstrap.