These are chat archives for FreeCodeCamp/HelpFrontEnd

4th
Jun 2018
Jesse
@ki4jgt
Jun 04 2018 00:25
So, before getting into web development, I spent 2 years doing stenography work. Despite being able to type ~100 wpm, I didn't really get any useful skills from it -- A.I. is taking over the field. I used to play the piano as a child and then I thought, what a LOVELY idea! I fashioned a working piano after the keys on the steno machine. The vowels serve as modifier keys and allow the user to slide up and down the octaves. Be warned, this ties up on Firefox -- Chrome is your friend here. Anyway, whenever the modifier keys are pressed, I put them into a mod_sync variable. And whenever they're depressed (keyup), I replace them with "" within the sync var. The problem is, I can't get the modifier keys to properly register and deregister from the mod_sync var. I've tried everything! Here's my project: https://codepen.io/ki4jgt/full/vrLgPy/
Claudio Restifo
@Marmiz
Jun 04 2018 02:38

@ki4jgt

can't get the modifier keys to properly register and deregister from the mod_sync var

what do you mean by that?

Jesse
@ki4jgt
Jun 04 2018 02:55
@Marmiz on keydown, the mod keys need to go into mod_sync -- which they do. On keyup, I need them to be removed.
Claudio Restifo
@Marmiz
Jun 04 2018 03:03
@ki4jgt you mean assign / clean the varaible?
*variable?
I don't get the locig of what should happens.
Would be great if you can make a write-down in pseudo code of what you want to happens
roxxlen
@roxxlen
Jun 04 2018 03:11
using bootstrap , while hover or cliked on the button,it changed the color of the text, how can i overwrite it ?
Claudio Restifo
@Marmiz
Jun 04 2018 03:18
@roxxlen you can write your own css rules, and assign it with a higher specificity to override BS one.
here's a recap on CSS specificity rules
roxxlen
@roxxlen
Jun 04 2018 03:22
yes... i want to know how it was defined in the bootstrap, but it's not formatted to be readable, however these codes below doesn't work
.btn:hover .btn:active{
  background: #333333;
  color: #ccc;
}
Claudio Restifo
@Marmiz
Jun 04 2018 03:29

@roxxlen nope sicne classes has the same specificity, so bootstrap will take precedence over it.

You can add !important or use id to define your own class.

Also you can use the browser's inspector (and inspector pseud-classes) to see what property are being added

roxxlen
@roxxlen
Jun 04 2018 03:30
@Marmiz thanks
Claudio Restifo
@Marmiz
Jun 04 2018 03:31
:+1: happy coding :sparkles:
Nazar
@IsaakNazar
Jun 04 2018 04:24
@Marmiz :wave:
Evan Beyerle
@ebeyerle
Jun 04 2018 05:40
Did they change the curriculum for freecode camp?
Fabien SHAN
@X140hu4
Jun 04 2018 05:44
@ebeyerle They implemented a good part of the beta i think
Evan Beyerle
@ebeyerle
Jun 04 2018 05:46
@X140hu4 Thanks
arowolodaniel
@arowolodaniel
Jun 04 2018 05:53
@moT01 The code didn't work yet
aenkirch
@aenkirch
Jun 04 2018 06:48
Hello everybody, I created an unofficial Telegram group for FreeCodeCamp help for the users who rather use Telegram over Gitter, here is the link https://t.me/joinchat/HKpVEhAd-YjE3YP-6XT5-Q
Claudio Restifo
@Marmiz
Jun 04 2018 08:47
@IsaakNazar :wave:
Nazar
@IsaakNazar
Jun 04 2018 08:56
@Marmiz ever worked with oauth2? cant refresh access token
Claudio Restifo
@Marmiz
Jun 04 2018 09:14

@IsaakNazar what do you mean with "refresh"?

In general when you have a token there's alway a refresh token in the response. Can't you use that?

Nazar
@IsaakNazar
Jun 04 2018 09:21
@Marmiz and do I need refresh it?
Claudio Restifo
@Marmiz
Jun 04 2018 09:23

as far as I remember that's permanent. That's why in general you don't store it anywhere accessible by the client, otherwise an attacker can obtain it and use it to create a new regular one.

But I think you can find more info into oauth documentation

