These are chat archives for FreeCodeCamp/Help

13th
Feb 2018
okemmadu eric
@OkemmaduEric_twitter
Feb 13 2018 02:52

whats wrong with this code in javascript

let logPersonName = logName.apply(person,['en','es']);

Kyle Holm
@thekholm80
Feb 13 2018 02:54
@OkemmaduEric_twitter is logName a function?
Kyle Holm
@thekholm80
Feb 13 2018 03:25
@Gersho me
Darren
@DarrenfJ
Feb 13 2018 06:16
evening fCC
sorry for the late reply but thanks or the hi hello @khaduch
CamperBot
@camperbot
Feb 13 2018 06:17
darrenfj sends brownie points to @khaduch :sparkles: :thumbsup: :sparkles:
:star2: 3733 | @khaduch |http://www.freecodecamp.org/khaduch
Raqib
@HyperChocolate
Feb 13 2018 09:19
wQFAEGRSHTJY
Aditya
@ezioda004
Feb 13 2018 09:23
I feel the same way
Linh Nguyen My
@pinglinh
Feb 13 2018 10:53
Hi all, can anyone tell me where I am going wrong with this code for this challenge? https://beta.freecodecamp.org/en/challenges/react-and-redux/manage-state-locally-first
class DisplayMessages extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      input: '',
      messages: []
    }
    this.handleChange = this.handleChange.bind(this);
    this.submitMessage = this.submitMessage.bind(this);
  }
  // add handleChange() and submitMessage() methods here
  handleChange(event) {
    this.setState({
      input: event.target.value
    })
  }

  submitMessage() {
    (this.state.messages).concat(this.state.input);
    this.setState({
      input: ''
    })
  }

  render() {
    let messages = this.state.messages
    return (
      <div>
        <h2>Type in a new Message:</h2>
        { /* render an input, button, and ul here */ }
        <input onChange={this.handleChange} value={this.state.input} type="text"/>
        <button type="submit" value="Submit" onClick={this.submitMessage}>Add message</button>
        <ul>{messages.map((item) => {
            <li>{item}</li>
          })}</ul>

        { /* change code above this line */ }
      </div>
    );
  }
};
the last message doesnt pass
i mean test
Manish Giri
@Manish-Giri
Feb 13 2018 10:57
@pinglinh this line
    (this.state.messages).concat(this.state.input);
