Update the App
Let’s make a couple of quick changes to test the process of deploying updates to our app.
We are going to add a Login and Signup button to our lander to give users a clear call to action.
To do this update our renderLander
method in src/containers/Home.js
.
renderLander() {
return (
<div className="lander">
<h1>Scratch</h1>
<p>A simple note taking app</p>
<div>
<Link to="/login" className="btn btn-info btn-lg">
Login
</Link>
<Link to="/signup" className="btn btn-success btn-lg">
Signup
</Link>
</div>
</div>
);
}
And import the Link
component from React-Router in the header.
import { Link } from "react-router-dom";
Also, add a couple of styles to src/containers/Home.css
.
.Home .lander div {
padding-top: 20px;
}
.Home .lander div a:first-child {
margin-right: 20px;
}
And our lander should look something like this.
Next, let’s deploy these updates.
For help and discussion
Comments on this chapterFor reference, here is the code we are using
Frontend Source :update-the-appIf you liked this post, please subscribe to our newsletter, give us a star on GitHub, and follow us on Twitter.