These are chat archives for FreeCodeCamp/HelpFrontEnd

13th
Feb 2018
DMsalati
@DMsalati
Feb 13 2018 00:34
@gulsvi ohh i see, i still didnt try to use them yet lol but they look super neat
Bradkittle
@Bradkittle
Feb 13 2018 00:41
how do I create a placeholder for an image?
Dr-D-M
@Dr-D-M
Feb 13 2018 00:41
@Bradkittle what do you mean?
Bradkittle
@Bradkittle
Feb 13 2018 00:42
for the portfolio page. Need placeholders so I can upload finished work when I do more
Dr-D-M
@Dr-D-M
Feb 13 2018 00:46
@Bradkittle what I'd do is write the img tag and give it a style on css, add some border and width and height, and later add the image... but that's me
that what I'd do, is that helpful?
Bradkittle
@Bradkittle
Feb 13 2018 00:47
<input type="image"> right? Sorry, I am new
Dr-D-M
@Dr-D-M
Feb 13 2018 00:53
@Bradkittle mmmh no, it'd be <img src="" class = "image1"></img>
the closing tag is not needed, sorry lol
and then, on CSS use the class to put some style as a placeholer to add the image later...
for example
.image1{
width: 
height:
border:
}
you have that projecto on codepen or anything like that?
cjlynch12
@cjlynch12
Feb 13 2018 00:56
anybody know a good way to validate emails using react + material-ui?
Bradkittle
@Bradkittle
Feb 13 2018 00:56
Linked the first website I made, but it doesn't want to show up
Dr-D-M
@Dr-D-M
Feb 13 2018 00:57
it looks like you have a placeholder right there for what you want to do
Bradkittle
@Bradkittle
Feb 13 2018 00:59
Trying to get the webpage to pop up as an image though
Dr-D-M
@Dr-D-M
Feb 13 2018 01:00
does it run in your machine?
Bradkittle
@Bradkittle
Feb 13 2018 01:02
Nope, it doesn't. Just an icon where the webpage should be displayed in the portfolio
Dr-D-M
@Dr-D-M
Feb 13 2018 01:05
@Bradkittle it looks like these kind of things don't work with codepen
@Bradkittle erase the button tag
and add a border to it
that would make it work
Gulsvi
@gulsvi
Feb 13 2018 01:10
@Bradkittle This site give you placeholder images of any size: https://placeholder.com/
If you want an image of your tribute page, go to the tribute page -> Settings -> Screenshot. There's a link to a large or small version
Heathercoraje
@Heathercoraje
Feb 13 2018 02:16
@SweetCodingInc Hey by the way I have been learning react and it says Node.js not yet understands import/ export thing from React. But then isn't Node.js supports ES6? Or import/export ways to bring modules aren't of ES6 rather of React itself?
AbrisM
@AbrisM
Feb 13 2018 02:41
Hello, does anyone know of obscure Network Operating Systems?
Ken Haduch
@khaduch
Feb 13 2018 02:43
@Bradkittle - if you want a site for placeholder images - I saved these links a while ago - maybe one of them will work? https://www.placehold.it/ is a site for that, and an article about it is here: https://www.longren.io/image-placeholders/ - so that might help? http://lorempixel.com/ looks like another site.
Claudio Restifo
@Marmiz
Feb 13 2018 02:45
@Heathercoraje the standard node syntax is require()and probably will stay there.
There's a support coming up for es6 import in the latest versions of node (i think from v8.x) but i think Babel still transpile it to the good 'ol require.
Ghost
@ghost~5a4a80acd73408ce4f859755
Feb 13 2018 03:02
Hey guys, does anyone know how to draw and animate with JS?
Tom
@moT01
Feb 13 2018 03:03
sure
AbrisM
@AbrisM
Feb 13 2018 03:12
JS is replacing Shockwave and flash animations? :)
Sweet Coding :)
@SweetCodingInc
Feb 13 2018 04:05
@Heathercoraje You'll need babel-loader to transpile import statements
Dany Din
@danydin
Feb 13 2018 07:15
hey, if iwant to remove decoration from hover what should i write in css?
Philominsuji
@Philominsuji
Feb 13 2018 07:23
Hello World! I want to learn programming Can anyone help me?
Can anyone explain the following program
for($i=0;$i<=5;$i++){
for($j=1;$j<=$i;$j++){
echo "* ";
}
echo "<br>";
}
Sweet Coding :)
@SweetCodingInc
Feb 13 2018 07:45
@danydin text-decoration:none;
abraham anak agung
@padunk
Feb 13 2018 07:47
@Philominsuji what language is that ?
Claudio Restifo
@Marmiz
Feb 13 2018 07:47
i think it's bash
Sweet Coding :)
@SweetCodingInc
Feb 13 2018 07:47
php, I guess
Philominsuji
@Philominsuji
Feb 13 2018 07:48
php
Claudio Restifo
@Marmiz
Feb 13 2018 07:48
oh right, I forgot about it... yeah more likely php :)
Sweet Coding :)
@SweetCodingInc
Feb 13 2018 07:48
@Philominsuji It will print
*
* *
* * *
* * * *
* * * * *
Philominsuji
@Philominsuji
Feb 13 2018 07:49
yes this is the output
Sweet Coding :)
@SweetCodingInc
Feb 13 2018 07:49
so what's the problem?
Philominsuji
@Philominsuji
Feb 13 2018 07:50
I understood the for loop but I can not understand the nested for loop
Sweet Coding :)
@SweetCodingInc
Feb 13 2018 07:51
You want to print as many * on one line as the value of $i
so when $i is 1, you print *
when $i is 2, you print * *
Philominsuji
@Philominsuji
Feb 13 2018 07:52
yes we use for loop to that right?
Sweet Coding :)
@SweetCodingInc
Feb 13 2018 07:53
yes
the outer loop tracks value of $i
the inner loop (nested loop) runs from 1 to $i
so that it can print as many *s as $i
when the inner loop is over, you want to move to next line.
you do that echo "<br>"
Philominsuji
@Philominsuji
Feb 13 2018 07:59
when $i=1,the inner loop will run only one time right?
because inner loop condition is $j<=$i right?
Claudio Restifo
@Marmiz
Feb 13 2018 08:01
@Philominsuji yep because j is initialised as 1, so it will run one time 1<= 1 is true, then the loop will check again but this time 2 <= 1 is false so it will stop and go back to executing the outer function
and the next thing in the outer function is echo <br> so the function will do that, and then resume the loop by incrementing i, checking the loop condition... and so on...
Dany Din
@danydin
Feb 13 2018 08:06
@SweetCodingInc thanks but should i do like this className:hover{text....}?
CamperBot
@camperbot
Feb 13 2018 08:06
danydin sends brownie points to @sweetcodinginc :sparkles: :thumbsup: :sparkles:
:cookie: 284 | @sweetcodinginc |http://www.freecodecamp.org/sweetcodinginc
Philominsuji
@Philominsuji
Feb 13 2018 08:07
so each and every iteration one star should be print.Because there is no concatination operator used in this.Then how to print 1st one star next two star next three star?
Dany Din
@danydin
Feb 13 2018 08:09
@Marmiz how to indicate hover in css?
Sweet Coding :)
@SweetCodingInc
Feb 13 2018 08:09
@danydin that's right
Dany Din
@danydin
Feb 13 2018 08:10
ahhh ok cuz for some reason the css didn't read it
Claudio Restifo
@Marmiz
Feb 13 2018 08:10
@danydin :hover
Dany Din
@danydin
Feb 13 2018 08:10
fixed
@Marmiz thx
CamperBot
@camperbot
Feb 13 2018 08:10
danydin sends brownie points to @marmiz :sparkles: :thumbsup: :sparkles:
:star2: 1158 | @marmiz |http://www.freecodecamp.org/marmiz
Dany Din
@danydin
Feb 13 2018 08:10
@SweetCodingInc thx budddy
CamperBot
@camperbot
Feb 13 2018 08:10
danydin sends brownie points to @sweetcodinginc :sparkles: :thumbsup: :sparkles:
api offline
Claudio Restifo
@Marmiz
Feb 13 2018 08:14
@Philominsuji because i increments, so your j loops more on each iteration.
i = 0 --> j(1) <= 0 is false so nothing happens
i =1 --> j(1) <= 1 loop one time
i = 2 --> j(1) <= 2 loop two times (first time j = 1; then j =2)
i = 3 --> j(1) <= 3 loop three times ( j= 1; j=2; j=3)

