These are chat archives for FreeCodeCamp/HelpFrontEnd

1st
Jan 2018
Daniel Tweedy
@DanielTweedy
Jan 01 2018 00:21
Are there problems with mailto links in Codepen, I'm trying to set one up with my personal portfolio but it doesn't seem to open up Thunderbird https://codepen.io/MelBrooksKA/pen/ZOvrAA
Tiago Correia
@tiagocorreiaalmeida
Jan 01 2018 00:24
remove
the target"_blank"
and it will work :D
Daniel Tweedy
@DanielTweedy
Jan 01 2018 00:24
I did, I think I just forgot to save it
Tiago Correia
@tiagocorreiaalmeida
Jan 01 2018 00:25
oh then just save and it will work
Daniel Tweedy
@DanielTweedy
Jan 01 2018 00:26
It doesn't seem to be, the form isn't working either and that doesn't have a "_blank" in it
kerafyrm02
@kerafyrm02
Jan 01 2018 00:27
just fyi mailto doesnt work in chrome unless you enable it--- by default it's disabled
Daniel Tweedy
@DanielTweedy
Jan 01 2018 00:28
Okay, that's probably it
Daniel Tweedy
@DanielTweedy
Jan 01 2018 00:36
@kerafyrm02 thanks
CamperBot
@camperbot
Jan 01 2018 00:36
danieltweedy sends brownie points to @kerafyrm02 :sparkles: :thumbsup: :sparkles:
:cookie: 270 | @kerafyrm02 |http://www.freecodecamp.org/kerafyrm02
Yingjie (Iris) Hu
@huyingjie
Jan 01 2018 02:33
https://codepen.io/yingjiehu/pen/JMjVVE?editors=1111 It gives an error Uncaught ReferenceError: Popper is not defined. But I added https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.6/popper.min.js in the codepen setting.
How to fix the error?
Henry
@GitHub-Henry
Jan 01 2018 02:50
@huyingjie i gotta go soon, not sure about the popper reference error, but how about fixing the extra and missing semi colons.
image.png
kerafyrm02
@kerafyrm02
Jan 01 2018 02:55
Who needs help?
Yingjie (Iris) Hu
@huyingjie
Jan 01 2018 02:55
@GitHub-Henry I added the missing semi colons. The error still existed in the console.
kerafyrm02
@kerafyrm02
Jan 01 2018 02:56
Hi Ying. What are you stuck on?
Yingjie (Iris) Hu
@huyingjie
Jan 01 2018 02:56
@kerafyrm02 I need help ☺️
kerafyrm02
@kerafyrm02
Jan 01 2018 02:56
Sure what's the prob?
Yingjie (Iris) Hu
@huyingjie
Jan 01 2018 02:56
Screen Shot 2017-12-31 at 9.56.28 PM.png
kerafyrm02
@kerafyrm02
Jan 01 2018 02:57
It says undefined
So you need to do var Popper;
And that's without looking at your code.
Yingjie (Iris) Hu
@huyingjie
Jan 01 2018 02:58
popper is in popper.js which is made by bootstrap.
kerafyrm02
@kerafyrm02
Jan 01 2018 02:59
Ok but if you're reading error message it's undefined. So you need to define it.
A simple code like...
var Popper = Popper || {};
because it's undefined.
it's breaking your js code
add that semicolon at end.
Yingjie (Iris) Hu
@huyingjie
Jan 01 2018 03:03
I added it to line 4. The error still exsits.
kerafyrm02
@kerafyrm02
Jan 01 2018 03:04
Yeah because it needs to go in the JS file where the error is occuring
sec
ill tell you where
btw i hate bootstrap lol
It seems you're not adding the right popper file
kerafyrm02
@kerafyrm02
Jan 01 2018 03:13
You're missing a file which declares Popper object
kerafyrm02
@kerafyrm02
Jan 01 2018 03:21
ok the issue is you're using import
inside the bootstrap file you're adding. only certain browsers support it right now
ie babel
Henry
@GitHub-Henry
Jan 01 2018 03:27
@huyingjie i don't know anything about popper but the example defines a popper variable, perhaps you need to define a popper variable. https://popper.js.org/
image.png
Ismail Hozain
@ismailhozain
Jan 01 2018 03:27
@gothamknight thanks i really liked that tutorial!
CamperBot
@camperbot
Jan 01 2018 03:27
ismailhozain sends brownie points to @gothamknight :sparkles: :thumbsup: :sparkles:
:cookie: 474 | @gothamknight |http://www.freecodecamp.org/gothamknight
iso
@iso1048
Jan 01 2018 03:28
no worries bro
Ismail Hozain
@ismailhozain
Jan 01 2018 03:28
but quick question -how do i make the size variable
like make it responsive (the image and title)
Yingjie (Iris) Hu
@huyingjie
Jan 01 2018 03:30
@GitHub-Henry My project on my computer is without error. After I copied it to the codepen, then the error appeared.
@GitHub-Henry I do not use any popper in my code. But the console in the browser asked me to add propper. I searched online and it said it was because bootstrap used it.
Henry
@GitHub-Henry
Jan 01 2018 03:32
i saw several folks having a problem with popper with bs4, can you try bs3 and see if the problem persists?
Yingjie (Iris) Hu
@huyingjie
Jan 01 2018 03:34
@kerafyrm02 I see. Safari can show contents correctly without error while Chrome shows error. I am not sure whether it is ok to submit the project like this.
Henry
@GitHub-Henry
Jan 01 2018 03:35
your design looks simple, perhaps doable with flexbox, then you don't need bs and it's problems with popper are gone
here's a flexbox tutorial http://flexboxfroggy.com/
not sure you want to go that way, i don't use bs, so i'm not the best resource for help with it
Yingjie (Iris) Hu
@huyingjie
Jan 01 2018 03:39
@GitHub-Henry Thank you. flexbox is interesting
CamperBot
@camperbot
Jan 01 2018 03:39
huyingjie sends brownie points to @github-henry :sparkles: :thumbsup: :sparkles:
:cookie: 519 | @github-henry |http://www.freecodecamp.org/github-henry
Henry
@GitHub-Henry
Jan 01 2018 03:43
@huyingjie Good luck and happy new year.
Yingjie (Iris) Hu
@huyingjie
Jan 01 2018 03:43
@GitHub-Henry Happy New Year!
TheRedstoneTaco
@TheRedstoneTaco
Jan 01 2018 03:54
New Year!
VaseJS
@VaseJS
Jan 01 2018 03:55
@TheRedstoneTaco Where?
only 21:55 here
TheRedstoneTaco
@TheRedstoneTaco
Jan 01 2018 03:55
@VaseJS New Year!
VaseJS
@VaseJS
Jan 01 2018 03:56
But it is where you maybe. Happy New Year!
TheRedstoneTaco
@TheRedstoneTaco
Jan 01 2018 03:56
New Year!
Amy Zhang
@zhangjinting
Jan 01 2018 04:18
Happy New Year!
kerafyrm02
@kerafyrm02
Jan 01 2018 04:23
only 2123 here
VaseJS
@VaseJS
Jan 01 2018 04:25
@kerafyrm02 only?
TheRedstoneTaco
@TheRedstoneTaco
Jan 01 2018 04:26
New Year!
VaseJS
@VaseJS
Jan 01 2018 04:28
oh, thought you were talking about the number of people here :P
kerafyrm02
@kerafyrm02
Jan 01 2018 04:29
lol
TheRedstoneTaco
@TheRedstoneTaco
Jan 01 2018 04:30
New Year!
Ken Haduch
@khaduch
Jan 01 2018 04:58
Hey FCC colleagues - wishing you all a happy New Year 2018!
VaseJS
@VaseJS
Jan 01 2018 04:59
@khaduch happy new year
TheRedstoneTaco
@TheRedstoneTaco
Jan 01 2018 05:09
New Year!
Yingjie (Iris) Hu
@huyingjie
Jan 01 2018 05:12
Happy New year
TheRedstoneTaco
@TheRedstoneTaco
Jan 01 2018 05:13
new Year!
dinesh
@1532j0004kg
Jan 01 2018 05:47
hi
this code is not working !
when i on going live channels url its working but when i give the url of not streaming any thing live , is not working.
can any help me?
thanks
coderAkmal
@coderAkmal
Jan 01 2018 06:09
Happy New year folks :)
Have a bug free year ahead ;p
dinesh
@1532j0004kg
Jan 01 2018 06:09
:smile: happie new yesr
got the solution :smile:
coderAkmal
@coderAkmal
Jan 01 2018 06:10
Thats great
Btw I am stuck. hahahha
dinesh
@1532j0004kg
Jan 01 2018 06:10
good start to 2018 :smile:
u need help :smile:
coderAkmal
@coderAkmal
Jan 01 2018 06:11
for some reason my external css on codepen doesnn;t work specifically for h1 tag
I cant change color using color:white
dinesh
@1532j0004kg
Jan 01 2018 06:12
use with in quotes!
color : "white" like this !
if u can post ur code!
here you go. Look at the css. everything works fine but i cant change the color of h1 from there
@1532j0004kg
dinesh
@1532j0004kg
Jan 01 2018 06:15
checking !
coderAkmal
@coderAkmal
Jan 01 2018 06:15
ok
dinesh
@1532j0004kg
Jan 01 2018 06:16
change with id
set the id for h1 tag
and change the color ,
i think some color is over lapping ,
use id it will work!!!!
VaseJS
@VaseJS
Jan 01 2018 06:17
@1532j0004kg sometimes codepen acts strange but your code should have worked the way it was
dinesh
@1532j0004kg
Jan 01 2018 06:17
@coderAkmal
@VaseJS yup!!!
coderAkmal
@coderAkmal
Jan 01 2018 06:18
OK So it works using id
dinesh
@1532j0004kg
Jan 01 2018 06:18
nice!
coderAkmal
@coderAkmal
Jan 01 2018 06:18
but I wnder why it doesn't work without id
wonder
VaseJS
@VaseJS
Jan 01 2018 06:18
i stopped working with codepen because i would get some strange issues randomly.
coderAkmal
@coderAkmal
Jan 01 2018 06:19
@VaseJS So where do you host your projects
?
VaseJS
@VaseJS
Jan 01 2018 06:19
@1532j0004kg from a css standpoint, one should avoid ids whenever possible, but its a weather app so its cool
coderAkmal
@coderAkmal
Jan 01 2018 06:19
Btw Thanks @1532j0004kg
CamperBot
@camperbot
Jan 01 2018 06:19
coderakmal sends brownie points to @1532j0004kg :sparkles: :thumbsup: :sparkles:
:cookie: 263 | @1532j0004kg |http://www.freecodecamp.org/1532j0004kg
VaseJS
@VaseJS
Jan 01 2018 06:19
@coderAkmal i may post them in codepen for others to view, but i generally work them offline first or in my environment and past the good code to codepen for display
don't forget my brownies too?
Will review for brownies
coderAkmal
@coderAkmal
Jan 01 2018 06:20
Sure. Thanks @VaseJS
CamperBot
@camperbot
Jan 01 2018 06:20
coderakmal sends brownie points to @vasejs :sparkles: :thumbsup: :sparkles:
:cookie: 404 | @vasejs |http://www.freecodecamp.org/vasejs
coderAkmal
@coderAkmal
Jan 01 2018 06:21
Please do the review. it will be of great help
VaseJS
@VaseJS
Jan 01 2018 06:21
i thought i got a 404 brownie error. i've been in the backend too much
coderAkmal
@coderAkmal
Jan 01 2018 06:21
hahah
dinesh
@1532j0004kg
Jan 01 2018 06:21
@coderAkmal i think because of jumbotron
coderAkmal
@coderAkmal
Jan 01 2018 06:22
@1532j0004kg How?
dinesh
@1532j0004kg
Jan 01 2018 06:22
if u remove the jumbotron that works perfectly!
VaseJS
@VaseJS
Jan 01 2018 06:23
@1532j0004kg really. that strange. jumbo only sets background
u can see here y?
coderAkmal
@coderAkmal
Jan 01 2018 06:24
Well, It does work after removing the jumbotron but that doesn't make any sense.
dinesh
@1532j0004kg
Jan 01 2018 06:25
becauz u trying to over ride the bootstrap style thats y it's not working properly!
coderAkmal
@coderAkmal
Jan 01 2018 06:26
Ok. but how come I am able to change the bootstrap background color but can't change the h1 tag color?
Am I not overridnig anything when I am changing the background color?
VaseJS
@VaseJS
Jan 01 2018 06:27
@1532j0004kg i saw jumbotrong and thought bootstrap, but wasn't sure. then yea, that makes sense because there are other things at play in the background we can't see
dinesh
@1532j0004kg
Jan 01 2018 06:28
i think .jumbotron contains the color must be black.
VaseJS
@VaseJS
Jan 01 2018 06:28
@coderAkmal thats the problem with CSS. things have to be in order. and because you're working on Codepen, we don' t know that order or the order with bootstrap or the level of specificity they are using
these are all important and with css
dinesh
@1532j0004kg
Jan 01 2018 06:28
@VaseJS exactly
coderAkmal
@coderAkmal
Jan 01 2018 06:29
OK now I get it
VaseJS
@VaseJS
Jan 01 2018 06:29
you must understand what bootstrap is doing in the background or it will cause all types of headaches
dinesh
@1532j0004kg
Jan 01 2018 06:29
:smile: happie new year
coderAkmal
@coderAkmal
Jan 01 2018 06:29
so basically it can be codepen's fault
VaseJS
@VaseJS
Jan 01 2018 06:29
@coderAkmal lol
i wouldn't say that completel
y
coderAkmal
@coderAkmal
Jan 01 2018 06:29
;p
VaseJS
@VaseJS
Jan 01 2018 06:29
:D
but for 2018...yea, its them
dinesh
@1532j0004kg
Jan 01 2018 06:30
free new year dont think lot :smile:
VaseJS
@VaseJS
Jan 01 2018 06:30
drop bootstrap and save all your worries
learn css for 2018
not just any css, but modern css
coderAkmal
@coderAkmal
Jan 01 2018 06:30
haha i already know css
VaseJS
@VaseJS
Jan 01 2018 06:30
that seems debatable :D
but i guess we must define "know"
Tony Brackins
@mrbrackins
Jan 01 2018 06:31
lol I was about to say, what do you mean “know” css?
VaseJS
@VaseJS
Jan 01 2018 06:31
@mrbrackins darkness everybody!
came from nowhere
coderAkmal
@coderAkmal
Jan 01 2018 06:31
@VaseJS bring it on ;p
VaseJS
@VaseJS
Jan 01 2018 06:31
lol
@coderAkmal i don't think you're ready for that
Tony Brackins
@mrbrackins
Jan 01 2018 06:32
I have no idea of the context of convo. Just opened gitter lol
coderAkmal
@coderAkmal
Jan 01 2018 06:32
Come on. I might learn something new
VaseJS
@VaseJS
Jan 01 2018 06:32
@mrbrackins just helped @coderAkmal with a bootstrap css issue. all caught up :D
coderAkmal
@coderAkmal
Jan 01 2018 06:33
@VaseJS
VaseJS
@VaseJS
Jan 01 2018 06:33
@coderAkmal
he wasn't ready
@coderAkmal would like a css challenge question?
coderAkmal
@coderAkmal
Jan 01 2018 06:34
Sure
VaseJS
@VaseJS
Jan 01 2018 06:34
why is using ids a bad idea and should generally be avoided with css?
coderAkmal
@coderAkmal
Jan 01 2018 06:36
Well, lemme think
VaseJS
@VaseJS
Jan 01 2018 06:37
coderAkmal
@coderAkmal
Jan 01 2018 06:38
well, I guess it cant be reused
VaseJS
@VaseJS
Jan 01 2018 06:38
you don't know css it seems. this is only the first question
coderAkmal
@coderAkmal
Jan 01 2018 06:38
well, Until now I thought i knew it
VaseJS
@VaseJS
Jan 01 2018 06:38
using the syntax and understanding css are two different things.
that's why its a challenge question
coderAkmal
@coderAkmal
Jan 01 2018 06:39
but whats the answer
VaseJS
@VaseJS
Jan 01 2018 06:39
fail
lol
specificity
coderAkmal
@coderAkmal
Jan 01 2018 06:40
Will you elaborate
?
VaseJS
@VaseJS
Jan 01 2018 06:40
but do you understand what the problem is with specificity? another challenge question
lol
coderAkmal
@coderAkmal
Jan 01 2018 06:41
OK. I have decided I need t learn more of css
haha
to*
VaseJS
@VaseJS
Jan 01 2018 06:41
@coderAkmal lol
good
so i'll explain
most people write poor css
coderAkmal
@coderAkmal
Jan 01 2018 06:42
ok. And ?
VaseJS
@VaseJS
Jan 01 2018 06:42
css stands for cascading style sheets but people don't fully understand cascading!...
(wasn't done typing)...
so when you code a small site, it doesn't matter much, but when you deal with anything that has to scale and when more than one person coding css, you can have what is called specificity wars
coderAkmal
@coderAkmal
Jan 01 2018 06:43
Go on
VaseJS
@VaseJS
Jan 01 2018 06:43
when i have a id called #header and its white...
and someone else writes a #h1 id blue, which one wins if they are both in an h1 tag?...
coderAkmal
@coderAkmal
Jan 01 2018 06:46
I dont understand your question
VaseJS
@VaseJS
Jan 01 2018 06:46
in order to fix it, people generally write more id tags or try to work around it by getting more specific so #header h1 white vs the other #h1 blue. this is brittle and breaks easy. if someone does that in another css file, i have to hunt down the conflicting css code to debug it
like you did with the jumbotron and your h1 tage
what you experience was a specificity conflict
most css experts avoid ids for this reason
ids are too specific on non-simple sites and cause a lot of issues with specificity wars (whos code should take priority)
with you having the issue on a major scale, or being able to show you, it may not make much sense
but thats why you avoid ids
Kartik Mudgal
@Sprinting
Jan 01 2018 07:21
Why would you place two ids in the same tag
and if you don't then h1#header and h1#h1` are very specific
VaseJS
@VaseJS
Jan 01 2018 07:28
@Sprinting people do it all the time. on a simple project, its silly, but bigger projects could have 20 classes and a few ides all in one place
depends on what each id is for so it can work.
avoiding ids is the main point. if you're planning on doing any significant about of front-end work...avoid ids to save yourself from css hell
Kartik Mudgal
@Sprinting
Jan 01 2018 07:37
I don't use id's any way
the data- and [attr] and a few class selectors are enough for most of the work i do
but I was confused about two ids on a single element
VaseJS
@VaseJS
Jan 01 2018 07:38
@Sprinting data- is not meant for css
that is a bad practice
classes will handle 98% of css needs
Kartik Mudgal
@Sprinting
Jan 01 2018 07:41
data- is useful tho when a major part of the ui is performing the same thing and you want to address it all, you could also go to child selectors for that tho. Besides data- is a subset of [attr='value'] selectors. I don't see why that is bad unless you spam it
VaseJS
@VaseJS
Jan 01 2018 07:44
i understand your reasoning and on small projects it works, but for major production, its bad practice. we can get away with a lot on small personal sites/projects, but in doing so, we create bad habits have consequence. coding on a team is different and those things change which would break a site causing it to be brittle. that would throw everything off schedule (causing money) just over a bad practice. that's why its a bad practice.
css should only deal with css. data- is for another reason and css should not use it for hooks
alpox
@alpox
Jan 01 2018 10:55
@Sprinting chiming in here just to support. Please NO data- use in selectors! Just no!
Jigal Sanders
@sandersjj
Jan 01 2018 11:30
Happy new year everyone
Jigal Sanders
@sandersjj
Jan 01 2018 11:43
I am trying to wrap my mind around some solution which I want to build. It's about the Twitch.tv challenge. I have a promise, which fires when I have all channel information. And now For each channel i want to get the stream information (to know wether it's live or not) So in my Promise.all(), I do another $.getJSON call with a then promise. I expect to get information back wether the channel is live or not. However it gives me back an object with properties like 'state', 'always' etc. My code Is here https://codepen.io/dubbeltje/pen/OzpJZb?editors=1010. I would appreciate it if I could get some directions. Thanks
coderAkmal
@coderAkmal
Jan 01 2018 12:07
Anyone up
?
How do I find the file in which a js function is defined given only the file in which that function is used and a couple of js files as well ?
Jigal Sanders
@sandersjj
Jan 01 2018 12:09
@coderAkmal Sorry but I don't understand your question
coderAkmal
@coderAkmal
Jan 01 2018 12:10
See. I have an index.html in which they have used a js function on click
and I have a couple of Js files
now the function is defined in one of the js files
I want to know which files is that ?
I am looking for a shortcut using dev tools may be
Jigal Sanders
@sandersjj
Jan 01 2018 12:10
You should use your search function
coderAkmal
@coderAkmal
Jan 01 2018 12:12
See. I want to search using dev tools
only
Jigal Sanders
@sandersjj
Jan 01 2018 12:17
so then you should look into your source tab
primuscovenant
@primuscovenant
Jan 01 2018 12:39
@heroiczero thx
CamperBot
@camperbot
Jan 01 2018 12:39
primuscovenant sends brownie points to @heroiczero :sparkles: :thumbsup: :sparkles:
:star2: 2123 | @heroiczero |http://www.freecodecamp.org/heroiczero
mubaraka1
@mubaraka1
Jan 01 2018 13:07
guyz what is the best ide for web dev
if any one has a link help me send it
kerafyrm02
@kerafyrm02
Jan 01 2018 13:08
There's several
mubaraka1
@mubaraka1
Jan 01 2018 13:08
@Masd925 okay bro
kerafyrm02
@kerafyrm02
Jan 01 2018 13:08
It's more about preference.
mubaraka1
@mubaraka1
Jan 01 2018 13:09
@kerafyrm02 wat is conviniet
okay whats your preference
kerafyrm02
@kerafyrm02
Jan 01 2018 13:09
I use VIM. But it's a steep learning curve to use it. I recommend something like PHPstorm (costs $), UltraEdit, Sublime, Atom are a few.
Some companys use Netbeans too.
My last job used UltraEdit.
And the one before that used Netbeans.
I disagree with VaseJS with using IDs
Always use IDs if you can.
kerafyrm02
@kerafyrm02
Jan 01 2018 13:24
what are you trying to do
es6 .. .eww
Jigal Sanders
@sandersjj
Jan 01 2018 13:24
?
kerafyrm02
@kerafyrm02
Jan 01 2018 13:25
Do you understand what he's saying in SO?
Your then only executes if your callback executes
Jigal Sanders
@sandersjj
Jan 01 2018 13:26
Yes that I understand. So in this setup I would never be able to get the results of the then.
I have the feeling my approach is wrong and I should take a different approach
kerafyrm02
@kerafyrm02
Jan 01 2018 13:27
im not a big fan of es6
but what is your goal?
Jigal Sanders
@sandersjj
Jan 01 2018 13:28
In the promise I have a list of channels and then for each channel I want to add to my listItems array if it's online or not. To do that I would need to do another $.getJSON call
kerafyrm02
@kerafyrm02
Jan 01 2018 13:30
it seems like you're bent on using promises... what's your main goal? You just want to see if a channel is online or not? If it's not then add it to the array?
Jigal Sanders
@sandersjj
Jan 01 2018 13:33
If you look in my so question. The first answer is more or less what I am trying to achieve
kerafyrm02
@kerafyrm02
Jan 01 2018 13:35
Someone answered it for you
refresh page
Jigal Sanders
@sandersjj
Jan 01 2018 13:35
That is what I just sain ;-)
*said
however I still find this promise things kind of hard to wrap my mind around.
but apparently it's very powerfull
kerafyrm02
@kerafyrm02
Jan 01 2018 13:36
it's not very complex.. it's like this...
Whenever your code finishes running --- it runs a promise
it's usually 3 states
Jigal Sanders
@sandersjj
Jan 01 2018 13:39
That whole part I understand.
But the thing with nesting promises like I was trying to do got to complex on me
kerafyrm02
@kerafyrm02
Jan 01 2018 13:40
it's the same thing
after a promise runs-- you run a promise on that promise
Jigal Sanders
@sandersjj
Jan 01 2018 13:41
I am going to try to work out the response he gave me and see if I understand it
kerafyrm02
@kerafyrm02
Jan 01 2018 13:43
read this
One of the best examples i can think of using multiple promises are cases of rest apis
Where you send the server data-- it returns data and then you send more data and it goes back in forth like that
Jigal Sanders
@sandersjj
Jan 01 2018 13:45
Yep. I will work it out
Shahe Imran
@bddarknight
Jan 01 2018 14:49
Hey Guys IF I tell you to categorize the frond end development tutorial on freecodecamp how would you do that? Is it 1. Beginner level 2. Intermediate 3. or Advanced?
VaseJS
@VaseJS
Jan 01 2018 14:58
Happy new years everyone. we wake up and this is the firs thing we're doing. good or bad? who knows, but we're here codig away like little coder ants :D
Shahe Imran
@bddarknight
Jan 01 2018 14:59
Happy New Year @VaseJS
VaseJS
@VaseJS
Jan 01 2018 14:59
@catherinewoodward that's very hard to do because there is no universally agreed upon definition of beginner, intermediate and advanced
Shahe Imran
@bddarknight
Jan 01 2018 15:00
What do you think?
VaseJS
@VaseJS
Jan 01 2018 15:00
we can give general answers, but intermediate would be the greyest area. beginner gets grey really quickly and its hard to define advanced until you're way out there
all the css is beginner
all the html is beginner
Shahe Imran
@bddarknight
Jan 01 2018 15:01
how about javascript part to rest...
and What is your thought on Back End?
VaseJS
@VaseJS
Jan 01 2018 15:02
javascript goes through levels, but i would say and it is beginner and intermediate. no real true advanced js because the foundation that js is built upon is not truly there.
so beginner and intermediate but no true advanced js because the fundamentals are not all there
my two brownie points
Shahe Imran
@bddarknight
Jan 01 2018 15:03
Points noted!
do you suggest any other tutorial series that might cover that entire advanced level Javascript?
jason deb joy
@jasonjoydeb
Jan 01 2018 15:04
hey guys
Shahe Imran
@bddarknight
Jan 01 2018 15:05
Hey
jason deb joy
@jasonjoydeb
Jan 01 2018 15:05
happy new year
Shahe Imran
@bddarknight
Jan 01 2018 15:05
To you too...
jason deb joy
@jasonjoydeb
Jan 01 2018 15:05
thank you
Shahe Imran
@bddarknight
Jan 01 2018 15:06
Hey Jason, what are your best interest when it comes to learning programming?
jason deb joy
@jasonjoydeb
Jan 01 2018 15:06
btw, i just completed upto the jquery portion of freecodecamp learning to program
VaseJS
@VaseJS
Jan 01 2018 15:07
@catherinewoodward advanced are the basics done well. FCC lacks the full basics. so i could recommend a lot. Javascript Allonge. find it, read it, take notes, love it. its basic but when you're done, you'll understand why i say the fundamentals are missing. i have a bunch more books but if you're in the beginning, it could be a lot.
@jasonjoydeb who are you thanking?
jason deb joy
@jasonjoydeb
Jan 01 2018 15:08
@VaseJS i was thanking @catherinewoodward for wishing me
i love to solve problems so i guess i's focus more on back end @catherinewoodward
@VaseJS they asked me complete a tribute page now
do u have any suggestions for me bro?
VaseJS
@VaseJS
Jan 01 2018 15:09
@jasonjoydeb i just jumped in so i didn't see a link to any page
jason deb joy
@jasonjoydeb
Jan 01 2018 15:12
https://www.freecodecamp.org/challenges/build-a-tribute-page this is the task i need to complete nwo
now
8
*
do u have any suggestion for me
?
VaseJS
@VaseJS
Jan 01 2018 15:13
on how to build it or what to build it about?
jason deb joy
@jasonjoydeb
Jan 01 2018 15:14
what to build it about
VaseJS
@VaseJS
Jan 01 2018 15:15
oh, that's on you. what do you like in this world? who do you admire in this world. favorite food, country, etc. go crazy. it doesn't matter. don't got caught up in those details. just build something. it could be about the blank page that says "this page was intentionally left blank" and how you like that. the point is to build a small site. get started
jason deb joy
@jasonjoydeb
Jan 01 2018 15:16
sure bro
i will complete it by tonight then
and thanks once again
VaseJS
@VaseJS
Jan 01 2018 15:21
@ me and say thanks so i can get my cookies
I'm all about meaningless brownie points
like so...
@VaseJS thanks once again
CamperBot
@camperbot
Jan 01 2018 15:23
sorry vasejs, you can't send brownie points to yourself! :sparkles: :sparkles:
VaseJS
@VaseJS
Jan 01 2018 15:23
but i can't give them to myself
Ken Haduch
@khaduch
Jan 01 2018 16:01
@VaseJS - thanks for all of the help and good wishes for new years!
CamperBot
@camperbot
Jan 01 2018 16:01
khaduch sends brownie points to @vasejs :sparkles: :thumbsup: :sparkles:
:cookie: 406 | @vasejs |http://www.freecodecamp.org/vasejs
Matej Bošnjak
@mbosnjak01
Jan 01 2018 16:20
@VaseJS thanks
CamperBot
@camperbot
Jan 01 2018 16:20
mbosnjak01 sends brownie points to @vasejs :sparkles: :thumbsup: :sparkles:
:cookie: 407 | @vasejs |http://www.freecodecamp.org/vasejs
VaseJS
@VaseJS
Jan 01 2018 16:20
yay
Jacob Pieczynski
@JacobPie
Jan 01 2018 17:05
How can I make my nav bar a solid thing so that it won't hid elements when I hit the button to that element https://codepen.io/JakePie/pen/gomBeZ Sorry for the repost, I think someone answered me yesterday but I had to leave
Eric Weiss
@eweiss17
Jan 01 2018 17:07
Well the reasoning why it does that is because when you set it to fixed it removes it from the document flow
which is the same that would happen if you set it to position: absolute
TheRedstoneTaco
@TheRedstoneTaco
Jan 01 2018 17:08
So I have two files in the same directory
register.php and validation.js
validation.js contains a single form validation script. However, when I write the full script in register.php, the page's form validation works correctly but if I put the script in validation.js and just have a script include in the header, the form validation doesn't work at all
if you are using bootstrap, just follow the docs
Jacob Pieczynski
@JacobPie
Jan 01 2018 17:11
@eweiss17 What do you mean just follow the docs?
Eric Weiss
@eweiss17
Jan 01 2018 17:11
here are the docs for fixed top
<nav class="navbar fixed-top navbar-light bg-light">
  <a class="navbar-brand" href="#">Fixed top</a>
</nav>
<nav class="topbar navbar fixed-top">
that what u have
what is the <div class="mass"> for?
that div encapsulates the entire html
Jacob Pieczynski
@JacobPie
Jan 01 2018 17:13
@eweiss17 True. I tested it with a fixed top but it didn't worl
Eric Weiss
@eweiss17
Jan 01 2018 17:15
i'm looking into it right now, i forked it
did u want it to stick to the top or be stationary on the top
Jacob Pieczynski
@JacobPie
Jan 01 2018 17:16
@eweiss17 I want to to be sticky at the top of the screen, just when you hit the buttons it covers up what you are trying to see
Eric Weiss
@eweiss17
Jan 01 2018 17:18
oh okay, that's pretty easy fix then
sorry it's been a while, i'm looking at this twbs/bootstrap#1768
Jacob Pieczynski
@JacobPie
Jan 01 2018 17:22
@eweiss17 So how do I fix it?
TheRedstoneTaco
@TheRedstoneTaco
Jan 01 2018 17:23
if I write the script out in register.php it works but if I write it in validation.js and include validation.js in the header of register.php it doesn't work
Eric Weiss
@eweiss17
Jan 01 2018 17:23
try sticking this in the js section
var shiftWindow = function() { scrollBy(0, -5) };
if (location.hash) shiftWindow();
window.addEventListener("hashchange", shiftWindow);
tell me if that works
Jacob Pieczynski
@JacobPie
Jan 01 2018 17:24
@eweiss17 Sorry but nope
TheRedstoneTaco
@TheRedstoneTaco
Jan 01 2018 17:24
So I have two files in the same directory
register.php and validation.js
validation.js contains a single form validation script. However, when I write the full script in register.php, the page's form validation works correctly but if I put the script in validation.js and just include the validation.js script in the header of register.php, the form validation doesn't work at all
Eric Weiss
@eweiss17
Jan 01 2018 17:25
works on my machine.jpg....
i just clicked 'about me'
image.png
isn't that what you wanted
Jacob Pieczynski
@JacobPie
Jan 01 2018 17:27
@eweiss17 Yeah. I just wanted it so that when you hit the button it shows the top of the element you are clicking to. When I did it, it would hide about half of the element you are clicking to
Eric Weiss
@eweiss17
Jan 01 2018 17:27
@TheRedstoneTaco probably bringing it in wrong
check out the issue page
Vincenzo Ferrari
@wilk
Jan 01 2018 17:29
Hey guys, I don't know if this is the right room but recently I've created this package to thank all the people that helped you directly and indirectly with your Javascript project: https://github.com/wilk/thanc
I just want to share it with you: maybe you've a package.json file and you want to say thanks to those dependencies and subdependencies :smile:
Eric Weiss
@eweiss17
Jan 01 2018 17:29
twbs/bootstrap#1768
heres another one
Jacob Pieczynski
@JacobPie
Jan 01 2018 17:34
@eweiss17 I think I fingured it out. Thanks
CamperBot
@camperbot
Jan 01 2018 17:34
jacobpie sends brownie points to @eweiss17 :sparkles: :thumbsup: :sparkles:
:cookie: 599 | @eweiss17 |http://www.freecodecamp.org/eweiss17
Eric Weiss
@eweiss17
Jan 01 2018 17:35
delete that js if you are not using it
TheRedstoneTaco
@TheRedstoneTaco
Jan 01 2018 17:35
@wilk great idea, nice tutorial, graphics could be less neon-y, Jesus is Lord
Eric Weiss
@eweiss17
Jan 01 2018 17:38
jesus is lord?
@JacobPie sorry i couldn't be of much help, it's been a while for me, I would always reccomend googling your problem and if you want something explained better come here
Vincenzo Ferrari
@wilk
Jan 01 2018 17:50
@wilk great idea, nice tutorial, graphics could be less neon-y, Jesus is Lord
hahaha, yep, lots of emojis, I know but as you can see, it attracts more seeing so much "graphics" instead plain text :laughing:
smoxx
@smoxx
Jan 01 2018 18:00
Hello. How do I bypass the error "No 'Access-Control-Allow-Origin' header is present on the requested resource." using the fetch function?Specifically on https://wind-bow.glitch.me/twitch-api
kerafyrm02
@kerafyrm02
Jan 01 2018 18:21
you cant unless the server adds your domain
you can try using JSONP
if you're just getting information
Stephen James
@sjames1958gm
Jan 01 2018 18:36
@smoxx You have to make sure you are using one of the three routes provided.
e.g. https://wind-bow.glitch.me/twitch-api/users/freecodecamp
This server caches data to lower the request rate. To prevent abuses this server accepts GET requests only, and serves only routes /users/:user, /channels/:channel, and /streams/:stream. These are more than enough to complete the challenge.
Emil
@aguyinmontreal
Jan 01 2018 18:58
Happy new year everyone!
I've read somewhere that href external links not done right can be a security vulnerability. I can't remember what it was exactly. If someone knows, please let me know :)
Matej Bošnjak
@mbosnjak01
Jan 01 2018 19:09
what would be "not done right"? :)
TheRedstoneTaco
@TheRedstoneTaco
Jan 01 2018 19:11
and is it a link or an anchor or a button in a form or what
Emil
@aguyinmontreal
Jan 01 2018 19:32
@mbosnjak01 @TheRedstoneTaco guys, I can't remember exactly, something about linking to a 3rd party website, and then that 3rd party website has access to the cookies you left on the client
@TheRedstoneTaco yes, a link
Blake
@BadSenju
Jan 01 2018 19:43
@VaseJS ooh ok..im attempting to make a nav bar by applying steps ive seen on youtube..think you can hep?
VaseJS
@VaseJS
Jan 01 2018 19:44
@BadSenju what vid?
@BadSenju why'd you single me out? :D
Blake
@BadSenju
Jan 01 2018 19:47
@VaseJS because you replied to a question i had a couple days ago about if a div could be a child a <ul><div></div></ul>..
VaseJS
@VaseJS
Jan 01 2018 19:47
oh, that makes sense. it was a couple days ago
i need more context. what vid? where's your code, etc?
Phylicia Campbell
@pcampb22
Jan 01 2018 19:59
Happy New Year Everyone! Quick question, has anyone completed the Wikipedia Viewer Intermediate Front End Developer Project?
Jan Shah
@JanShah
Jan 01 2018 20:00
@pcampb22 I completed it a while back
Hala-kasim
@Hala-kasim
Jan 01 2018 20:02
hi guys, anyone can help me with react please
!!!
VaseJS
@VaseJS
Jan 01 2018 20:03
@pcampb22 sir yes sir, or mam, yes mam, or yes, yes. How can we be of service?
Matej Bošnjak
@mbosnjak01
Jan 01 2018 20:03
@aguyinmontreal never actually thought about that ... :|
VaseJS
@VaseJS
Jan 01 2018 20:03
@Hala-kasim don't know react at all
Hala-kasim
@Hala-kasim
Jan 01 2018 20:03
@pcampb22 I did
@VaseJS oh no
Jan Shah
@JanShah
Jan 01 2018 20:04
@Hala-kasim what do you need?
Hala-kasim
@Hala-kasim
Jan 01 2018 20:05
ok, I have to get data from external API, I've used express in the server side, and it works, but when I try to pass the same data to the client side it doesn't show anything
Jan Shah
@JanShah
Jan 01 2018 20:06
wheres your code?
Hala-kasim
@Hala-kasim
Jan 01 2018 20:07

