These are chat archives for FreeCodeCamp/Help

6th
Jul 2018
0verwrit3
@0verwrit3
Jul 06 2018 00:32
hey guys im starting to code and im stuck on the kitty ispum part ive done what it says but i cant pass
hbar1st
@hbar1st
Jul 06 2018 00:33
@0verwrit3 it's easier to answer you if you open a forum request for help because you can put your code and link to the challenge easier there.
Kyle Holm
@thekholm80
Jul 06 2018 00:34
or you can just ask here, since that's what this chat room is for
@0verwrit3 can you show what you tried?
0verwrit3
@0verwrit3
Jul 06 2018 00:35

<h1>Hello World</h1>

<h2>CatPhotoApp</h2>

<p>Kitty ispum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff.
</p>

Kyle Holm
@thekholm80
Jul 06 2018 00:36
@0verwrit3 try with only the first few words of the kitty ipsum
Kitty ipsum dolor sit amet
0verwrit3
@0verwrit3
Jul 06 2018 00:36
okay!!
Kyle Holm
@thekholm80
Jul 06 2018 00:37

as the instructions say:

Replace the text inside your p element with the first few words of this kitty ipsum text

0verwrit3
@0verwrit3
Jul 06 2018 00:38
done thanks man!! i feel so stupid now!! cant wait to code more loving it:)
Kyle Holm
@thekholm80
Jul 06 2018 00:38
:+1: awesome, keep it up
anthonygallina1
@anthonygallina1
Jul 06 2018 00:53
Hi I was over at the Friendly Creative Community playing with glossy-nitrogen
Kyle Holm
@thekholm80
Jul 06 2018 00:54
hey @anthonygallina1
anthonygallina1
@anthonygallina1
Jul 06 2018 00:54
: )
Hi
Kyle Holm
@thekholm80
Jul 06 2018 00:55
i don't know what glossy-nitrogen is, and google isn't helping much
but whatever you did i hope you washed your hands when you finished
anthonygallina1
@anthonygallina1
Jul 06 2018 00:56
yikes
test('#isOk, #isNotOk', function(){ assert.isOK( null, 'null is falsey'); assert.isOk( "I'm truthy", 'a string is truthy'); assert.isOK( true, 'true is truthy' ); });
Kyle Holm
@thekholm80
Jul 06 2018 00:58
interesting
anthonygallina1
@anthonygallina1
Jul 06 2018 00:58
Sorry for the formatting
Kyle Holm
@thekholm80
Jul 06 2018 00:59
it's okay lol
anthonygallina1
@anthonygallina1
Jul 06 2018 01:00
YA been stuck on the test for a while I thought my logic was good but no go.
Thing is I am trying to learn the chai test's from our cirriculmn. And well I guess I didnt understand the training. Or it is a kinda throw them in deep and see if they swim. I am treading water right now. LOL
Kyle Holm
@thekholm80
Jul 06 2018 01:02
i've always worked best when i'm in over my head
anthonygallina1
@anthonygallina1
Jul 06 2018 01:02
glub glub
:)
Kyle Holm
@thekholm80
Jul 06 2018 01:03
lol
anthonygallina1
@anthonygallina1
Jul 06 2018 01:05
welp a string is truthy if it isnt empty "" I am thinking
But iwas also thinking null is null
But I looked it up and did it as falsy
Kyle Holm
@thekholm80
Jul 06 2018 01:08
seems pretty sound
anthonygallina1
@anthonygallina1
Jul 06 2018 01:10
then Thought maybe is OK was a true And that might throw it off so tried is not ok and that didnt work either.
Or the other way around
Not even sure what they want. I meen I could write more code for it. But some times the testing software is very specific
anthonygallina1
@anthonygallina1
Jul 06 2018 01:31
@thekholm80 Thanks I found this freeCodeCamp/freeCodeCamp#17744
np
Kyle Holm
@thekholm80
Jul 06 2018 02:34
@anthonygallina1 sorry was away
so you figure you've got it right and the tests are wrong?
Fernando L. Estuesta
@champolot
Jul 06 2018 05:11
could someone help me? my jquery doesnt work? https://codepen.io/champolot/pen/bKPqPG
Claudio Restifo
@Marmiz
Jul 06 2018 05:27
It's working for me, I see the navbar becoming blue
*black
sorry @champolot
Fernando L. Estuesta
@champolot
Jul 06 2018 05:31
i got updated it. check it out i got new problem xD
https://codepen.io/champolot/pen/bKPqPG
the navbar is having a white space above it
@Marmiz its fine :)
Prakash Kumar
@ThePrakashKumar
Jul 06 2018 05:43
@ThePrakashKumar
Hi!
I am having problem in overwriting label style so anyone can please check my code?
https://codepen.io/ThePrakashKumar/pen/LraMJq
And please let me know if improvement I should make.
Thanks!
May Kittens Devour Your Soul
@diomed
Jul 06 2018 07:31
🦌
@champolot I loves me those Glitter help rooms. lol 😄
Claudio Restifo
@Marmiz
Jul 06 2018 07:45
:chicken:
Fernando L. Estuesta
@champolot
Jul 06 2018 07:47
@diomed what do you mean?
Claudio Restifo
@Marmiz
Jul 06 2018 07:47
@ThePrakashKumar I see your custom CSS being applied correctly to the node.
Where exactly is the problem?
Mohammed Boudad
@matrixersp
Jul 06 2018 07:47
@ThePrakashKumar I don't see any css property for label
Include only the code inside body tag in codepen
May Kittens Devour Your Soul
@diomed
Jul 06 2018 07:50
@champolot haha, sorry, I meant to tag @ThePrakashKumar :P
I was referring to his pen
when u doubletime check before posting just to make sure u screwed up in the end
@Marmiz I got this to do program, and it's developer enabled markdown in its fields
big mistake
now I have list of emoji images all over the place
🧐
May Kittens Devour Your Soul
@diomed
Jul 06 2018 07:57
Claudio Restifo
@Marmiz
Jul 06 2018 07:57
what?
Prakash Kumar
@ThePrakashKumar
Jul 06 2018 09:26
@Marmiz I want to overwrite the style of label so I am using .right to do this but I am not able to that.
Chanchal Saini
@sainichanchal__twitter
Jul 06 2018 09:50
can anyone please suggest me which is the best workspace for my webdesign projets?
Claudio Restifo
@Marmiz
Jul 06 2018 10:12

best? Your local machine.

You are at the beginning and everything confuses you? probably Codepen, since it takes care of lots of stuff for you

@ThePrakashKumar this is applied correctly:

label{
    display: inline-block;
    width: 40%;
    text-align: right;
    vertical-align: top;
}

Also I see some divs with right correctly applied to them.
So it's working as intended. Perhaps the CSS is not correct for your desired outcome

Chanchal Saini
@sainichanchal__twitter
Jul 06 2018 10:19
@Marmiz is it free?
Claudio Restifo
@Marmiz
Jul 06 2018 10:19
@sainichanchal__twitter codepen?
or your local machine?
Chanchal Saini
@sainichanchal__twitter
Jul 06 2018 10:19
yes @Marmiz
Adish Jain
@Adishjain58
Jul 06 2018 10:20
@sainichanchal__twitter codepen is free
Claudio Restifo
@Marmiz
Jul 06 2018 10:20
Chanchal Saini
@sainichanchal__twitter
Jul 06 2018 10:20
after one project it is not free
Claudio Restifo
@Marmiz
Jul 06 2018 10:21
it's always free
there's a pro version, but offer features mainly for agency/deisgners
for prototyping / side-project it's ideal
Chanchal Saini
@sainichanchal__twitter
Jul 06 2018 10:22
@Marmiz okay
Claudio Restifo
@Marmiz
Jul 06 2018 10:22
@sainichanchal__twitter oh you were looking at projects.
That's another thing

a project is like a real-life project. It leverages mutliple files, custom domains, verison control and all that jazz.

Again, if you need that stuff your local machine is still the best.

for the rest you probably will create pen
Chanchal Saini
@sainichanchal__twitter
Jul 06 2018 10:24
okay thanks @Marmiz
Claudio Restifo
@Marmiz
Jul 06 2018 10:26
:+1:
Prakash Kumar
@ThePrakashKumar
Jul 06 2018 10:31
@Marmiz Look I wanted to overwrite label style with .right but unable to do that. I have to add class to individual radio labels.
Class is more specific than tag to I want to overwrite the style.
Amit Patel
@AmitP88
Jul 06 2018 10:41
hey guys, I'm going over the Object Oriented Programming challenges for better understanding and I need some help understanding what's going on in the inheritance challenge:
inheritance.png
So far, I understand that Animal is the constructor function and Animal.prototype is the prototype object within the Animal constructor. What I don't understand is how is Animal connected to Cat and Bear functions and prototypes? I also know that Animal is a supertype, but I'm still a little fuzzy on what that means
Amit Patel
@AmitP88
Jul 06 2018 10:46
It's not like there was a line like:
let Cat  = new Animal(Cat);
or something to that effect
Nazar
@IsaakNazar
Jul 06 2018 10:47
hey everyone, need help withfetch
this code works, but second one doesnt, why?
componentDidMount() {
        const data = {
            status: 1,
            count: 5,
            position: 4,
            requirements: 10
        }

        const url = 'http://localhost:5000/data/';
        PostDataAPI(url, data);

    }
fetchData(){
        const data = {
            status: 1,
            count: 5,
            position: 4,
            requirements: 1
        };
        const url = '//http://localhost:5000/data/';

        PostDataAPI(url, data);            
    }
    componentDidMount() {
        this.fetchData();
    }
import axios from 'axios';

