Background Images

1

I’m having trouble figuring out how to set up a repeating background image for my react app. I want to understand how to easily set this background image, then have a body wrapper inside that like this:

image
image1567×915 238 KB

A question off of that - how do I set a background image in the CSS when importing it with webpack in my index.js file?

On top of that, how should I set background images for lower components just like this webpage?

With your SPA example–

  class Main extends Component {
    render() {
        return (
            <HashRouter>
                <div className="page_padding"></div>
                <ul className="header">
                    <li><NavLink to="/">Home</NavLink></li>
                    <li><NavLink to="/About">About</NavLink></li>
                </ul>
                <div className="content">
                    <Route exact path="/" component={Home} />
                    <Route path="/About" component={About} />
                </div>
            </HashRouter>
        );
    }
}

Where should I be adding a style to change the background of the Main component?

2

You’ll want to add a background to an entire page on the body element. What is the HTML file that is the entry point for your app? Is there a CSS file associated with it named something like index.css?