Nazar
@IsaakNazar
Jun 04 2018 09:27
@Marmiz I'm passing this link to user https://bitbucket.org/site/oauth2/authorize?client_id=mp5SB6Edkjgb9TCE4N&response_type=token, this link redirects user to sign in page of bitbucket, after signing in
the url gives you access token, and I want to get that access token, am I doing it correct?
my purpose is to get private pull requests
Claudio Restifo
@Marmiz
Jun 04 2018 09:59
I'd say yes, so you can use that token to make requests on behalf of the user, right?
mbsyaswanth
@mbsyaswanth
Jun 04 2018 09:59
Tell me what is a framework and a library in context of web development
David Young
@dayvidwhy
Jun 04 2018 10:00
@mbsyaswanth they’re like helpers, some stuff gets a bit repetitive, so frameworks and libraries make it easier and gets everyones code looking similar
most web frameworks are focused around the updating the dom part, like updating text on the page, because that’s a pain to do manually with current web functionality
mbsyaswanth
@mbsyaswanth
Jun 04 2018 10:05
whats the difference between a framework and a library in context of web development? @dayvidwhy
David Young
@dayvidwhy
Jun 04 2018 10:05
@mbsyaswanth library might be a more standalone thing, like manipulating time, ‘moment’ is a good library
mbsyaswanth
@mbsyaswanth
Jun 04 2018 10:06
but i dont know it sorry. i know flexbox, bootstrap, angular....
@dayvidwhy
David Young
@dayvidwhy
Jun 04 2018 10:06
flexbox is plain css
the terms pretty flexible, some people like calling bootstrap a framework, i’d call it a css library
Nazar
@IsaakNazar
Jun 04 2018 10:08
@Marmiz the problem is: how can I get that url with access token?
mbsyaswanth
@mbsyaswanth
Jun 04 2018 10:13
so you say that you call bootstrap a css library but it also has js library and some plugins. on what basis do u call bootstrap a library. I think there should be some characteristics for calling as library or framework, what r those?
David Young
@dayvidwhy
Jun 04 2018 10:13
sure it’s got some js that comes with it, and you can use plugins, i’m being pretty opinionated calling it a library, like I said
Nazar
@IsaakNazar
Jun 04 2018 10:14
I think I'm formulating my questions in a wrong way :worried: , I'm confused with this project
Claudio Restifo
@Marmiz
Jun 04 2018 10:18

@mbsyaswanth a library is usally a collection of resources.

a framework is a support to develop; it includes automation and a standarisation of doing things

@IsaakNazar yeh, I don't really get your question.
If you are handling the backend, I'm pretty sure the oauth bitbucket will give you some sort of response, you should handle there the tokens :)
David Young
@dayvidwhy
Jun 04 2018 10:19
@IsaakNazar have you looked at bitbuckets docs?
Aditya
@ezioda004
Jun 04 2018 10:20
@mbsyaswanth Its funny, bootstrap used to advertise themselves as "framework" and now they go by "library". I've seen both the terms being interchanged usually but they are quite different. Basically you can think of library as something "you call" and framework as something that "calls you".
mbsyaswanth
@mbsyaswanth
Jun 04 2018 10:21
yeah @ezioda004
i read this you call and calls you many times, never understood it.
Claudio Restifo
@Marmiz
Jun 04 2018 10:25

@mbsyaswanth this things will always be a bit vague... there's no a definition written in the stone for it.

but imagine a framework as a complex structure, like a bookshop. It has many shelves and they are organised according to a structure that the bookshop owner decided makes sense to him (and everyone else using it, perhaps).

a library on the other hand, is a book. It may be big or small. You can choose to read it, or read a chunk and throw away the rest.

Nazar
@IsaakNazar
Jun 04 2018 10:26
@dayvidwhy I've read docs several times, but didnt understand the access token part
@Marmiz, maybe passport js?
julien Demarque
@JulienDemarque
Jun 04 2018 10:27
Hi there! Can anyone help me with the Scatter Plot? I am not passing test 8 and I don't see why: https://codepen.io/JulienDemarque/pen/wXMgNp?editors=0010
Claudio Restifo
@Marmiz
Jun 04 2018 10:29

@mbsyaswanth a real word scenario.

angular is a frameworks.
It decided how you render your page, decide how to set up routing, how set up observables....

react is a library.
they just have written for you a "way" to render stuff on your page. All the rest (like routing or observables to say a few) are up to you.