[... and so on..]
until
i = 6 breaks the loop
Michael Cordero
@CyberPutty
Feb 13 2018 08:52
anyone familiar with react and CORS?
Sweet Coding :)
@SweetCodingInc
Feb 13 2018 08:52
@CyberPutty yes?
Michael Cordero
@CyberPutty
Feb 13 2018 08:54
@SweetCodingInc cool. I'm using react in VSC and when i try a fetch i get a console error about not allowing CORS because i need Access-Control-Allow-Origin: *. where do i write that?
Sweet Coding :)
@SweetCodingInc
Feb 13 2018 08:54
@CyberPutty what URL are you trying to fetch?
Michael Cordero
@CyberPutty
Feb 13 2018 08:54
just a github file
Sweet Coding :)
@SweetCodingInc
Feb 13 2018 08:54
can you share code ?
Michael Cordero
@CyberPutty
Feb 13 2018 08:54
but im running locally on port#
const url= "https://github.com/lewagon/flats-boilerplate/blob/master/flats.json";
  fetch(url)
  .then(response=> response.json())
  .then((data)=>{
    console.log(data);
  });
Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at https://github.com/lewagon/flats-boilerplate/blob/master/flats.json. (Reason: CORS header ‘Access-Control-Allow-Origin’ missing).
Sweet Coding :)
@SweetCodingInc
Feb 13 2018 08:58
@CyberPutty correct
you need to use the raw url https://raw.githubusercontent.com/lewagon/flats-boilerplate/master/flats.json
the url you've specified is an actual html page and not a json.
Michael Cordero
@CyberPutty
Feb 13 2018 08:58
@SweetCodingInc lawl kk im try that first.
Sweet Coding :)
@SweetCodingInc
Feb 13 2018 08:59
When you visit this file https://github.com/lewagon/flats-boilerplate/blob/master/flats.json there are 3 buttons on right side right above where the code starts. Click on Raw button that will take you to actual file
Michael Cordero
@CyberPutty
Feb 13 2018 08:59
@SweetCodingInc Thanks' that worked.
CamperBot
@camperbot
Feb 13 2018 08:59
cyberputty sends brownie points to @sweetcodinginc :sparkles: :thumbsup: :sparkles:
:cookie: 285 | @sweetcodinginc |http://www.freecodecamp.org/sweetcodinginc
Sweet Coding :)
@SweetCodingInc
Feb 13 2018 08:59
use that url
@CyberPutty :+1:
Yaroslav
@YVeselovskyi
Feb 13 2018 10:08

