These are chat archives for FreeCodeCamp/Help

29th
Jan 2019
kinopotato
@kinopotato
Jan 29 03:44
Guys you know of any good backend tutorial using node/ejs/express? Colt Steele was pretty good but became sorta convoluted at the backend part for me.
Manish Giri
@Manish-Giri
Jan 29 05:40
@kinopotato if you're fine with paid courses, udemy has good ones..
by andrew mead and stephen grider
kinopotato
@kinopotato
Jan 29 07:08
@Manish-Giri thanks! I'll check them out.
Karma Drukpa
@coderkarma
Jan 29 07:31
hello
any one here
kinopotato
@kinopotato
Jan 29 07:31
Hello
Karma Drukpa
@coderkarma
Jan 29 07:31
How is it going ?
@Manish-Giri are you online?
@aditya are you online?
const addPepperoniToPizza = arr => {
let result = arr.map((ele) => {
        if (arr.indexOf(ele.includes("pepperoni"))) {
            arr.push("pepperoni")
        }
        return ele;
    })
    return result;
}
console.log(addPepperoniToPizza(['onions', 'olives', 'pineapple']));
why I am not able to push the pepperoni
in the arry
Kranti Nebhwani
@darkphotonKN
Jan 29 07:42

Sup guys, have a node hosting environment issue (i think), basically right now:

  • I have a site up on heroku
  • API calls from server side (nodejs) don't work on the heroku hosted site, but the same api endpoint works fine if the request comes from client side.
  • API is made by a friend of mine, he's added CORs which allows me to request the api endpoint client side. But again server-side requests fail.
  • Both requests are done with axios.
  • Both server side and client side requests to this endpoint WORK ON LOCAL SET UP. E.g. I run npm run dev and the server runs the page with server-side request works fine, and so does the page making client-side requests.

Why do you think it fails when hosted on heroku? Client side requets needed CORs to be allowed for it to work, does server-side get requests need something else in a production environment? Could it be the https?

One error message we get from output from try catch block where the get request is in the try is mixed content error. I researched on that and I'm pretty sure it's not because of that..

Manish Giri
@Manish-Giri
Jan 29 07:45
@coderkarma yup
@coderkarma you should check this line -
if (arr.indexOf(ele.includes("pepperoni"))) {
ele.includes("pepperoni") would return a boolean, true/false, which would mean your outer indexOf would be arr.indexOf(true) or arr.indexOf(false)
looking at your sample array, don't think there's any boolean in there..
kinopotato
@kinopotato
Jan 29 08:16
is there an innate feature in js/node/express that will allow me to make a calendar that can sync with my timezone?
I will have to present data along with dates (like an organizer) which means it will have to keep a record of past months/years
kinopotato
@kinopotato
Jan 29 09:55
anyone here got any experience making calendars/organizers?
tundeiness
@tundeiness
Jan 29 11:06
hi guys, can you help me look at this project? https://codepen.io/highness/pen/xmMMoG?editors=0011 the drum pads are not displaying the way I want it to. It has just been refactored to the present code base because I want to remove repetitive stuffs. So I thought I should map over the data sounds in state to create the drum pads but it seem it might be a wrong idea? any help is appreciated. Thanks.
Praveen Saraogi
@saraogipraveen
Jan 29 11:41
class DisplayMessages extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      input: '',
      messages: []
    }
  }
  // add handleChange() and submitMessage() methods here

  handleChange (e){
    this.setState({
      input : e.target.value
    })
  }

submitMessage () {

this.state.messages.push(this.state.input)

  this.setState({
    input : '',
    messages : this.state.messages
  })
}

  render() {

    let messageList;

    messageList = this.state.messages.map((msg)=>{
      return <li>{msg}</li>
    })

    return (
      <div>
        <h2>Type in a new Message:</h2>
        { /* render an input, button, and ul here */ }
        <input type="text" value={this.state.input} onChange={(e)=>this.handleChange(e)} />
        <button onClick={()=>this.submitMessage()}> Add Message </button>
        <ul>
        {messageList}
        </ul>

        <p>{this.state.messages}</p>
        { /* change code above this line */ }
      </div>
    );
  }
};
it is giving the desired output
but still one test case its showing error
that "add message click should add the current input to the local state messages"
but it is already working
this is the second challenge from react & redux section
Clicking the Add message button should call the method submitMessage which should add the current input to the messages array in state.
Niraj Nandish
@Nirajn2311
Jan 29 12:37
@diomed did you check hackerranks developer survey
Vue is making progress but silently
Aditya
@ezioda004
Jan 29 13:55
@raviloop This is wrong:
this.state.messages.push(this.state.input)

  this.setState({
    input : '',
    messages : this.state.messages
  })
You shouldnt be mutating the state directly.
Praveen Saraogi
@saraogipraveen
Jan 29 14:04
@ezioda004 i even copied it in another variable and did the same but still there is an error
Aditya
@ezioda004
Jan 29 14:04
@raviloop What did you try?
Praveen Saraogi
@saraogipraveen
Jan 29 14:05
@raviloop
let tempMessages = this.state.messages
 tempMessages.push(this.state.input)



  this.setState({ 
     input : '',
     messages : tempMessages 
    })
@ezioda004
@ezioda004
```
this.setState(prevState => ({
  input : '',
  messages: [...prevState.messages, this.state.input]
}))
ok got it resolved using this method
prevstate
Aditya
@ezioda004
Jan 29 14:09

FYI - this:

let tempMessages = this.state.messages
 tempMessages.push(this.state.input)

Doesnt work because the array is the same reference and not a new one. [...] makes a new object therefore different reference.

kibablu
@kibablu
Jan 29 14:41
Hey all.. am newbie I have created Tribute Page on Codepen.. How can I test it with FCC tests?
@/all Hey all.. am newbie I have created Tribute Page on Codepen.. How can I test it with FCC tests?
tundeiness
@tundeiness
Jan 29 15:21
hi guys, can you help me look at this project? https://codepen.io/highness/pen/xmMMoG?editors=0011 the drum pads are not displaying the way I want it to. It has just been refactored to the present code base because I want to remove repetitive stuffs. So I thought I should map over the data sounds in state to create the drum pads but it seem it might be a wrong idea? any help is appreciated. Thanks.
Christopher McCormack
@cmccormack
Jan 29 15:37

@kibablu the tribute page explanation has a bullet for the testing suite:

You can build your project by forking this CodePen pen. Or you can use this CDN link to run the tests in any environment you like: https://cdn.freecodecamp.org/testable-projects-fcc/v1/bundle.js.

Are you having issues adding this?

kibablu
@kibablu
Jan 29 18:38
Thank you @cmccormack
Christopher McCormack
@cmccormack
Jan 29 18:40
@kibablu no problem - you can add that URL to the CodePen JavaScript settings, or add it as a script tag to your head element or the CodePen HTML <head> section, or just the bottom of your HTML if you want, all should work
Zaza
@ForkInSpace
Jan 29 22:27
Anyone around for a quick CSS challenge ?
:D
Kaz Baig
@kbaig
Jan 29 22:33
sup
Zaza
@ForkInSpace
Jan 29 22:39
Hi @kbaig
I basically have a nested collapsible list which I'm trying to align nicely.
the issue is that I do want the indentation that lists natively support
however I don't want the following cells to be jacked off (see the image for ref)
by cells I mean flexbox items
image.png
I wanna keep the indentation at the left hand side however I want the numbers aligned beneath each other
Kaz Baig
@kbaig
Jan 29 22:41
I could be more helpful if you provided a codepen rather than an image
Zaza
@ForkInSpace
Jan 29 22:45
sec