export function PostDataAPI(url, data) {

   axios.post(url, { 
       body: data
     })
     .then(res => console.log(res))
     .catch(err => console.log(err))
}
May Kittens Devour Your Soul
@diomed
Jul 06 2018 10:51
this line looks odd
const url = '//http://localhost:5000/data/';
//http
Nazar
@IsaakNazar
Jul 06 2018 10:51
@diomed ok let me check
@diomed oh sh#$, thanx, my bad, :)
May Kittens Devour Your Soul
@diomed
Jul 06 2018 10:52
@AmitP88 why does this even exist? https://gitter.im/FreeCodeCamp/HelpJavaScript
Amit Patel
@AmitP88
Jul 06 2018 10:53
@diomed sorry :(
I figured this was still a help chat so it would be ok to ask, but nvm =/
May Kittens Devour Your Soul
@diomed
Jul 06 2018 10:54
it's ok, but HelpJavascript is place where u should ask first
since it's JS problem. and then if no1 is there, ask here
Amit Patel
@AmitP88
Jul 06 2018 10:55
ok. I checked there before and it didn't seem active at first, hence why I asked here. but it seems active now
May Kittens Devour Your Soul
@diomed
Jul 06 2018 10:55
and there is more chance you'll get answer in specific room, than in overall room
Amit Patel
@AmitP88
Jul 06 2018 10:55
I understand
Claudio Restifo
@Marmiz
Jul 06 2018 11:00
@AmitP88 they inherit from constructor
Nazar
@IsaakNazar
Jul 06 2018 11:00
@AmitP88 whats up man! how's things going?
@Marmiz :wave:
Amit Patel
@AmitP88
Jul 06 2018 11:00
@IsaakNazar hey man, so far so good. I'm reviewing the Object Oriented Programming challenges atm :)
@Marmiz but how do Cat and Bear inherit from the Animal constructor? I don't see the connection between Animal and Cat and Bear
Cat and Bear weren't declared using new Animal
which is how new objects are created from the constructor
Claudio Restifo
@Marmiz
Jul 06 2018 11:09
@AmitP88 You'll eventually have to extend the Animal class I think in order to use it
perhaps in a future lesson?
Aditya
@ezioda004
Jul 06 2018 11:09
@AmitP88 Yeah, you're right. There is no explicit connection, but I think they want you to "suppose" that Animal is a super class.
Nazar
@IsaakNazar
Jul 06 2018 11:10
@AmitP88 I guess the rest of the code is hidden somewhere behind clouds :)
Amit Patel
@AmitP88
Jul 06 2018 11:11
lol I was hoping that wasn't it. I'm writing down notes on these challenges with explanations for self study
Claudio Restifo
@Marmiz
Jul 06 2018 11:12

@AmitP88 at a point you'll either have to:

Cat.prototype = {
  constructor: Animal, 
};

Cat.prototype.constructor.prototype.eat()

Or use a class like a sane person

Amit Patel
@AmitP88
Jul 06 2018 11:13
@Marmiz that's what puzzles me actually. In the working code for that challenge, in the Cat.prototype object, constructor is set to Cat and not Animal. Cat in that case would be referring to the function Cat
Claudio Restifo
@Marmiz
Jul 06 2018 11:13
i think the takeaway is: "you can extends prototypes to other objects so you don't have to write it twice".
(see: class X extends React.Component)
for a real world usage
Amit Patel
@AmitP88
Jul 06 2018 11:14
but then the function Cat doesn't have any explicit connection to Animal
ahhh ok, I see. I get how prototype objects work in general, but this challenge's code was tripping me up lol
Claudio Restifo
@Marmiz
Jul 06 2018 11:15

remember that:

primarily syntactical sugar over JavaScript's existing prototype-based inheritance

(a class is)
aka the reason why OOP became a thing in JS is that you don't have to deal with examples like the one above anymore
Aditya
@ezioda004
Jul 06 2018 11:16
Or do this extends keyword does prototype like this I believe.
Cat.prototype = Object.create(Animal.prototype);
Cat.prototype.constructor = Cat;
var c1 = new Cat();
c1.eat(); //nom nom nom
Amit Patel
@AmitP88
Jul 06 2018 11:18
@ezioda004 that makes sense. So that's probably what's happening behind the scenes outside of the visible code?
Nazar
@IsaakNazar
Jul 06 2018 11:18
guys, Im gonna post ReactJs questions, any help will be appreciated
Amit Patel
@AmitP88
Jul 06 2018 11:18
@Marmiz so, in regards to constructors, new objects, and prototypes, where do classes fit in? sorry, i'm not too familiar with classes
I think what I'm going to do is review my notes from the previous OOP challenges real quick just to get a clear picture, then I'll revisit this challege and look at the prototypal inheritance going on. That might clear up my confusion
Amit Patel
@AmitP88
Jul 06 2018 11:24
Thanks @ezioda004 @IsaakNazar @Marmiz for your help. I really appreciate it :)
Nazar
@IsaakNazar
Jul 06 2018 11:30

I have reusable SelecList component

