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!