won't this return a new array
Linh Nguyen My
@pinglinh
Feb 13 2018 10:58
ahhhhhhhhhh
@Manish-Giri i got this now
class DisplayMessages extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      input: '',
      messages: []
    }
    this.handleChange = this.handleChange.bind(this);
    this.submitMessage = this.submitMessage.bind(this);
  }
  // add handleChange() and submitMessage() methods here
  handleChange(event) {
    this.setState({
      input: event.target.value
    })
  }

  submitMessage() {
    let newMessages = (this.state.messages).concat(this.state.input);
    this.setState({
      input: '',
      messages: newMessages
    })
  }

  render() {
    let messages = this.state.messages
    return (
      <div>
        <h2>Type in a new Message:</h2>
        { /* render an input, button, and ul here */ }
        <input onChange={this.handleChange} value={this.state.input} type="text"/>
        <button type="submit" value="Submit" onClick={this.submitMessage}>Add message</button>
        <ul>{messages.map((item) => {
            <li>{item}</li>
          })}</ul>

        { /* change code above this line */ }
      </div>
    );
  }
};
forgot i need to set new state to messages
Manish Giri
@Manish-Giri
Feb 13 2018 10:58
cool
good job :+1:
Linh Nguyen My
@pinglinh
Feb 13 2018 10:58
@Manish-Giri thank you!
Manish Giri
@Manish-Giri
Feb 13 2018 10:58
@pinglinh
CamperBot
@camperbot
Feb 13 2018 10:58
pinglinh sends brownie points to @manish-giri :sparkles: :thumbsup: :sparkles:
:star2: 6810 | @manish-giri |http://www.freecodecamp.org/manish-giri
Linh Nguyen My
@pinglinh
Feb 13 2018 10:59
can you show me how do use the spread operator on this though? @Manish-Giri
Manish Giri
@Manish-Giri
Feb 13 2018 10:59
messages: [...this.state.messages, this.state.input]
@pinglinh
Linh Nguyen My
@pinglinh
Feb 13 2018 11:00
@Manish-Giri ooooooooo ...it confused me because technically this.state.messages is already an array
Manish Giri
@Manish-Giri
Feb 13 2018 11:00
here you use the spread on the messages array - which then combines with this.state.input to produce a new array
Linh Nguyen My
@pinglinh
Feb 13 2018 11:00
but i guess this mergers the two arrays
Sweet Coding :)
@SweetCodingInc
Feb 13 2018 11:01
Alternatively
submitMessage() {
    const { messages, input} = this.state;
    this.setState({
      input: '',
      messages: [...messages, input]
    })
}
Manish Giri
@Manish-Giri
Feb 13 2018 11:01
@pinglinh
Linh Nguyen My
@pinglinh
Feb 13 2018 11:01
@Manish-Giri @SweetCodingInc thank you!!!!!!!!
CamperBot
@camperbot
Feb 13 2018 11:01
pinglinh sends brownie points to @manish-giri and @sweetcodinginc :sparkles: :thumbsup: :sparkles:
:cookie: 287 | @sweetcodinginc |http://www.freecodecamp.org/sweetcodinginc
api offline
Manish Giri
@Manish-Giri
Feb 13 2018 11:01
try this in your browser dev tools
var a = [1, 2]
var b = [...a , 3]
always helps to experiment with smaller examples!
then test what the values of b and a are
Linh Nguyen My
@pinglinh
Feb 13 2018 11:05
@Manish-Giri omg thanks !!!! this makes so much sense
CamperBot
@camperbot
Feb 13 2018 11:05
pinglinh sends brownie points to @manish-giri :sparkles: :thumbsup: :sparkles:
api offline
Linh Nguyen My
@pinglinh
Feb 13 2018 11:05
:D
Manish Giri
@Manish-Giri
Feb 13 2018 11:05
@pinglinh awesome :star:
gishy1
@gishy1
Feb 13 2018 11:30
hello world need some help

function getIndexToIns(arr, num) {
  // Find my place in this sorted array.
  // sort out the arr

  var sorted = arr.sort(function(a,b){return a-b;});
  for (var i=0;i<arr.length;i++){
if(arr[i]<num&&num<arr[i]+1)
{
   return arr[i]; 
}  


}

}


getIndexToIns([2, 20, 10], 19);
Fabien SHAN
@X140hu4
Feb 13 2018 11:33
@gishy1 what is the expected result?
gishy1
@gishy1
Feb 13 2018 11:34
looking for the position bro
Aditya
@ezioda004
Feb 13 2018 11:34
@gishy1 Shouldnt you loop through the sorted array?
gishy1
@gishy1
Feb 13 2018 11:34
@ezioda004 thought that was what I was doing
Aditya
@ezioda004
Feb 13 2018 11:34
Oh nvm sort also mutates
gishy1
@gishy1
Feb 13 2018 11:36
@ezioda004 no apart from the fact that i have not used the indexOf method what else is missing
i basically wanted it to compare the first and second positions and then return the lower position
Fabien SHAN
@X140hu4
Feb 13 2018 11:38
What are you returning now?
Aditya
@ezioda004
Feb 13 2018 11:38
@gishy1 I dont think you need num<arr[i]+1 because you'll get the position where it needs to be inserted from arr[i]<num
gishy1
@gishy1
Feb 13 2018 11:38
oh so it is unnecessary?
Aditya
@ezioda004
Feb 13 2018 11:39
There can be 2 cases though, where the num is not a number from array and another where it is equal to one of the array element so you need to consider them.
Manish Giri
@Manish-Giri
Feb 13 2018 11:50
@gishy1 you could just push num to arr first, then sort the array..
Aditya
@ezioda004
Feb 13 2018 11:51
@gishy1 You have problem of this too arr[i]+1it should be arr[i+1] and needs to return the position you need to push it so like return i + 1
Manish Giri
@Manish-Giri
Feb 13 2018 11:51
then use indexOf() to find the position of num in arr.
@gishy1
Aditya
@ezioda004
Feb 13 2018 11:52
That solves the num not being in array then you have case where num is also an element of array, need to make another condition for that.
Manish Giri
@Manish-Giri
Feb 13 2018 11:53
nope
the problem passes with the first position of num, if there are multiple occurrences
so indexOf() would suffice
Aditya
@ezioda004
Feb 13 2018 11:54
Dont think theres multiple occurrence of an element in that challenge test cases, but yes indexOf() would be better to eliminate that possibility
Manish Giri
@Manish-Giri
Feb 13 2018 11:55
problem solved, either way
gishy1
@gishy1
Feb 13 2018 12:57
function getIndexToIns(arr, num) {
  // Find my place in this sorted array.
  // sort out the arr
  var sorted=arr.push(num);
   sorted = arr.sort(function(a,b){return a-b;});
  for (var i=0;i<arr.length;i++){
if(arr[i]==num)
{
    return arr.indexOf(arr[i]); 

}  


}

}


