We've made one React component; let's make another!
As we discussed earlier, the goal of this chapter is to create our application's login page. First, let's create a folder called components/
in our src
folder, and then inside, let's create a file called LoginContainer.js
.
Note
If you still have the folder from our Chapter 2, Getting Started withWebpack, with Component1.js
, Component2.js
, and Component3.js
, feel free to delete those files now.
Our LoginContainer
will be another class component, for reasons that we'll look at down the road. Just as with our app, let's set up a basic class component skeleton:
import React, { Component } from 'react'; class LoginContainer extends Component { render() { } } export default LoginContainer;
Let's test out rendering our component before we dive any further in. Return a simple <h1>Hello from LoginContainer</h1>
from our render
method; then, let's jump back to our App.js
.
I'm a bit of a stickler for code organization...