@YVeselovskyi
Hello! I am making filtering table with ReactJS, and now I have something like that:

export function searchPlayersConfigs(string) {
  if (string === '') {
    return playersConfigCache;
  }

  const searchResult = [...playersConfigCache];
  return searchResult.filter(config => config.name.toLowerCase().indexOf(string.toLowerCase()) !== -1);
}

how to make exact matches appear first, after that matches which begin with search string, and last ones that contain search string?

Johnny
@JohnnyBizzel
Feb 13 2018 10:56
@YVeselovskyi how about checking if all chars match? Then it's a perfect match.
Stephen James
@sjames1958gm
Feb 13 2018 11:04
@YVeselovskyi You might need to use sort after filter. Putting exact first, then lower indexOf result next
Roman Struna
@RomchyFCC
Feb 13 2018 12:01
Hey everyone, I would love it if someone with a lot of experience would help me optimize this project :)
It works, but perhaps I complicated it a bit too much so I can apply the style it has ¯_(ツ)_/¯
https://codepen.io/Romchy/pen/vdZwJQ
Heathercoraje
@Heathercoraje
Feb 13 2018 14:10
@Marmiz So, it is just node.js trying to keep their way, that has nothing to with difference in es6 or es5?
Ghost
@ghost~5a4a80acd73408ce4f859755
Feb 13 2018 14:31
anyone know ow to do this with JS?
image.png
Stephen James
@sjames1958gm
Feb 13 2018 14:33
@RomchyFCC One thing I would do is nest the channels getJSON in the streams getJSON callback.
Because you are subject to all sorts of out of order issues. Also, eliminate the
setTimeouts, they are also sensitive to network delays.
array = []
for each channel
     $getJSON for stream
          $getJSON for channel
               push data to array
               if (array.length == channels.length) process data from array // you have all the data
Roman Struna
@RomchyFCC
Feb 13 2018 14:39
wouldn't the code quit if the stream was offline then? stream is offline and the data is incomplete -> would never fire the call for channel if the channel was in the callback?
the problem is that i need the setTimeouts, because i need order, and if I omit the timeouts, the order gets mixed up and the design is ruined, this assignment would be super easy if i didn't care about order
Stephen James
@sjames1958gm
Feb 13 2018 14:41
@RomchyFCC You get the channel data for every channel already - regardless of online/offline
Roman Struna
@RomchyFCC
Feb 13 2018 14:42
that's true but the stream data is different than channel data, i need every channel data so i can display the channel info such as name and link
if i use stream data i don't get those 2
and the stream is offline, if the stream is online i get all the info
Stephen James
@sjames1958gm
Feb 13 2018 14:43
@RomchyFCC With the nest calls you have access to both stream and channel data for the same channel
@RomchyFCC And if you count responses then you don't have to use timers which are prone to error
Roman Struna
@RomchyFCC
Feb 13 2018 14:43
indeed but wouldn't it make more sense to nest stream JSON in channel JSON
Stephen James
@sjames1958gm
Feb 13 2018 14:45
@RomchyFCC Yes.
Roman Struna
@RomchyFCC
Feb 13 2018 14:45
actually no, i don't see any of these working, best bet would be if statement and error handling i assume..which i don't know how to do well, if stream data available use it if not use channel data, wouldn't that make the most sense?
actually nesting stream data would be fine too, about the same amount of calls
would have to try it and see how it orders things
Stephen James
@sjames1958gm
Feb 13 2018 14:48
@RomchyFCC If you nest them, then you will have all the data needed in the innermost response to process both stream and channel data.
And you order the data just like you do in the setTimeout.
Rohit kumar
@Rohitkrops
Feb 13 2018 14:49
I am working on freeCodeCamp redesign concept on my own. The first version will be complete until next week. It would be great if you review it. https://www.figma.com/file/cBad9b0LaMd1TM8Kcde7im1n/fcc https://www.figma.com/file/cBad9b0LaMd1TM8Kcde7im1n/fcc?node-id=26%3A2 https://www.figma.com/file/cBad9b0LaMd1TM8Kcde7im1n/fcc?node-id=15%3A4573
Tom
@moT01
Feb 13 2018 14:52
looks good @Rohitkrops
Roman Struna
@RomchyFCC
Feb 13 2018 14:52
i'll look into nesting them if i get any time off, will let you know how it goes, also, i didn't like the timeout sollution but nothing else i tried worked, thanks for the feedback @sjames1958gm i'll try to fix it asap
CamperBot
@camperbot
Feb 13 2018 14:52
romchyfcc sends brownie points to @sjames1958gm :sparkles: :thumbsup: :sparkles:
:star2: 8971 | @sjames1958gm |http://www.freecodecamp.org/sjames1958gm
Stephen James
@sjames1958gm
Feb 13 2018 14:59
@RomchyFCC :+1:
Raghav Mundra
@Raghav17
Feb 13 2018 15:08
I am doing Pig Latin from intermediate code challenges. Can anyone please tell me what it wrong with this?
function translatePigLatin(str) {
  var temp;
  var cc;
  for (i = 0; i<str.length; i++){
    if (str[i] == ("a" | "e"| "i" | "o" | "u")){
      temp = i;
      break;
    }
    else{
      continue;
    }
    var sub = str.substr(0,temp-1);
    var old = str.substr(temp);

    cc = old.concat(sub);







  }
return cc; 
}
ehutchllew
@ehutchllew
Feb 13 2018 15:14
@Raghav17 Sorry, what is the goal for this exercise?
Raghav Mundra
@Raghav17
Feb 13 2018 15:15