import React, { Component } from 'react';
import axios from 'axios';
import './App.css';
import ProductsPerCategory from './components/ProductsPerCategory';

class App extends Component {
constructor() {
super();
this.state = {
products: []
};
}

// GET REQUEST ---
componentDidMount() {
console.log('done00000000000');
console.log('done1111111111');
axios.get('/products/:category').then(res => {
console.log(res.data);
console.log('done');
const products = res.data;
this.setState({ products: products });
console.log('done33333333333');
});
}

render() {
return (
<div className="App">

    <ProductsPerCategory
    products={this.state.products}
    />
  </div>
);

}
}

export default App;

Jan Shah
@JanShah
Jan 01 2018 20:10
there might be an issue setting state in componentDidMount. it's hard to see.
probably move everything from componentDidMount to another function, call the function and process the results.
it should work as long as you definitely see valid data in products.
Phylicia Campbell
@pcampb22
Jan 01 2018 20:15
how difficult would you say you found it to be? I don’t think freecodecamp does particularly a good job with this portion of learning the information and just confused on where and how to really start this one, honestly.
Jan Shah
@JanShah
Jan 01 2018 20:15
easy @pcampb22 just pick up a bit of info about api's
Phylicia Campbell
@pcampb22
Jan 01 2018 20:16
have you worked with APIs before freecodecamp? @JanShah
Jan Shah
@JanShah
Jan 01 2018 20:17
yes, but very little. I was probably just as confused.
Hala-kasim
@Hala-kasim
Jan 01 2018 20:17
I'll try with componentWillMount(). thank you @JanShah
CamperBot
@camperbot
Jan 01 2018 20:17
hala-kasim sends brownie points to @janshah :sparkles: :thumbsup: :sparkles:
:cookie: 563 | @janshah |http://www.freecodecamp.org/janshah
Jan Shah
@JanShah
Jan 01 2018 20:17
but as I said, a bit of info about API's, for example, how to fetch the data and view it in your console
Phylicia Campbell
@pcampb22
Jan 01 2018 20:18
@JanShah I am still understanding how APIs really work and maybe im digging too deep into it. I was able to complete the random quote machine and the local weather app but even then, it was confusing. Just wasn’t sure if i was the only one who felt lost when it came to this.
Jan Shah
@JanShah
Jan 01 2018 20:18
@pcampb22 once you get to the point where you can see the data, you use the skills from what you learnt here, object manipulation etc
Phylicia Campbell
@pcampb22
Jan 01 2018 20:19
yeah one i actually have the data and can see it, I don’t have any issues completing the rest of the objectives. its just setting things up and understanding how to get the information the correct way…. thats all @JanShah
Jan Shah
@JanShah
Jan 01 2018 20:20
ok. you know about json objects and how to grab data from inside them?
Phylicia Campbell
@pcampb22
Jan 01 2018 20:20
Still struggling with understand that.
I am a visual learner so reading about it doesn’t always help me grasp it as well.
Jan Shah
@JanShah
Jan 01 2018 20:21
have you got any code up to now that you can show or post to codepen?
Phylicia Campbell
@pcampb22
Jan 01 2018 20:21
Yes. Would you like to see my random quote machine?
it’s a basic use of it but understanding the concept on how everything is working is the struggle. like i said, i may just be thinking too deep into it but just wanted to pick the brains of anyone who could possibly break it down better than what information I see on freecodecamp
Jan Shah
@JanShah
Jan 01 2018 20:23
in your code, I see the ajax call is quite complex
gimme a sec
Phylicia Campbell
@pcampb22
Jan 01 2018 20:24
@JanShah okay. no problem.
Jan Shah
@JanShah
Jan 01 2018 20:44
fetch("https://en.wikipedia.org/w/api.php?&origin=*&action=opensearch&search=test&limit=5")
.then(function(resp) {
    console.log(resp);
    return resp.json()
})
.then(function(data) {
    console.log(data);
})
https://stackoverflow.com/questions/41967610/using-fetch-library-for-wikipedia-api-javascript
@pcampb22
Aditya
@ezioda004
Jan 01 2018 20:45
@pcampb22 Wikipedia API can be daunting for the first time, may I suggest you look at this page and read the examples, that'll definitely give you the clue of what parameters to use.
Phylicia Campbell
@pcampb22
Jan 01 2018 20:47
@ezioda004 @JanShah Thank you guys so much! I will look into both pages. If i have any questions, i’ll be back lol
CamperBot
@camperbot
Jan 01 2018 20:47
pcampb22 sends brownie points to @ezioda004 and @janshah :sparkles: :thumbsup: :sparkles:
:cookie: 344 | @ezioda004 |http://www.freecodecamp.org/ezioda004
:cookie: 564 | @janshah |http://www.freecodecamp.org/janshah
Jan Shah
@JanShah
Jan 01 2018 20:49
@pcampb22
going one step closer to getting the data,
var content = fetch("https://en.wikipedia.org/w/api.php?&origin=*&action=opensearch&search=test&limit=5")
.then(function(resp) {
    return resp.json()
})
.then(function(data) {
    return data
})

content.then(function(data) {
console.log(data)})
data in content is the body of the response from the fetch request to wikipedia. each one of those is an array of results and links
Emil
@aguyinmontreal
Jan 01 2018 20:53
@mbosnjak01 now you know :D
Emmanuel Tuffet
@donteck
Jan 01 2018 21:12
Hey Guys just about to finish my first project . Can you guys tell me why the last links won't work? https://codepen.io/donteck/pen/EoXVzp
Jan Shah
@JanShah
Jan 01 2018 21:28
@donteck in your console :
Mixed Content: The page at 'https://codepen.io/donteck/pen/EoXVzp' was loaded over HTTPS, but requested an insecure resource 'http://www.emmanueltuffet.com/'. This request has been blocked; the content must be served over HTTPS.
Emil
@aguyinmontreal
Jan 01 2018 21:30
@donteck and closing the body and the html tags before your link is not good either :D
Emmanuel Tuffet
@donteck
Jan 01 2018 21:33
ok , I will check it out
it's because of codepen
Hala-kasim
@Hala-kasim
Jan 01 2018 22:46
one more Q in React: can I call componentDidMount() twice?? otherwise what should I do if I wanna call two different type of url, one to fetch data from database, and other to fetch data from the external API ???????