O'Reilly logo

Learning Web Development with React and Bootstrap by Mehul Bhatt, Harmeet Singh

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Static form with React and Bootstrap

We have completed our first Hello World app with React and Bootstrap and everything looks good and as expected. Now it's time do more and create one static login form, applying the Bootstrap look and feel to it. Bootstrap is a great way to make your app a responsive grid system for different mobile devices and apply the fundamental styles on HTML elements with the inclusion of a few classes and divs.

Note

The responsive grid system is an easy, flexible, and quick way to make your web application responsive and mobile-first, that appropriately scales up to 12 columns per device and viewport size.

First, let's start to make an HTML structure to follow the Bootstrap grid system.

Create a div and add a className .container ...

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required