getIndexToIns([10, 20, 30, 40, 50], 35);
have a look guys i dont even know how i did this
but it worked somehow
Fabien SHAN
@X140hu4
Feb 13 2018 12:59
what about returning just i ?
gishy1
@gishy1
Feb 13 2018 13:03
that too
also num can work
in place of i
Ginger
@GingerChew
Feb 13 2018 13:29
anybody have any experience with anime.js? I'm running into some issues
Linh Nguyen My
@pinglinh
Feb 13 2018 14:09
Can anyone tell me what I'm missing here? https://beta.freecodecamp.org/en/challenges/react-and-redux/map-state-to-props
const state = [];

// change code below this line
const mapStateToProps = (state) {
  return {
    messages: state
  }
}
nvm
it's coz I added const
to the function
VaseJS
@VaseJS
Feb 13 2018 14:15
@pinglinh i was wondering what happened to you
looks like you’ve come a long way
Stephen James
@sjames1958gm
Feb 13 2018 14:34
@pinglinh You are missing the => in the arrow function
Darren
@DarrenfJ
Feb 13 2018 16:06
morning fCC
Kyle Holm
@thekholm80
Feb 13 2018 16:07
@DarrenfJ good morning
Darren
@DarrenfJ
Feb 13 2018 16:07
can't stay long just wanted to say hi to the crew
Gersho
@Gersho
Feb 13 2018 16:15
Hello /help
@thekholm80 lol xD don't go super size :p
Kyle Holm
@thekholm80
Feb 13 2018 16:26
@Gersho lol
Linh Nguyen My
@pinglinh
Feb 13 2018 17:08
@sjames1958gm Ooooooooooooo thank you!!!
CamperBot
@camperbot
Feb 13 2018 17:08
pinglinh sends brownie points to @sjames1958gm :sparkles: :thumbsup: :sparkles:
:star2: 8972 | @sjames1958gm |http://www.freecodecamp.org/sjames1958gm
Linh Nguyen My
@pinglinh
Feb 13 2018 17:09
@VaseJS Hey!!! Yeah I'm starting to really get React thanks to FCC!!
CamperBot
@camperbot
Feb 13 2018 17:09
pinglinh sends brownie points to @vasejs :sparkles: :thumbsup: :sparkles:
:cookie: 519 | @vasejs |http://www.freecodecamp.org/vasejs
VaseJS
@VaseJS
Feb 13 2018 17:10
@pinglinh good. you’re coming along just fine :+1:
Kelechi Chinaka
@ke1echi
Feb 13 2018 17:27
:wave: @Gersho
Gersho
@Gersho
Feb 13 2018 17:27
:wave: @kelechy
Kelechi Chinaka
@ke1echi
Feb 13 2018 17:27
how are the codes lines up your end @Gersho
Gersho
@Gersho
Feb 13 2018 17:31
i did good progress, but i'm running into other problems, i'm switching to another of the challenges for a bit (there's 3 to do in pset4, already done one, one is getting close and i haven't started the other one)
Kelechi Chinaka
@ke1echi
Feb 13 2018 17:33
o nice
Gersho
@Gersho
Feb 13 2018 17:33
after this pset i think i'll switch out a bit and do some react or something, i'm gettin,g overloaded with C a bit xD
Kelechi Chinaka
@ke1echi
Feb 13 2018 17:33
slow and steady you would finish the race
Gersho
@Gersho
Feb 13 2018 17:33
i've been on pset4 for quite a while now
Kelechi Chinaka
@ke1echi
Feb 13 2018 17:33
:smile: o really... i think its a nice head banging course
Gersho
@Gersho
Feb 13 2018 17:34
oh it's nice, but i need to mix it up a bit
Kelechi Chinaka
@ke1echi
Feb 13 2018 17:34
true
i would love to mix it with fcc beta when it goes live :smile:
Gersho
@Gersho
Feb 13 2018 17:37
how about you ?
Kelechi Chinaka
@ke1echi
Feb 13 2018 17:42
just back from school... i would complete credit some hours from now
Gersho
@Gersho
Feb 13 2018 17:45
how are your pupils/students ?
Kelechi Chinaka
@ke1echi
Feb 13 2018 17:46
:smile: good
Kelechi Chinaka
@ke1echi
Feb 13 2018 17:59
do you ever feel the course is a test of a true programmer? @Gersho
Gersho
@Gersho
Feb 13 2018 18:06
you'll have to ask a true programmer xD
Kelechi Chinaka
@ke1echi
Feb 13 2018 18:06
:smile:
i feel so but what do i know am only a noob :smile:
Aniculaesei
@Aniculaesei
Feb 13 2018 19:56
Hi guys.Can you please help me.The browser doesnt see my img path....On codepen work with direct link...But If I use the images from the same folder,doesnt work.Thank you
<!DOCTYPE html>
<html>
    <head>
        <title>Try it</title>
    </head>
    <body>
        <script>
            var i = 0;
            var images = [];
            var time = 3000;

            images[0] = "image1.jpg";
            images[1] = "image2.jpg";
            images[2] = "image3.jpg";

            function changeImg(){
                document.slide.src = images[i];

                if(i<images.length-1){
                    i++;
                 }else{
                     i = 0;
                 }
                 setTimeout("changeImg()",time);
            }  

            window.onload = changeImg;

        </script>
        <img name="slide" width="400" height="200"/>
    </body>
</html>
Gersho
@Gersho
Feb 13 2018 20:00
if they are in the same folder you should be able to access them with src = "./image1.jpg"
Manish Giri
@Manish-Giri
Feb 13 2018 20:02
also check your browser console for any errors
Stephen James
@sjames1958gm
Feb 13 2018 20:10
@Aniculaesei Here is a little code snippet that replaces your if check.
i = (i + 1) % images.length;
Aniculaesei
@Aniculaesei
Feb 13 2018 20:11
hmmm...sounds hard for me :))
@sjames1958gm Thanks
CamperBot
@camperbot
Feb 13 2018 20:12
aniculaesei sends brownie points to @sjames1958gm :sparkles: :thumbsup: :sparkles:
:star2: 8975 | @sjames1958gm |http://www.freecodecamp.org/sjames1958gm
Stephen James
@sjames1958gm
Feb 13 2018 20:12
It just keeps i in the range 0 : image.length - 1
Aniculaesei
@Aniculaesei
Feb 13 2018 20:13
@sjames1958gm Thanks again
CamperBot
@camperbot
Feb 13 2018 20:13
aniculaesei sends brownie points to @sjames1958gm :sparkles: :thumbsup: :sparkles:
api offline
Aniculaesei
@Aniculaesei
Feb 13 2018 20:13
@sjames1958gm and I have to use it with "if"?
Stephen James
@sjames1958gm
Feb 13 2018 20:14
@Aniculaesei No replace all of this
             if(i<images.length-1){
                    i++;
                 }else{
                     i = 0;
                 }
Aniculaesei
@Aniculaesei
Feb 13 2018 20:16
@sjames1958gm cool :D
@sjames1958gm Thanks again
CamperBot
@camperbot
Feb 13 2018 20:18
api offline
aniculaesei sends brownie points to @sjames1958gm :sparkles: :thumbsup: :sparkles:
Aniculaesei
@Aniculaesei
Feb 13 2018 20:18
bye
enerre
@enerre
Feb 13 2018 20:34
Anybody could help me here? I can't understand what he want I do: https://www.freecodecamp.org/challenges/turn-an-image-into-a-link THANKS
i have solved it. thanks :)
sorry
Kaz Baig
@kbaig
Feb 13 2018 21:17
Has anyone tried deploying a project on Glitch?
Johnny
@JohnnyBizzel
Feb 13 2018 21:59
@kbaig many
artbohr
@artbohr
Feb 13 2018 22:28