@ehutchllew
Translate the provided string to pig latin.

Pig Latin takes the first consonant (or consonant cluster) of an English word, moves it to the end of the word and suffixes an "ay".

If a word begins with a vowel you just add "way" to the end.

I have not completed it and doing it in parts , I was trying to make the cononant move at the end but it isnt working
ehutchllew
@ehutchllew
Feb 13 2018 15:17
@Raghav17 try pushing letters to a new array until you hit a vowel
or string instead of array, sorry.
Raghav Mundra
@Raghav17
Feb 13 2018 15:18
Okay, i will try that.
Ghost
@ghost~5a4a80acd73408ce4f859755
Feb 13 2018 15:20
Can anyone tell me why this isn't working please?


var centerX = mouseX;
var centerY = mouseY;
var bodyLength = 118;
var bodyHeight = 74;
var bodyColor = color(162, 0, 255);
var drawFish = function() {
    background(89, 216, 255);
    noStroke();
    fill(bodyColor);
    // body
    ellipse(centerX, centerY, bodyLength, bodyHeight);
    // tail
    var tailWidth = bodyLength/4;
    var tailHeight = bodyHeight/2;
    triangle(centerX-bodyLength/2, centerY,
         centerX-bodyLength/2-tailWidth, centerY-tailHeight,
         centerX-bodyLength/2-tailWidth, centerY+tailHeight);
    // eye
    fill(33, 33, 33);
    ellipse(centerX+bodyLength/4, centerY, bodyHeight/5, bodyHeight/5);
};
cjlynch12
@cjlynch12
Feb 13 2018 15:31
@MuhammedKarim what are you trying to get it to do?
and are you getting any errors when running it?
Ghost
@ghost~5a4a80acd73408ce4f859755
Feb 13 2018 15:32
when i put it in the drawFish function like above it comes out blank canvas
cjlynch12
@cjlynch12
Feb 13 2018 15:36
I'm seeing a fish when I go to that link and putting the code into the editor
do you have ad blockers on?
Ian Gracia
@iangracia
Feb 13 2018 15:59
Anyone keen to help me implement an OCR on codepen?
Stephen James
@sjames1958gm
Feb 13 2018 16:07
@MuhammedKarim When do you call drawFish? Looking at this code the centerX, centerY will be set once to some random mouse X.Y
Ghost
@ghost~5a4a80acd73408ce4f859755
Feb 13 2018 16:23
@cjlynch12 ad blockers are off
@sjames1958gm yeah silly me, it works now lol i forgot to call the function!
Alan Price
@alanpaulprice
Feb 13 2018 17:12

hey guys, would anyone here mind running this in the latest chrome and tell me if the audio loops like it should or breaks after playing once (like it does for me)
https://jsbin.com/wixomuy/edit?js,console

thanks!

Sweet Coding :)
@SweetCodingInc
Feb 13 2018 17:13
@alanpaulprice Chrome v64 has that issue
Alan Price
@alanpaulprice
Feb 13 2018 17:13
ah right, is there any work around or do you think i should just wait until they sort it out?
Sweet Coding :)
@SweetCodingInc
Feb 13 2018 17:13
As of now I have v63 and it's working for me
but I ran into similar issue on work machine that has v64
Alan Price
@alanpaulprice
Feb 13 2018 17:15
ah okay, thanks for clearing that up
thanks @SweetCodingInc
CamperBot
@camperbot
Feb 13 2018 17:15
alanpaulprice sends brownie points to @sweetcodinginc :sparkles: :thumbsup: :sparkles:
:cookie: 288 | @sweetcodinginc |http://www.freecodecamp.org/sweetcodinginc
Sweet Coding :)
@SweetCodingInc
Feb 13 2018 17:15
@alanpaulprice Yes.. There is a shitty workaround
console.clear();

let audioClip;// = new Audio("https://raw.githubusercontent.com/alanpaulprice/simon-game/master/Audio/simonSound1.mp3");

setInterval(function() {
  audioClip = new Audio("https://raw.githubusercontent.com/alanpaulprice/simon-game/master/Audio/simonSound1.mp3");
  audioClip.play();
  console.log('sound triggered');
}, 1000)
Alan Price
@alanpaulprice
Feb 13 2018 17:17
i see, sounds like the audio is still cutting out mid way though
i think i'll just wait until they get their shit together and iron it out
Sweet Coding :)
@SweetCodingInc
Feb 13 2018 17:18
@alanpaulprice Try adjusingt he delay then
Alan Price
@alanpaulprice
Feb 13 2018 17:21
@SweetCodingInc it works nicely in safari with the 1sec, as does the old snippet, but the premature cut off seems to be part of the chrome issue
Sweet Coding :)
@SweetCodingInc
Feb 13 2018 17:22
yeah...
even if you don't put that in interval, it seems to get cut off
Alan Price
@alanpaulprice
Feb 13 2018 17:24
@SweetCodingInc no worries, i'll just work on that project in a different browser for now. Thanks for the help :smile:
CamperBot
@camperbot
Feb 13 2018 17:24
alanpaulprice sends brownie points to @sweetcodinginc :sparkles: :thumbsup: :sparkles:
api offline
Sweet Coding :)
@SweetCodingInc
Feb 13 2018 17:24
@alanpaulprice :+1:
Roman Struna
@RomchyFCC
Feb 13 2018 17:51
@alanpaulprice i checked, i have the lastest version of chrome and it works fine, running windows 7 64x
Alan Price
@alanpaulprice
Feb 13 2018 17:52
@RomchyFCC oh right. i'm using a mac, so maybe it's just the mac version that's playing up. thanks for the info! :+1:
CamperBot
@camperbot
Feb 13 2018 17:52
alanpaulprice sends brownie points to @romchyfcc :sparkles: :thumbsup: :sparkles:
:cookie: 297 | @romchyfcc |http://www.freecodecamp.org/romchyfcc
Ghost
@ghost~5a4a80acd73408ce4f859755
Feb 13 2018 17:54
Can anyone advise a good website to learn PHP from?
Roman Struna
@RomchyFCC
Feb 13 2018 17:54
i had a similar issue with an input box, few days back, it would randomly disappear if someone using a mac would use that site, there are definitely some differences
and of course np, thx for the cookie nom nom
Ghost
@ghost~5a4a80acd73408ce4f859755
Feb 13 2018 17:55
I was going to learn from w3schools but I've been told its not good
Roman Struna
@RomchyFCC
Feb 13 2018 17:56
uhm @MuhammedKarim cs50 harvard edX used to have php lessons, maybe try looking those up(they switched to python in the last 2 years)
Alex Iveson
@AlexIveson_twitter
Feb 13 2018 17:58
hey friends can someoone please review something for me
super simple,
Roman Struna
@RomchyFCC
Feb 13 2018 17:58
i don't know how helpful these will be BUT, cs50 puts in a lot of effort to serve some of the best tutorials on the planet IMO, so here you go: first 5 videos https://www.youtube.com/user/cs50tv/search?query=php
Alex Iveson
@AlexIveson_twitter
Feb 13 2018 17:58
but I’m stuck early on this
Roman Struna
@RomchyFCC
Feb 13 2018 17:58
shoot alex
Alex Iveson
@AlexIveson_twitter
Feb 13 2018 17:59
@RomchyFCC thanks mate
CamperBot
@camperbot
Feb 13 2018 17:59
alexiveson_twitter sends brownie points to @romchyfcc :sparkles: :thumbsup: :sparkles:
:cookie: 298 | @romchyfcc |http://www.freecodecamp.org/romchyfcc
Alex Iveson
@AlexIveson_twitter
Feb 13 2018 17:59
I’m on "Inherit Styles from the Body Element” 47
and I beleive my code is correct

<style>
body {
background-color: green;
font-family: Monospace;
}

</style>

<h1>Hello World</h1>

Roman Struna
@RomchyFCC
Feb 13 2018 17:59
seems ok, what do you need it to do?
Alex Iveson
@AlexIveson_twitter
Feb 13 2018 18:00
but its saying I havent correctly done:
-Give your body element the color property of green.
and
-Your h1 element should inherit the color green from your body element.
Roman Struna
@RomchyFCC
Feb 13 2018 18:00
you are missing the body tag
Alex Iveson
@AlexIveson_twitter
Feb 13 2018 18:00
oh hell, haha
newwwwwwwwwwwwbie
gagaa
thanks mate.
Roman Struna
@RomchyFCC
Feb 13 2018 18:00
it happens, we've all been there, no worries
Alex Iveson
@AlexIveson_twitter
Feb 13 2018 18:01
this is correct now right

<style>
body {
background-color: green;
font-family: Monospace;
}

</style>

<body>
<h1>Hello World</h1>
</body>

Roman Struna
@RomchyFCC
Feb 13 2018 18:01
yup :) gj
Alex Iveson
@AlexIveson_twitter
Feb 13 2018 18:01
well, its still not letting me pass……. fml
haha
Roman Struna
@RomchyFCC
Feb 13 2018 18:02
huh
Alex Iveson
@AlexIveson_twitter
Feb 13 2018 18:02
does FCC ever glitch out and require me to clear code and start again to pass?
is that a thing
Roman Struna
@RomchyFCC
Feb 13 2018 18:02
oh, put it all in the style tag
usually not
Ghost
@ghost~5a4a80acd73408ce4f859755
Feb 13 2018 18:02
@RomchyFCC wooow they have soo many lol which one do i start from
Also, i would prefer to learn like how they teach on FCC and w3, where you can learn and practice on the website!
Roman Struna
@RomchyFCC
Feb 13 2018 18:04
@AlexIveson_twitter gonna check this out, just a sec
@MuhammedKarim i haven't heard of anything like that sorry
cjlynch12
@cjlynch12
Feb 13 2018 18:04
@AlexIveson_twitter are you sure it wants the background color to be green, or the font color to be green?
Alex Iveson
@AlexIveson_twitter
Feb 13 2018 18:04
@RomchyFCC yes

“Then, let's give all elements on your page the color of green by adding color: green; to your body element's style declaration.

Finally, give your body element the font-family of Monospace by adding font-family: Monospace; to your body element's style declaration."