const SelectList = (props) => {    
   let { vals } = props;
    return (
            <div >
                <select defaultValue={vals[0]}>
                    {vals.map((val, i) => <option key={i} value={val}>{val}</option>)}    
                </select>
            </div>
    )
}
export default SelectList;

on another component called Positions I use SelectList several times wrapped in a form

and after submitting the selected options refresh state, and state goes to POST request,
but I'm really confused about reusing SelectList component, is it good decision to reuse it?

<div>
                    <div >
                        <label>
                            <span>Department:</span>                            
                            <SelectList vals={department}/>                            
                        </label>                        
                    </div>
                    <div >
                        <label>
                            <span>Developer:</span>    
                            <SelectList vals={developer}/>

                        </label>                        
                    </div>

                             </div>
Aditya
@ezioda004
Jul 06 2018 11:40

@AmitP88 Yeah I'm guessing behind the scene in this challenge.
class keyword makes your life easier while writing OOP code. The same example would be a lot easier to write with class syntax. Like this example


function Animal(leg){
    this.leg = leg;
}
Animal.prototype.numberOfLegs = function(){
    return `I have ${this.leg}`;
}

function Cat(name, leg){
    Animal.call(this, leg);
    this.name = name;
}
Cat.prototype = Object.create(Animal.prototype);
Cat.prototype.constructor = Cat;
Cat.prototype.greet =  function(){
    return `My name is ${this.name}`;
}
let cat1 = new Cat("fluffy", 4);
cat1.numberOfLegs(); // I have 4
cat1.greet(); // My name is fluffy

The above was old way of doing prototypal inheritance and this is the new ES6 way

class Animal {
    constructor(leg){
        this.leg = leg;
    }
    numberOfLegs(){
        return  `I have ${this.leg}`;
    }
}
class Cat extends Animal {
    constructor(name, leg){
        super(leg);
        this.name = name;
    }
    greet(){
        return `My name is ${this.name}`;
    }
}
let cat1 = new Cat("fluffy", 4);
cat1.numberOfLegs(); // I have 4
cat1.greet(); // My name is fluffy

Both the examples work identically, the difference is only syntax and most people including me prefer the 2nd one because its a lot cleaner and less verbose.

Nazar
@IsaakNazar
Jul 06 2018 11:47
@ezioda004 for me the second one is mush more understandable, thanx for example
Aditya
@ezioda004
Jul 06 2018 12:01

@IsaakNazar Yeah, its a lot cleaner. Coming to your question, why do you think its not a good decision?
Also, in the Positions component

<div>
    <label>
        <span>Department:</span>
        <SelectList vals={department}/>
    </label>
</div>
<div>
    <label>
        <span>Developer:</span>
        <SelectList vals={developer}/>
    </label>
</div>

The elements seems repeating, I'd try to reduce that too with a .map().

Nazar
@IsaakNazar
Jul 06 2018 12:05
@ezioda004 I cant figure out how extract selected values of those 2 select options
maybe I should declare another props in a SelectList component, and pass it to Position ?
alpox
@alpox
Jul 06 2018 12:13
@IsaakNazar You should use onChange or similar on the select element. You can pass down a prop for this
Nazar
@IsaakNazar
Jul 06 2018 12:14
@alpox I need onChange in a parent component right?
in SelectList
alpox
@alpox
Jul 06 2018 12:15
Then you can do:
<SelectList vals={developer} onChange={e => this.setState({ someProp: e.target.value }) } />
@IsaakNazar Well, yes. you can define the function in the parent and pass it down like this to the SelectList
Nazar
@IsaakNazar
Jul 06 2018 12:15
@alpox wow, gotta try, thanx
alpox
@alpox
Jul 06 2018 12:16
In the SelectList I would actually do this:
let { vals, ...selectProps } = props;
....
<select defaultValue={vals[0]} {...selectProps} >
 ....
</select>
...
This adds all the rest of the properties except vals to the select
Its like a pass-down
select already accepts an onChange prop so that is included as well
Nazar
@IsaakNazar
Jul 06 2018 12:18
@alpox hmm very smart decision, I like it
Soumyojyoti Majumdar
@SoumyoNawab8
Jul 06 2018 12:41
I have index.html where I am rendering my React Components...Now If In case I have another html page for example about.html where I want to render different react components.So,how can I do that?
If there is any documentation page for that please share
alpox
@alpox
Jul 06 2018 12:45
@SoumyoNawab8 You might be able to put it in index.js as well, match for the route and render conditionally on different html elements.
But I would advice against it. Why not write what you have in about.html in react instead?
Lee Arnold
@nsanity1
Jul 06 2018 12:50
morning everyone
alpox
@alpox
Jul 06 2018 12:51
@alpox There is a discussion about that topic here though: https://github.com/facebook/create-react-app/issues/1084#issuecomment-370368022
Lee Arnold
@nsanity1
Jul 06 2018 12:52
i need some assistance figuring out how to get these tests to pass.

https://learn.freecodecamp.org/responsive-web-design/responsive-web-design-projects/build-a-survey-form