guys, is this an okey structure for react-router?

App.js

class App extends Component {
  render() {
    return (
      <BrowserRouter>
        <div>
          <Navigation/>
          <Switch>
            <Route exact path='/' component={Home}/>
            <Route exact path='/polls' component={Polls}/>
            <Route exact path='/login' component={Login}/>
            <Route exact path='/register' component={Register}/>
            <Route path='*' component={NotFound} />
          </Switch>
          <Footer/>
        </div>
      </BrowserRouter>
    );
  }
}

Navgation Component

class Navigation extends React.Component {
  render () {
    return (
      <div>
        <Navbar>
          <Navbar.Header>
            <Navbar.Brand>
              Voting App
            </Navbar.Brand>
          </Navbar.Header>
          <Nav pullRight>
            <NavItem>
              <NavLink to='/' activeClassName='active'>Home</NavLink>
            </NavItem>
            <NavItem>
              <NavLink to='/polls' activeClassName='active'>Polls</NavLink>
            </NavItem>
            <NavItem>
              <NavLink to='/login' activeClassName='active'>Login</NavLink>
            </NavItem>
            <NavItem>
              <NavLink to='/register' activeClassName='active'>Register</NavLink>
            </NavItem>
          </Nav>
        </Navbar>
      </div>
    )
  }
}
I'm getting tons of warnings in the console, like this one Warning: validateDOMNesting(...): <a> cannot appear as a descendant of <a>. but the app works just fine
Kyle Holm
@thekholm80
Feb 13 2018 22:43
i'm fairly certain you would only want to use exact on your base route
and you don't need a path on your default path, you can just use <Route component={ NotFound } />
as the fallback route
JBallin
@JBallin
Feb 13 2018 23:12
trying to contribute on github. i forked the repo, made 2 commits on a branch, submitted a pr which was successfully merged. now i want to make another commit on the same branch but it says "2 commits ahead, 7 commits behind". how do i go about making another contribution on this branch?
those 2 commits ahead are the ones that were merged upstream
Manish Giri
@Manish-Giri
Feb 13 2018 23:33
git pull --rebase remote branch
@JBallin
Kyle Holm
@thekholm80
Feb 13 2018 23:33
:fire:
Manish Giri
@Manish-Giri
Feb 13 2018 23:35
:droplet:
artbohr
@artbohr
Feb 13 2018 23:43
@thekholm80 doesn't work without exact
@thekholm80 ah no, u were right, works if I leave only the base root
@thekholm80 and about the warning spam, any ideas? what's wrong
Kyle Holm
@thekholm80
Feb 13 2018 23:46
my thought is you have <NavLink ...> inside an element that is being interpreted as an anchor element as well
not sure if it would be <NavItem> or <Nav> or <NavBar>
artbohr
@artbohr
Feb 13 2018 23:47
@thekholm80 btw If i get rid of exact options I get a new warning
@thekholm80 ah no, my bad again there, it's all fine from what U said, thanks
CamperBot
@camperbot
Feb 13 2018 23:47
artbohr sends brownie points to @thekholm80 :sparkles: :thumbsup: :sparkles:
:star2: 1692 | @thekholm80 |http://www.freecodecamp.org/thekholm80
artbohr
@artbohr
Feb 13 2018 23:48
@thekholm80 do you know any good work around that Nesting going on on the Nav elements?
Kyle Holm
@thekholm80
Feb 13 2018 23:48
i'm not sure what your nav elements are
so it's hard to say
artbohr
@artbohr
Feb 13 2018 23:49
@thekholm80 it's react bootstrap
Kyle Holm
@thekholm80
Feb 13 2018 23:49
i suspected, i'm not familiar with that library
i do know that <NavLink> gets interpreted as <a> and can't be a child of anything else that gets interpreted as an <a>
artbohr
@artbohr
Feb 13 2018 23:53
@thekholm80 funny stuff how the react-bootstrap messes with react
Kyle Holm
@thekholm80
Feb 13 2018 23:54
i generally avoid bootstrap, i'm too lazy to learn how it works