cjlynch12
@cjlynch12
Feb 13 2018 18:05
replace background-color with just color and try it
Alex Iveson
@AlexIveson_twitter
Feb 13 2018 18:05
@cjlynch12 Ok thanks
CamperBot
@camperbot
Feb 13 2018 18:05
alexiveson_twitter sends brownie points to @cjlynch12 :sparkles: :thumbsup: :sparkles:
api offline
Alex Iveson
@AlexIveson_twitter
Feb 13 2018 18:05
@cjlynch12 THAT WAS IT! Thanks!
CamperBot
@camperbot
Feb 13 2018 18:05
alexiveson_twitter sends brownie points to @cjlynch12 :sparkles: :thumbsup: :sparkles:
api offline
Roman Struna
@RomchyFCC
Feb 13 2018 18:05
yea was just about to post it, it wants the color change not the background haha :D
cjlynch12
@cjlynch12
Feb 13 2018 18:06
no problem! when in doubt, it's usually the easiest fix for the toughest problem
Alex Iveson
@AlexIveson_twitter
Feb 13 2018 18:06
weird because the default code in the window starts with “background-color"
oh well, its fixed now!
cjlynch12
@cjlynch12
Feb 13 2018 18:06
classic gotcha problem lol
Alex Iveson
@AlexIveson_twitter
Feb 13 2018 18:06
onwards and upwards!
Ghost
@ghost~5a4a80acd73408ce4f859755
Feb 13 2018 18:38
Need some help with a JS animation, can anyone help me out please?
Thierno Sadou Diallo
@thierved
Feb 13 2018 18:39
hello! I need help with the twichtv project. the given api link is not working.
Brad
@bradtaniguchi
Feb 13 2018 18:41
@thierved Did you read about the change to the challenge on point #9?
Thierno Sadou Diallo
@thierved
Feb 13 2018 18:43
@bradtaniguchi no .
Brad
@bradtaniguchi
Feb 13 2018 18:44

@thierved I guess twitched changed their API, so you need to use a different one. This is the text for bullet point #9 of the challenge

"UPDATE: Due to a change in conditions on API usage explained here Twitch.tv now requires an API key, but we've built a workaround. Use https://wind-bow.glitch.me/twitch-api instead of twitch's API base URL (i.e. https://api.twitch.tv/kraken ) and you'll still be able to get account information, without needing to sign up for an API key."

