4th Street Bar Hive-Bar

Hive-Bar Powered by Hive beta-fdb5b5b

Community post

Day 59

March 13th, 2018

Hello! At the React for Beginners course by Wes Bos I did displaying state with JSX.
The goal was to move parts around the app. We do that by making a component.
If you want to use logic in JSX, just use JS.

Loop over all fish

     <ul className="fishes">{Object.keys(this.state.fishes).map(key => (
						        <Fish key={key} details={this.state.fishes[key]}/>

We take the "fish" from the state and map over it, and then render it out.

ES destructuring, set a lot of variables :
const { image, name, price, description, status } = this.props.details;

Include the helpers to convert dollars to cents

      {formatPrice(price)}

At the Web Development Bootcamp by Colt Steele I continued to work on the Yelpish App.
We made a new campgrounds page where we can add a new campground that will update the page.

    <form action="/campgrounds" method="POST">

Get and post are different, which is why we can use the sam url.

   app.get("/campgrounds/new", function(req, res){
          res.render("new.ejs");
       });

  app.post("/campgrounds", function(req, res){
             //get data from form and add to campgrounds array
            var newCampground = {name: name, image:image};
            campgrounds.push(newCampground);
            res.redirect("/campgrounds");

Cheers!

1 upvotes $0.00

Replies (0)

Conversation

No replies yet

Replies will appear here as people join the conversation.

Review before signing

Posting as . Signing with . Keychain permission: Posting. Hive Keychain will ask you to approve this action next.


  
Technical details

Operation fingerprint: