Chapter 2. Lets Build a Responsive Theme with React-Bootstrap and React

Now, that you've completed your first web app using ReactJS and Bootstrap, we're going to build the first responsive theme for your app using both the frameworks. We'll also be touching on the full potential of both frameworks. So, let's start!

Setting up

Firstly, we need to create a similar folder structure to our Hello World app which we made in Chapter 1, Getting Started with React and Bootstrap.

The following screenshot describes the folder structure:

Setting up

Now you need to copy the ReactJS and Bootstrap files from chapter1 into the significant directories of Chapter2 and create an index.html file in the root. The following code snippet is just a base HTML page which includes Bootstrap and React.

Here is the markup of our HTML page:

<!doctype html>
<html lang="en">
    <head>
        <meta charset="utf-8">
        <title>ReactJS theme with bootstrap</title>
        <link rel="stylesheet" href="css/bootstrap.min.css">
        <script type="text/javascript" src="js/react.min.js">
        </script>
        <script type="text/javascript" src="js/react-dom.min.js">
        </script>
        <script src="js/browser.min.js"></script>
    </head>
    <body>
    </body>
</html>
..................Content has been hidden....................

You can't read the all page of ebook, please click here login for view all page.
Reset