Here's how to use it:
https://wind-bow.glitch.me/
Thierno Sadou Diallo
@thierved
Feb 13 2018 18:48
@bradtaniguchi this is what I get when I use the url : {
status: 404,
error: "not found"
}
remember that /streams will return an empty JSON object if the channel is not online
in which case use profile/channel
Brad
@bradtaniguchi
Feb 13 2018 18:51
Idk how the "fake" api actually works
but I know this route (which is provided in the challenge) works
Stephen James
@sjames1958gm
Feb 13 2018 18:52
@RomchyFCC The api does return a json object for /streams, just that there is no stream data in the object
Roman Struna
@RomchyFCC
Feb 13 2018 18:52
i knew that been working on the project most of my morning :) i just worded myself wrong :(
i fixed it :) i think
Thierno Sadou Diallo
@thierved
Feb 13 2018 18:53
yes I read it now! am I supposed to use the hard coded json api?
Brad
@bradtaniguchi
Feb 13 2018 18:54
@thierved Not sure what you mean hard coded json api
Ghost
@ghost~5a4a80acd73408ce4f859755
Feb 13 2018 18:55
Can someone help me out with this please?
https://codepen.io/MuhammedK/pen/oEeYPM?editors=1010
Roman Struna
@RomchyFCC
Feb 13 2018 18:55
there is a hard coded option in one of the "fixes"
what do you need @MuhammedKarim
Gulsvi
@gulsvi
Feb 13 2018 18:55
@thierved Don't hard code the data, use the URL they provide to you in the challenge, an example is provided above by @bradtaniguchi
^ notice how that uses glitch.me not gomix.me
For different users, replace OgamingSC2 with the user name
Roman Struna
@RomchyFCC
Feb 13 2018 18:56
gomix also wark but you have to provide the callback in the url
Ghost
@ghost~5a4a80acd73408ce4f859755
Feb 13 2018 18:56
How the heck do i do this lol @RomchyFCC
image.png
Thierno Sadou Diallo
@thierved
Feb 13 2018 18:56
@RomchyFCC thank you ! this link works!
CamperBot
@camperbot
Feb 13 2018 18:56
thierved sends brownie points to @romchyfcc :sparkles: :thumbsup: :sparkles:
:cookie: 302 | @romchyfcc |http://www.freecodecamp.org/romchyfcc
Roman Struna
@RomchyFCC
Feb 13 2018 18:56
np, gl
Gulsvi
@gulsvi
Feb 13 2018 18:56
gomix "works" but why go through a redirect and the need for JSONP when you don't have to?
Roman Struna
@RomchyFCC
Feb 13 2018 18:56
you don't need jsonp
Gulsvi
@gulsvi
Feb 13 2018 18:57
Adding callback=? tells jQuery to use JSONP
Roman Struna
@RomchyFCC
Feb 13 2018 18:57
scratch that
Thierno Sadou Diallo
@thierved
Feb 13 2018 18:57
@bradtaniguchi thank you , I've found a link
CamperBot
@camperbot
Feb 13 2018 18:57
thierved sends brownie points to @bradtaniguchi :sparkles: :thumbsup: :sparkles:
:cookie: 365 | @bradtaniguchi |http://www.freecodecamp.org/bradtaniguchi
Ghost
@ghost~5a4a80acd73408ce4f859755
Feb 13 2018 18:58
@RomchyFCC u know how to do it or naah?
Roman Struna
@RomchyFCC
Feb 13 2018 18:58
@MuhammedKarim you're doing the khan academy course :)?
Tom
@moT01
Feb 13 2018 18:58
you made some fish @MuhammedKarim
so you know how to make a fish
Ghost
@ghost~5a4a80acd73408ce4f859755
Feb 13 2018 18:58
yeah man i need to learn JS coz i cant code it to save my fish @RomchyFCC
yeaah @moT01
Tom
@moT01
Feb 13 2018 18:58
so do this...
onclick
get click location
draw fish at location
Brad
@bradtaniguchi
Feb 13 2018 18:58
@thierved np :D
Roman Struna
@RomchyFCC
Feb 13 2018 18:59
i do know, you make a fish into a function
i.e: makeFish();
then you add an event listener and everytime you click, call makeFish()
Ghost
@ghost~5a4a80acd73408ce4f859755
Feb 13 2018 18:59
but how do i make a fish with random colours and size and all? i cant have the same one...
Roman Struna
@RomchyFCC
Feb 13 2018 18:59
Math.random()
Ghost
@ghost~5a4a80acd73408ce4f859755
Feb 13 2018 19:00
im a newbie lmao idk how i'll make that work
Tom
@moT01
Feb 13 2018 19:00
put parameters in the function
drawFish(x,y,color,size)
Ghost
@ghost~5a4a80acd73408ce4f859755
Feb 13 2018 19:01
how??
ohhh
Roman Struna
@RomchyFCC
Feb 13 2018 19:01
@gulsvi thanks for the correction
CamperBot
@camperbot
Feb 13 2018 19:01
romchyfcc sends brownie points to @gulsvi :sparkles: :thumbsup: :sparkles:
:star2: 2603 | @gulsvi |http://www.freecodecamp.org/gulsvi
krckyboy
@krckyboy
Feb 13 2018 19:06
Hey, guys. Could you recommend a website for free videos? I need a short promo-like video of a beauty salon / women getting their makeup done.
Barbara Pentoney
@flyfishingbarbara
Feb 13 2018 19:23
hi there...can someone plz help me with the twitter button for 'random quote machine' ...?? thanks!project....https://codepen.io/flyfishingbarbara/pen/MQaRaL
I got it to open up a new window but not sure about how to get quote to show up...
@krckyboy can you use 'how to' vids...??
Stephen James
@sjames1958gm
Feb 13 2018 19:32
@flyfishingbarbara You need to make a "global" that holds the last quote
var tweetUrl = "";
In your getJSON callback
tweetURL = "https://twitter.com/intent/tweet?text=" + data[0].content + "— " + data[0].title
then in your click for tweet
window.open(tweetUrl);
@flyfishingbarbara I your quotes have special characters you might need to use encodeURIComponent to encoding
encodeURIComponent(data[0].content)
Barbara Pentoney
@flyfishingbarbara
Feb 13 2018 19:36
@sjames1958gm I had another classmate use this 'encodeURIcomponent' and I wasn't sure what that was all about....i'll read up on it...
Stephen James
@sjames1958gm
Feb 13 2018 19:36
@flyfishingbarbara :+1:
Barbara Pentoney
@flyfishingbarbara
Feb 13 2018 19:37
@sjames1958gm go Chelsea!
Stephen James
@sjames1958gm
Feb 13 2018 19:37
@flyfishingbarbara :) better result yesterday
Barbara Pentoney
@flyfishingbarbara
Feb 13 2018 19:37
I will also read and understand the global variable bit...!! thanks!
...haha...I missed it...I was watching tennis
jmf
@jmfcodes
Feb 13 2018 19:56
hi, everyone! I've been working on my local weather app, and I finally have to publicly admit that making things pretty on the front end is not my strong suit. do you have any suggestions or references for some basic tips to making sites pretty? and modern? whenever I work too hard at something, it starts to look like Geocities circa 1995 :)
this is what i'm trying to make pretty: https://codepen.io/jmfcodes/full/VQjyYJ/
ogwel5
@ogwel5
Feb 13 2018 20:26
hi everyone...i am trying to make the google home page...and i am stuck with the navigations...i need help to align my navs
Tom
@moT01
Feb 13 2018 20:26
@jennifermf try and replicate some simple sites out there
whats the problem @ogwel5
ogwel5
@ogwel5
Feb 13 2018 20:29
the problem is i cant get the gmail images and the icon to look like that of google
@moT01 the whole navigation is not in the same line and ita all attached together...finally i cant move the whole footer down
MichaelGngr
@MichaelGngr
Feb 13 2018 20:32
Web technology for developers > Web APIs it is in MDN site, for what languages are exist this APIs?
Tom
@moT01
Feb 13 2018 20:32
font family and font size would get it looking closer - and maybe some margin
@ogwel5 you can't link to an image on your computer through codepen
codepen doesnt have access to your hard drive
ogwel5
@ogwel5
Feb 13 2018 20:34
@moT01 actually the images are fine and i understand that...look at the header...nav ..i am stuck there
to put them in one line and separate gmail icon and images they are all attached
Tom
@moT01
Feb 13 2018 20:36
add a margin
a {
  margin: 10px; }