trying to get 10 and 13 figured out. I tried to put name-label, email-label , and number-label in the name field and it didn't work....i'll show code for 13 in a sec

``` <form id="survey-form">
*Name: <label for="name">
<input id="name" type="text" name="name-label" required placeholder="Please type your full name"></label>

    <br>
    <br>

    *Email: <label for="email">
    <input id="email" type="email" name="email" required placeholder="Please type your email"></label>


    <br>
    <br>

    *Phone: <label for="number">
    <input id="number" type="number" name="number-label" required placeholder="Please enter your phone #" min="10" max="10"></label>

```

<label for="yes">
<input id="yes" type="radio" name="yes-no">Yes</input>
</label>

    <label for="no">
      <input id="no" type="radio" name="yes-no">No</input>
    </label>
``` <label for="yes">
<input id="yes" type="radio" name="yes-no">Yes</input>
</label>
    <label for="no">
      <input id="no" type="radio" name="yes-no">No</input>
    </label>
Kyle Holm
@thekholm80
Jul 06 2018 12:57
@nsanity1 your labels should be <label id='name-label' for='name'>Name:</label>
you've got your label text outside the element, and you're missing the id
Lee Arnold
@nsanity1
Jul 06 2018 12:58
I'm trying to have the label to the left of the field
Kyle Holm
@thekholm80
Jul 06 2018 12:58
so it would be
<label>....</label>
<input />
when you use the for attribute, you don't need to nest the input inside the label
but you do need to have the label text inside the label element
although, if you prefer nesting the input inside the label, you can
<label>Name: <input ... /></label>
with the appropriate element attributes, of course
Lee Arnold
@nsanity1
Jul 06 2018 13:01
then it fails other tests
Kyle Holm
@thekholm80
Jul 06 2018 13:03
without seeing the project, it's hard to guess
Lee Arnold
@nsanity1
Jul 06 2018 13:03
let me back track...one sec
Kyle Holm
@thekholm80
Jul 06 2018 13:05
weird ... the testing suite disappeared from my survey form project
Lee Arnold
@nsanity1
Jul 06 2018 13:05
I had to reread what you wrote....that was the fix....i had the label name in the wrong section
the only thing left is #13
I think i have them in the same group, but i'm not sure...
Kyle Holm
@thekholm80
Jul 06 2018 13:08
AssertionError: All your radio-buttons must have a value attribute : expected 2 to equal 0
make sure you're using the value='...' attribute
Lee Arnold
@nsanity1
Jul 06 2018 13:09
ok...never used it before...i'll look it up
Kyle Holm
@thekholm80
Jul 06 2018 13:10
image.png
looks like that's all you were missing
Lee Arnold
@nsanity1
Jul 06 2018 13:11
so do i just leave the value blank?
Kyle Holm
@thekholm80
Jul 06 2018 13:12
you have 2 radio buttons, their values should reflect what their value would be if you selected them
Lee Arnold
@nsanity1
Jul 06 2018 13:12
i'm lost....lol
it would be value="2,1"?
Kyle Holm
@thekholm80
Jul 06 2018 13:13
or maybe one could be 'yes' and the other 'no'
Lee Arnold
@nsanity1
Jul 06 2018 13:13
so how i typed it is how it goes in?
or is there just a space
Kyle Holm
@thekholm80
Jul 06 2018 13:13
value='yes'
Lee Arnold
@nsanity1
Jul 06 2018 13:13
ok
Kyle Holm
@thekholm80
Jul 06 2018 13:14
The value attribute is a DOMString containing the radio button's value. The value is never shown to the user by their user agent. Instead, it's used to identify which radio button in a group is selected.
Lee Arnold
@nsanity1
Jul 06 2018 13:15
ok...so i guess thats for the database information when the form is submitted
Kyle Holm
@thekholm80
Jul 06 2018 13:15
yes
Lee Arnold
@nsanity1
Jul 06 2018 13:16
makes sense now
thanks as always Kyle
Kyle Holm
@thekholm80
Jul 06 2018 13:19
you bet
Lee Arnold
@nsanity1
Jul 06 2018 13:19
I feel like i'm bugging you so if you need a break from answering my questions say so
Kyle Holm
@thekholm80
Jul 06 2018 13:19
nah, you're not bugging me. if i didn't want to help i wouldn't be here
Lee Arnold
@nsanity1
Jul 06 2018 13:27
well said :)
Amit Patel
@AmitP88
Jul 06 2018 13:51
@ezioda004 I see. Yeah, I was just going over the further challenge lessons and it's definitely becoming more clear. :) Essentially, It's just the prototype object being moved around (from supertype to subtype), and then adding more properties and methods to the prototype object within the new instantiated object from the subtype
May Kittens Devour Your Soul
@diomed
Jul 06 2018 15:22
@thekholm80 ever tried Hexo?
or some other static content site generator?
Kyle Holm
@thekholm80
Jul 06 2018 15:24
i haven't
is it something worth checking out?
Prakash Kumar
@ThePrakashKumar
Jul 06 2018 15:48
Need some help to create @media.
Every thing is fine now just please guide me to create @media.
Henry
@GitHub-Henry
Jul 06 2018 15:56
@ThePrakashKumar perhaps this can help
Prakash Kumar
@ThePrakashKumar
Jul 06 2018 15:57
@GitHub-Henry Already done that. My code is not working.
Thats the problem.
Prakash Kumar
@ThePrakashKumar
Jul 06 2018 16:01
Yeah my code is not working.
Know how to create.
Mehdi Amlal
@mehdiamlal
Jul 06 2018 16:24
Hey guys, is it okay to use a user's email and username as a payload in JWT?
alpox
@alpox
Jul 06 2018 16:29
@mehdiamlal yes
Prakash Kumar
@ThePrakashKumar
Jul 06 2018 17:37
@thekholm80 know how to create but my code is not working.
Kyle Holm
@thekholm80
Jul 06 2018 17:39
sorry
Christopher McCormack
@cmccormack
Jul 06 2018 18:13
@ThePrakashKumar what is the problem? Saying your code isn't working is very broad, better to start with a single item that isn't working, and go from there
Bjorn van de Peut
@bjorno43
Jul 06 2018 18:24
I have that problem form time to time. 50+ files of code each having between 300 - 1000 lines of code. Then I just tell someone it isn't working and have them figure it out xD
Kyle Holm
@thekholm80
Jul 06 2018 18:28
@bjorno43 seems like a solid plan, but i have to ask if you have any friends left after doing that?
Bjorn van de Peut
@bjorno43
Jul 06 2018 18:29
@thekholm80 To lose friends, you gotta have some first :laughing:
Kyle Holm
@thekholm80
Jul 06 2018 18:30
lol
Mehdi Amlal
@mehdiamlal
Jul 06 2018 19:56
Hey guys! How can I alert a new user that the username/email already exists dynamically on signing up?
Kyle Holm
@thekholm80
Jul 06 2018 19:56
singing telegram?
i think that would be pretty awesome
Mehdi Amlal
@mehdiamlal
Jul 06 2018 19:58
I mean how can I prompt the user while he is typing that the username he/she has chosen is already taken?
Kyle Holm
@thekholm80
Jul 06 2018 20:00
without knowing anything about your project, it's really hard to make suggestions. in the past, using react-bootstrap i used their <Alert> component combined with some state: https://github.com/thekholm80/bookclub/blob/master/app/src/Register.jsx#L62
but i don't know if you're using react, react-bootstrap, or really anything about your project so it's hard to say
Mohammed Boudad
@matrixersp
Jul 06 2018 20:01
@mehdiamlal I think you can achieve that using ajax
Kyle Holm
@thekholm80
Jul 06 2018 20:03
my validation took place after submit though, you would have to have to poll your db on every key press if you want to check while typing
May Kittens Devour Your Soul
@diomed
Jul 06 2018 20:03
@thekholm80 does react support emoji? :yum:
Kyle Holm
@thekholm80
Jul 06 2018 20:04
@diomed in the code or rendered on screen? actually, i believe the answer to both is 'yes'
May Kittens Devour Your Soul
@diomed
Jul 06 2018 20:04
apparently I cant do that with vue :unamused:
react is just javascript, so anything you can do in JS should work in react
May Kittens Devour Your Soul
@diomed
Jul 06 2018 20:09
but instead of name: "Charlie" apparently I cant use 👾: "Charlie"
Kyle Holm
@thekholm80
Jul 06 2018 20:09
why?
May Kittens Devour Your Soul
@diomed
Jul 06 2018 20:10
broken link
Kyle Holm
@thekholm80
Jul 06 2018 20:10
i think it just has to be wrapped in ""
image.png
Mahdi Burhan
@Mahdi0123
Jul 06 2018 20:12
how do i only pass one parameter in with onclick when i have two parameters in my function?
Kyle Holm
@thekholm80
Jul 06 2018 20:13
can we see your code?
Mahdi Burhan
@Mahdi0123
Jul 06 2018 20:13
yes,
image.png
Kyle Holm
@thekholm80
Jul 06 2018 20:15
so you want something like onClick(playRound(passThisOne, notThisOne))?
Mahdi Burhan
@Mahdi0123
Jul 06 2018 20:15
yeah
with onclick only to the first parameter
Kyle Holm
@thekholm80
Jul 06 2018 20:16
from looking at your code, if you don't pass player how will that function know what the value of player should be?
i mean, you can call your function like playRound(null, 'Rock') but it's going to cause a lot of errors
Mahdi Burhan
@Mahdi0123
Jul 06 2018 20:18
i only added the computer parameter after i checked to see that the player one worked
,but i then forgot that i had two parameters on my onclick
i am trying to pass in the player via onclick
i tried calling it via ID also and putting it in a function, but i did it via local scope so it didn't reach further
Kyle Holm
@thekholm80
Jul 06 2018 20:22
hmm, looks like computer chooses Rock every time lol
so i made a few changes
i changed var computer = function() { to just function computer() {
Mahdi Burhan
@Mahdi0123
Jul 06 2018 20:23
What does it choose rock?
Kyle Holm
@thekholm80
Jul 06 2018 20:23
then in your onclick i put onclick="playRound('Rock', computer())"
Mahdi Burhan
@Mahdi0123
Jul 06 2018 20:23
it should be random
Kyle Holm
@thekholm80
Jul 06 2018 20:23
so that it's generating a new value for computer every click
Mahdi Burhan
@Mahdi0123
Jul 06 2018 20:24
hmm that interesting
Kyle Holm
@thekholm80
Jul 06 2018 20:24

it's always Rock because

The Math.random() function returns a floating-point, pseudo-random number in the range 0–1 (inclusive of 0, but not 1)

Mahdi Burhan
@Mahdi0123
Jul 06 2018 20:25
ahh i see
i forgot the 0.
thanks @thekholm80 helped alot
Kyle Holm
@thekholm80
Jul 06 2018 20:25
you might try something like Math.floor(Math.random() * 100)) to get a number between 1 - 100
i believe the general way of going about it is Math.floor(Math.random() * (max - min)) + min to get a random number between min and max
Mahdi Burhan
@Mahdi0123
Jul 06 2018 20:28
Yeah - thats also a great to do it
Mahdi Burhan
@Mahdi0123
Jul 06 2018 20:45
@thekholm80 is it ok if i use computer in the parameter and not computer()?
Kyle Holm
@thekholm80
Jul 06 2018 20:46
the problem with that is computer will never equal Rock, Paper, or Scissors because computer is a function
doing computer() will turn the function into a value
so
computer === 'Rock' // false
computer === 'Scissors' // false
computer === 'Paper' // false
typeof computer // function
Mahdi Burhan
@Mahdi0123
Jul 06 2018 20:49
ahh i see
it as coming out weird in mine
a big red button on JS
Why is that button coming up?
Kyle Holm
@thekholm80
Jul 06 2018 20:52
function playRound(player, computer()){ here you don't want computer()
you do want the () in the click handlers
Mahdi Burhan
@Mahdi0123
Jul 06 2018 20:52
ahh so it nots needed in the parameters?
Kyle Holm
@thekholm80
Jul 06 2018 20:53
correct, there you're just basically making a new variable called computer
Mahdi Burhan
@Mahdi0123
Jul 06 2018 20:53
hmm interesting - gotta read up on this. Thanks for all the help @thekholm80
Kyle Holm
@thekholm80
Jul 06 2018 20:54
you bet
Bjorn van de Peut
@bjorno43
Jul 06 2018 22:06
Time for a bit of crazyness:
let x=[0];
x === x; // true
x ==! x; // true

Math.max() > Math.min(); // false

true+true === 2; // true
true-true === 0; // true
true === 1; // false
Kyle Holm
@thekholm80
Jul 06 2018 22:09
silly JS
Karma Drukpa
@coderkarma
Jul 06 2018 22:18
Interesting
Bjorn van de Peut
@bjorno43
Jul 06 2018 22:22
Well the last one makes sense to me, it's just the other two that don't
Karma Drukpa
@coderkarma
Jul 06 2018 22:23
folks what would be good way of concat the mulitiples array without concat
ex. [1,2,3 [3], [4], [ 6, 8,10]]
with spread operator i was kind of confused
Bjorn van de Peut
@bjorno43
Jul 06 2018 22:25
true equals to 1 in value. So true + true becomes 2. As 2 isn't a valid booleon type, it becomes an integer. But if you actually do a strict check on true, it will return false because true is booleon and 1 is an int.
Kyle Holm
@thekholm80
Jul 06 2018 22:25
your example isn't a valid array, can you fix it?
Karma Drukpa
@coderkarma
Jul 06 2018 22:25
fixed
Kyle Holm
@thekholm80
Jul 06 2018 22:26
so [1,2,3, [3], [4], [ 6, 8,10]]?
Karma Drukpa
@coderkarma
Jul 06 2018 22:26
yeah way of doing that would be concat right.
Kyle Holm
@thekholm80
Jul 06 2018 22:26
and you want it to be [1, 2, 3, 3, 4, 6, 8, 10]?
Karma Drukpa
@coderkarma
Jul 06 2018 22:26
yes
concat([1], [[2], [3]], [4]); // [1, [2], [3], 4]
i want that output if there are multiples array's inside
Bjorn van de Peut
@bjorno43
Jul 06 2018 22:29
@coderkarma MDN actually provides a solution for that:
const arr = [1,2,3, [3], [4], [ 6, 8,10]];
function flattenDeep(arr1) {
   return arr1.reduce((acc, val) => Array.isArray(val) ? acc.concat(flattenDeep(val)) : acc.concat(val), []);
}
flattenDeep(arr);
Karma Drukpa
@coderkarma
Jul 06 2018 22:29
and function says, it accept an array and muiltiples variables
no concat built in plz
Kyle Holm
@thekholm80
Jul 06 2018 22:29
var arr = [1,2,3, [3], [4], [ 6, 8,10]];
var flatArr = arr.reduce((a, b) => Array.isArray(b) ? [...a, ...b] : [...a, b]), []);
i think that would do it
but don't actually use that code unless you know what it's doing
oh, Array.isArray() i like that better than typeof
Bjorn van de Peut
@bjorno43
Jul 06 2018 22:31
Another solution they provide is:
//non recursive flatten deep using a stack
function flatten(input) {
  const stack = [...input];
  const res = [];
  while (stack.length) {
    // pop value from stack
    const next = stack.pop();
    if (Array.isArray(next)) {
      // push back array items, won't modify the original input
      stack.push(...next);
    } else {
      res.push(next);
    }
  }
  //reverse to restore input order
  return res.reverse();
}
Karma Drukpa
@coderkarma
Jul 06 2018 22:31
hahah yeah, i didn't really understood, i know you are using spread operator and array is array built in
Kyle Holm
@thekholm80
Jul 06 2018 22:33
@bjorno43 i think he only wants to flatten one level, not the deep
Bjorn van de Peut
@bjorno43
Jul 06 2018 22:33
Karma Drukpa
@coderkarma
Jul 06 2018 22:33
ok
Bjorn van de Peut
@bjorno43
Jul 06 2018 22:34
@thekholm80 Nah I've encountered that challenge in the curriculum earlier. If I remember correctly, it also tests for multilevel arrays
Kyle Holm
@thekholm80
Jul 06 2018 22:34
@bjorno43 i don't think he's doing a fcc lesson
Bjorn van de Peut
@bjorno43
Jul 06 2018 22:35
Ah ok
Kyle Holm
@thekholm80
Jul 06 2018 22:35
i mean, i could be wrong
but yesterday he was working on something outside fcc
Karma Drukpa
@coderkarma
Jul 06 2018 22:35
Nope this is not Fcc challenge. i am doing FCC challenge also but not quite their yet.
you are right, want to pass this technical interview with bootcamp coding school
Kyle Holm
@thekholm80
Jul 06 2018 22:37
for the deep flatten i think recursion is best
i'm pretty sure that's how i did it for the fcc lesson
but i can't seem to see any of my lesson solutions atm
Bjorn van de Peut
@bjorno43
Jul 06 2018 22:40
Nah you can't anymore. Your solutions are only saved within your session. So as soon as you close your browser, your solutions are gone
Kyle Holm
@thekholm80
Jul 06 2018 22:41
my public profile doesn't show anything at all
i think i found an open issue about it yesterday though, so hopefully a fix is in the works
oh neat
image.png
they added a 'Download my solution' button
Kyle Holm
@thekholm80
Jul 06 2018 22:48
oh, that's why you don't use typeof
var arr = [];
typeof arr; // 'object'
Aditya
@ezioda004
Jul 06 2018 22:51
@bjorno43 Is it going to get fixed? Solutions saving as cookies? I miss that functionality.
Also Math.max() > Math.min(); //false because Math.min() //Infinity starts comparing stuff with +Infinity and Math.max() //-Infinity from -Infinity so it kinda makes sense but yea not intuitive at first.
Bjorn van de Peut
@bjorno43
Jul 06 2018 22:54
@ezioda004 I honestly wouldn't know. I know there's talk about it, but a decision isn't made yet. That's probably why the download button got added for now. And thanks, that does make sense
Aditya
@ezioda004
Jul 06 2018 22:56
Its just great for quick reference, I really hope its added back. Though one can save locally or github but for every challenge its like so much work
Kyle Holm
@thekholm80
Jul 06 2018 22:57
maybe it has to do with gdpr?
Aditya
@ezioda004
Jul 06 2018 23:00
🤔
Bjorn van de Peut
@bjorno43
Jul 06 2018 23:01
Probably. The GDPR states that you need a legal basis for every type of personally identifyable data you process. The problem is that "personally identifyable" is a very broad term under the GDPR. Even a simple session id cookie falls under it, though identifying someone with just that id will be next to impossible. Probably code written by a user is also bound to this
Aditya
@ezioda004
Jul 06 2018 23:05
But dont other coding website also does it though?
Bjorn van de Peut
@bjorno43
Jul 06 2018 23:07
Oh I don't actually believe it'd be an issue. FCC is basicly a school. It makes sense to process answers given by users. It's just that the GDPR is still very new to everyone and most are being very carefull about what they're allowed to do and what not. The fines you can get for violating that law are no joke. It goes in the millions of euros
Kyle Holm
@thekholm80
Jul 06 2018 23:08
oh, the fines are in euros? that's okay then. i thought they'd want real money
Bjorn van de Peut
@bjorno43
Jul 06 2018 23:08
:joy:
Aditya
@ezioda004
Jul 06 2018 23:10
:fire: :euro: