Full Stack Development with JHipster

Bootstrap components using Reactstrap

JHipster uses Bootstrap 4 as its UI framework and since we are building a React application, it makes sense to use a Native React binding instead of Bootstrap's JQuery-based components. Reactstrap (https://reactstrap.github.io/) provides pure React components for Bootstrap 4. We also make use of the Availity reactstrap Validation (https://availity.github.io/availity-reactstrap-validation/) library, which provides form validation support for Reactstrap form elements.

Let's take a look at src/main/webapp/app/modules/login/login-modal.tsx, for example:

<Modal isOpen={this.props.showModal} toggle={handleClose} backdrop="static" id="login-page">  <AvForm onSubmit={this.handleSubmit}> <ModalHeader toggle={handleClose} ...