or padding
put them in one line?
Ghost
@ghost~5a4a80acd73408ce4f859755
Feb 13 2018 20:38
Do you reckon you could help me out with that code for the fish tank?
@moT01
MichaelGngr
@MichaelGngr
Feb 13 2018 20:42
@jorgemoya
Web technology for developers > Web APIs it is in MDN site, for what languages are exist this APIs?
Tom
@moT01
Feb 13 2018 21:06
@MuhammedKarim lets take another look
Ghost
@ghost~5a4a80acd73408ce4f859755
Feb 13 2018 21:14
Kaz Baig
@kbaig
Feb 13 2018 21:16
Has anyone tried deploying a project on Glitch?
Tiago Correia
@tiagocorreiaalmeida
Feb 13 2018 21:19
@kbaig yeah
Kaz Baig
@kbaig
Feb 13 2018 21:23
@tiagocorreiaalmeida I'm getting a bunch of errors in the log related to node package installation when I try importing a project from github
Tiago Correia
@tiagocorreiaalmeida
Feb 13 2018 21:24
if you have package.json nested in folders it wont install them
Ghost
@ghost~5a4a80acd73408ce4f859755
Feb 13 2018 21:25
@moT01 i dont understand how i can make a random fish...
Kaz Baig
@kbaig
Feb 13 2018 21:25
It is trying to install them but the errors look something like npm ERR! tar.unpack untar error /tmp/npm-cache/6.12.3/core-js/2.5.3/package.tgz 3:20 PM
Tom
@moT01
Feb 13 2018 21:25
@MuhammedKarim all that stuff you're doing... when you find yourself writing the same line of code multiple times you should think about putting it into a reusable function
as for a random fish - you can make one just like you did - instead of putting in x,y values yourself - make x and y random
x = math.random
Tiago Correia
@tiagocorreiaalmeida
Feb 13 2018 21:27
@kbaig it seems an issue with the package but never runned into it if you google it what comes up?
Ghost
@ghost~5a4a80acd73408ce4f859755
Feb 13 2018 21:28
image.png
that doesnt work there for some reason @moT01
Kaz Baig
@kbaig
Feb 13 2018 21:28
@tiagocorreiaalmeida since they named the site Glitch, it's not easy to search for issues specific to it lol
Tom
@moT01
Feb 13 2018 21:31
yea, that's not how to get a random number
Ghost
@ghost~5a4a80acd73408ce4f859755
Feb 13 2018 21:34
that still doesn't work :( @moT01
image.png
Tom
@moT01
Feb 13 2018 21:35
what repo
Ghost
@ghost~5a4a80acd73408ce4f859755
Feb 13 2018 21:36
Now that is amazing, that's really cool
but my main issue was making a random sized and coloured fish at each click...
Tom
@moT01
Feb 13 2018 21:37
start with putting a fish on in a random spot
get a random x and y
Math.floor(Math.random() * 20)) will give you a number between 0 and 19
you can console.log it to see for yourself
var random = Math.floor(Math.random() * 20));
console.log(random);
Ghost
@ghost~5a4a80acd73408ce4f859755
Feb 13 2018 21:47
@moT01 im working on it but things just dont add up :(
ogwel5
@ogwel5
Feb 13 2018 21:49
hi is there anyone who can help make my horizontal navigation bar be in straight?..getting that icon in the same line a others
Tom
@moT01
Feb 13 2018 21:50
@ogwel5 i would use flexbox
you can align things vertically
Eric Weiss
@eweiss17
Feb 13 2018 21:56
if you are recreating the google homepage, you can use the icons google provides, https://material.io/icons/
apps and notifications
Ghost
@ghost~5a4a80acd73408ce4f859755
Feb 13 2018 22:00
@moT01 no luck maan :(
Tom
@moT01
Feb 13 2018 22:07
why not
can you make a random number?
Ghost
@ghost~5a4a80acd73408ce4f859755
Feb 13 2018 22:13
yes
but then to make it into a fish with all the shapes and coordinates....it just doesnt work out @moT01
ogwel5
@ogwel5
Feb 13 2018 22:25
@moT01 @eweiss17 thanks..it has workedd
CamperBot
@camperbot
Feb 13 2018 22:25
ogwel5 sends brownie points to @mot01 and @eweiss17 :sparkles: :thumbsup: :sparkles:
:cookie: 989 | @mot01 |http://www.freecodecamp.org/mot01
:cookie: 610 | @eweiss17 |http://www.freecodecamp.org/eweiss17
Barbara Pentoney
@flyfishingbarbara
Feb 13 2018 22:38
@sjames1958gm are you still there...??
Christopher Susi
@chrisandsuch
Feb 13 2018 22:51
Hey everyone, if anyone could take a look at this TicTacToe game I would greatly appreciate it. I’m having an issue for one player I can’t seem to get the code just right for the computer to always win. https://codepen.io/chrisandsuch/pen/XZRYZE
Gulsvi
@gulsvi
Feb 13 2018 23:05
@krckyboy You might try one of the sites listed here: https://github.com/neutraltone/awesome-stock-resources#videos
Gulsvi
@gulsvi
Feb 13 2018 23:10
@ogwel5
li.right img {
  vertical-align: middle;
}
LydaTech
@lydatech
Feb 13 2018 23:13
@ogwel5 still around?
firefox14
@firefox14
Feb 13 2018 23:14
no offense but your ai is a bit dumb on your tictactoe
oh nvm
Gulsvi
@gulsvi
Feb 13 2018 23:14
@flyfishingbarbara Instead of messing around with global variables, make your buttons hyperlinks (keep the class names the same so they still look like buttons). Then you can just update the href= value for the twitter link every time someone clicks "Get Quote"

For example, with this HTML:

<a id="tweetIt" class="btn btn-primary text-light">Tweet It</a>

Update the href with:

$("#tweetIt").attr("href", tweetUrl);
Do everything in your getJSON callback function so the data[0] is in scope
Gulsvi
@gulsvi
Feb 13 2018 23:57
(be sure to add target="_blank" for codepen)