Skip to content

Instantly share code, notes, and snippets.

@herber
Last active March 7, 2017 18:56
Show Gist options
  • Save herber/525fd51113762238a3a01aaee4e839f7 to your computer and use it in GitHub Desktop.
Save herber/525fd51113762238a3a01aaee4e839f7 to your computer and use it in GitHub Desktop.
Change url without reloading the site.
const express = require('express');
const app = express();
app.get('*', function(req, res){
res.sendFile(__dirname + '/index.html');
});
app.listen(3000);
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Change url</title>
<style>
body {
text-align: center;
margin: 0px;
padding: 0px;
top: 0px;
left: 0px;
font-family: monospace;
font-size: 1.2em;
}
input {
background: white;
border: solid black 2px;
padding: 7px 20px;
outline: none;
}
</style>
</head>
<body>
<h1>Change url</h1>
<input type="text" placeholder="url">
<script>
var input = document.querySelector('input');
input.addEventListener('input', function() {
history.pushState('', 'Title', '/' + input.value);
});
</script>
</body>
</html>
{
"name": "url",
"version": "1.0.0",
"main": "app.js",
"scripts": {
"start": "node app.js"
},
"dependencies": {
"express": "^4.15.2"
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment