"Campsite component won't render" error is rendering my entire existence as a useless, mistake prone waste of space/time

"Campsite component won't render" error is rendering my entire existence as a useless, mistake prone waste of space/time
0

#1

Tell us what’s happening:
Getting a few errors thrown my way via the console but the most troubling is the “Campsite component doesn’t render error”…no clue why this is happening…

Your code so far


class CampSite extends React.Component {
  constructor(props) {
    super(props);
  }
  render() {
    return (
      <div>
        <Camper/>
      </div>
    );
  }
};
// change code below this line


const Camper= (props) =>  {
    return(
     <div>
     <p>Hi my name is 
     <CampSite Camper={props.name} />
    </p>
     </div> 

    )  
    }
Camper.defaultProps= {name: 'CamperBot'}

Camper.propTypes = {name: PropTypes.isRequired.string}


Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 6.3; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/68.0.3440.106 Safari/537.36.

Link to the challenge:
https://learn.freecodecamp.org/front-end-libraries/react/review-using-props-with-stateless-functional-components/


#2

You are not following the instruction below:

Inside the Camper component, render any code that you want, but make sure to have one p element that includes only the name value that is passed in as a prop.

You have your logic backwards. Campsite is the parent component, so Campsite would normally be passing a prop to Camper. They do not want you to modify Campsite (by passing a “name” prop and value to Camper). Instead, they just want you to render the value of a prop named “name” which will exist in props. Since you defined a default prop of ‘CamperBot’ for “name”, it will use ‘CamperBot’.

For some reason, you are trying to insert the Campsite component into the Camper function instead of just using the name property of props to display inside the p element.

EDIT: Also be aware, that your propTypes syntax is incorrect, so it error out and the instructions tell you that the p element should only include the name value that is passed in as a prop. You have other test in the p element.


#3

Still confused on this one @RandellDawson…If I scrap component then that fails one of the requirements and when I just use {props.name} (nested in the "Hi my name is…"element) I get an ‘undefined’ error.

Can you outline/number the steps I should take to remedy this?
Also, is there a Slack channel for FreeCodeCamp I can access?

Edit: Pls disregard prev ?..See u guys dont use Slack:

THANKS–Rasheim

PS–I’ve found the Gitter channel tho…Txs