Show Mobile component ReactJS - reactjs

Question

import React, { Component } from 'react';
class BigText extends Component {
render() {
return (
<div>
<div>
<h1 className="row px-2">Big Text Notification</h1>
<hr />
<div className="row px-1 py-2 animated fadeIn">
<div className="px-1" style={{ width:50 + '%' }}><br />
<div className="mb-1">
<input type="text"
className="form-control"
placeholder="Title"
name="title"
/>
</div>
<div className="mb-1">
<textarea
className="form-control"
placeholder="Text"
name="text"
/>
</div>
<div className="mb-1">
<textarea
className="form-control"
placeholder="Summary"
name="summary"
/>
</div>
<br />
<div className="row px-2" >
<div>
<button className="nav-link btn btn-block btn-info" onClick={this.handleClick} >Save</button>
</div>
<div className="px-1">
<button className="nav-link btn btn-block btn-danger"> Cancel</button>
</div>
</div><br />
</div>
</div>
</div>
</div>
)
}
}
export default BigText;
i had added the code snippet
What I'm doing is I'm trying to add a Mobile frame as component on side of the fields so that whatever i write in the fields will be shown in that mobile being shown as the component on the screen
so i wanted to know how to add that mobile and how to show text in it as well