Skip to content

Instantly share code, notes, and snippets.

@ridoansaleh

ridoansaleh/index.html

Last active November 15, 2017 15:41
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save ridoansaleh/70174786502d10a43620e50dbd823106 to your computer and use it in GitHub Desktop.
Save ridoansaleh/70174786502d10a43620e50dbd823106 to your computer and use it in GitHub Desktop.
Download ZIP
Raw
index.html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8"/>
<title>Belajar React</title>
<link rel="stylesheet" type="text/css" href="styles.css">
<script src="https://unpkg.com/react@16/umd/react.development.js"></script>
<script src="https://unpkg.com/react-dom@16/umd/react-dom.development.js"></script>
<script src="https://unpkg.com/babel-standalone@6.15.0/babel.min.js"></script>
</head>
<body>
<div id="root"></div>
<script type="text/babel">
function Form() {
return(
<div>
<h2>Login Form</h2>
<form>
<div className="imgcontainer">
<img src="avatar.png" alt="Avatar" className="avatar"/>
</div>
<div className="container">
<label><b>Username</b></label>
<input type="text" placeholder="Enter Username" name="uname" required/>
<label><b>Password</b></label>
<input type="password" placeholder="Enter Password" name="psw" required/>
<button type="submit">Login</button>
<input type="checkbox" defaultChecked/> Remember me
</div>
<div className="container" style={{backgroundColor: '#f1f1f1'}}>
<button type="button" className="cancelbtn">Cancel</button>
<span className="psw">Forgot <a href="#">password?</a></span>
</div>
</form>
</div>
);
}
ReactDOM.render(
<Form/>,
document.getElementById('root')
);
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment