March 13th, 2018
<p dir="auto">Hello! At the React for Beginners course by Wes Bos I did displaying state with JSX.<br /> The goal was to move parts around the app. We do that by making a component.<br /> If you want to use logic in JSX, just use JS. <p dir="auto">Loop over all fish <pre><code> <ul className="fishes">{Object.keys(this.state.fishes).map(key => ( <Fish key={key} details={this.state.fishes[key]}/> <p dir="auto">We take the "fish" from the state and map over it, and then render it out. <p dir="auto">ES destructuring, set a lot of variables :<br /> const { image, name, price, description, status } = this.props.details; <p dir="auto">Include the helpers to convert dollars to cents <pre><code> {formatPrice(price)} <p dir="auto">At the Web Development Bootcamp by Colt Steele I continued to work on the Yelpish App.<br /> We made a new campgrounds page where we can add a new campground that will update the page. <pre><code> <form action="/campgrounds" method="POST"> <p dir="auto">Get and post are different, which is why we can use the sam url. <pre><code> 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"); <p dir="auto">Cheers!