[btw, the "just" is not as little as it sounds]
@IsaakNazar you don't need passport for that.
there's an example on bitbucket docs:
https://bitbucket.org/site/oauth2/authorize?client_id={client_id}&response_type=code
David Young
@dayvidwhy
Jun 04 2018 10:34
i think he got that far, he’s just not sure how to receive the response token?
Nazar
@IsaakNazar
Jun 04 2018 10:36
@Marmiz actually that link gives me https://bitbucket.org/account/user/nazrisak/oauth-consumers?code=6AYxpx66xXTeFDEjUv, but what is the purpose of this link I also misunderstand
If I get an access token when user signs in, then everyting would be OK
Norvin Burrus
@ndburrus
Jun 04 2018 11:35
@mbsyaswanth this may be helpful :sparkles:
arowolodaniel
@arowolodaniel
Jun 04 2018 16:00
Are you a developer (no matter the language you write). would you like to meet other developers from different country, would you like to join our open source projects.
we can make the world a better place together with support of free and open projects to solve some challenging problems in the world.
Join the group on Messenger by visiting: https://m.me/join/AbbHTkhEpZOSn-es
DarkxPunk
@DarkxPunk
Jun 04 2018 16:51
How is the community doing today?
amir
@aizen3
Jun 04 2018 17:00
hi everyone
i wanna ask u something
DarkxPunk
@DarkxPunk
Jun 04 2018 17:01
Go ahead
amir
@aizen3
Jun 04 2018 17:01
one year ago i was here studying very well but i was in the army for the last year and i stopped studying do u think i should start again from the beginning and do all the projects again
DarkxPunk
@DarkxPunk
Jun 04 2018 17:07
Hmm...
It all depends how much you remeber
I mean a refresh, especially when it comes to best practices is always good
Brad
@bradtaniguchi
Jun 04 2018 17:10
Its always good to go over fundamentals
amir
@aizen3
Jun 04 2018 17:31
thx for advice guys
NathanScott
@Xaensai_twitter
Jun 04 2018 18:08
Anyone here use react?
Christopher McCormack
@cmccormack
Jun 04 2018 19:09
@Xaensai_twitter yes there should be someone around that does
CarbonCarousel
@CarbonCarousel
Jun 04 2018 19:54
good afternoon all
Brad
@bradtaniguchi
Jun 04 2018 19:54
hello
include*engine
@newtothat
Jun 04 2018 19:56
hey everyody i made this book page with html and css in order to practice and not to forgot them look and say something aout that simple thing
when you have books for children in your website can you use javascript to change pages without putting each page in a different html file?
Mark Kubik
@KUBIX90
Jun 04 2018 20:01
Hi everyone
Can someone please help with this. It works fine on browsers but there is fair amount of horizontal scroll on mobile that i want to get rid of. The content should just be in the center of the mobile
include*engine
@newtothat
Jun 04 2018 20:03
@KUBIX90 hey Mark is it from Daniel's tutorial?
Mark Kubik
@KUBIX90
Jun 04 2018 20:04
@newtothat Hi there, no i made this myself. Just messing about little code snippets that I can use going forward
who's Daniel lol
include*engine
@newtothat
Jun 04 2018 20:05
he has something like this look at this link
this tutorial is similar to your hidden nav bar with js
Mark Kubik
@KUBIX90
Jun 04 2018 20:08
Thanks
I my issue is to do with the CSS though just not sure what exactly
include*engine
@newtothat
Jun 04 2018 20:10
i see im not advanced yet in css
for me it is confusing when website getting bigger and i leave a lot of comments in order to know which one is which
Mark Kubik
@KUBIX90
Jun 04 2018 20:13
Yeah, just keep at it, things will fall into place the longer you keep doing it and begin to make more sense
Gulsvi
@gulsvi
Jun 04 2018 20:17
@KUBIX90 It's hard to make things responsive when you give width in pixels. This will take up most the screen on a mobile device, forcing you to scroll to see the content to the right of the navbar:
        document.querySelector("#menu-icon").addEventListener("click", function (){
            document.getElementById("side_navbar").style.width = "250px";
            document.getElementById("main").style.marginLeft = "250px";
        });

        document.querySelector(".close").addEventListener("click", function (){
            document.getElementById("side_navbar").style.width = "0";
            document.getElementById("main").style.marginLeft = "0";
        });
