Image is not Loading

Question

I want to load a local image form the "assets" folder which is outside the source folder.

 

I have created a react app using create-react-app command.

  

I m having issues in loading the images.

 

i m not getting any error also but still the image is not loading

 

here is my code

import React from 'react';
import ReactDOM from 'react-dom';
class MyForm extends React.Component {
render() {
return (
<div class="wrapper wrapper-login">
<div class="container container-login animated fadeIn">
<img src="./public/assets/img/logo.jpg" class="logo" alt="Logo" />
<form action="login" method="post">
<h3 class="text-center">Sign In</h3>
<div class="login-form">
<div class="form-group">
<label class="placeholder">Email</label>
<input type="text" class="form-control"></input>
</div>
<div class="form-group">
<label class="placeholder">Password</label>
<input type="password" class="form-control"></input>
</div>
<div class="form-group form-action-d-flex mb-3">
<input type="submit" value="Log In" class="btn btn-primary col-md-5 float-right mt-3 mt-sm-0 fw-bold"/>
</div>
<div class="login-account">
<span class="msg">Don't have an account yet ?</span>
<a href="SignUp" id="show-signup" class="link">Sign Up</a>
</div>
</div>
</form>
</div>
</div>
);
}
}

ReactDOM.render(<MyForm />, document.getElementById('root'));