You could just make the sidebar/navbar take up the full page on mobile? 100vw
Mark Kubik
@KUBIX90
Jun 04 2018 20:18
@gulsvi Should i use translate instead with percentages?
Gulsvi
@gulsvi
Jun 04 2018 20:20
@KUBIX90 I was thinking of something like:
    document.querySelector("#menu-icon").addEventListener("click", function() {
      const bodyWidth = document.body.clientWidth;
      const sidebarWidth = bodyWidth < 480 ? "100vw" : "250px";
      document.getElementById("side_navbar").style.width = sidebarWidth;
      document.getElementById("main").style.marginLeft = sidebarWidth;
    });
So, if the device is less than 480px wide, make your sidebar take up the full screen
Clicking on a link would need to dismiss the sidebar if you go that route - and 480 is just an example. That may need to be bigger/smaller depending on your content and expected devices
Mark Kubik
@KUBIX90
Jun 04 2018 20:47
@gulsvi Thanks, i'll give it a go
DarkxPunk
@DarkxPunk
Jun 04 2018 21:30
@KUBIX90 Hey Mark how you doin?
markclynch
@markclynch
Jun 04 2018 21:31
@DarkxPunk Me?
DarkxPunk
@DarkxPunk
Jun 04 2018 21:31
No Mark Kubik :P
markclynch
@markclynch
Jun 04 2018 21:31
ah, not me :)
funny it popped up for me.
DarkxPunk
@DarkxPunk
Jun 04 2018 21:32
Thats odd.
Mark Kubik
@KUBIX90
Jun 04 2018 22:03
@DarkxPunk Hey there, I'm doign good thanks. How's it going?
DarkxPunk
@DarkxPunk
Jun 04 2018 22:04
Going well. What you been up to?
See your sticking to JS for your styling eh :stuck_out_tongue_closed_eyes:
Mark Kubik
@KUBIX90
Jun 04 2018 22:06
@DarkxPunk Haha, I've only used it for this piece i swear!!
I've just been building little snippets of code for certain parts of sites etc Just to kinda hone my skills a bit
DarkxPunk
@DarkxPunk
Jun 04 2018 22:07
Cool, what is this you’re building exactly? (I’m on mobile so can’t really see it well)
Mark Kubik
@KUBIX90
Jun 04 2018 22:09
Been going through Grid & Flexbox in a lot more detail and using them to build layouts. Got to a final stage of an interview the other week, but didn't get it. Think that side of things may have let me down a bit, although they didn't say that specifically. They put it down to experience.
Nothing major, just experimenting with different navbars and column layouts. Need to do some work with forms/regex as well which Ive never really done.
DarkxPunk
@DarkxPunk
Jun 04 2018 22:26
So what about nav bars and column layouts XD
Corey Lewis
@cursiv3
Jun 04 2018 22:40
@KUBIX90 I've had similar experiences, get deep, then "sorry you just don
"don't have the years"
it sucks :(
DMCooper
@SilentGamelan
Jun 04 2018 22:42
Hey, does anyone know if its possible to modify an already existing and running event handler on a web page in JS? I'm just fiddling about in the console trying to write a script that will copy my solution into the copy/paste buffer without having to highlight and select it first on the FCC editor. I want to trigger it by a key-combination so wondered if I could just tack it on to the listeners that are already attached?
Is there much of an issue with having multiple listeners attached to the same events if I just add my own the normal way?
Brad
@bradtaniguchi
Jun 04 2018 22:53
I don't think there would be an issue listening to the same event AFAIK
DMCooper
@SilentGamelan
Jun 04 2018 22:54
Ta, I'll give it a go and see what happens.
markclynch
@markclynch
Jun 04 2018 23:35
Can anyone help me with this? I'm not following it well.
 var converted = str.replace(/[a-z]/gi, function(char) { 
    return (char === 'z' || char === 'Z') ? 'a' : String.fromCharCode(char.charCodeAt() + 1);
  });
I don't get String.fronCharCode
it just feels backwards to me,
Aditya
@ezioda004
Jun 04 2018 23:42
@markclynch String.fromCharCode() converts ASCII back to string, so seems like you're grabbing a character, checking if its z or Z, else converting it to ASCII code + 1 and converting that result back to string.
markclynch
@markclynch
Jun 04 2018 23:56
Yeah, that's what I was trying to do, this is not my code though, it's the answer
I couldn't get my head around it, kept trying to do weird stuff like iterate through the string with map and converting to ASCII then taking that new array and going back.