diff --git a/src/components/Nav.svelte b/src/components/Nav.svelte
index 0c33026..30619af 100644
--- a/src/components/Nav.svelte
+++ b/src/components/Nav.svelte
@@ -3,6 +3,13 @@
     const { session } = stores();
 
     let query = '';
+	
+	async function findRandomArticle()
+	{
+		var res = await fetch('/a/random');
+		var randArticle = await res.json();
+		goto(`/a/${randArticle.slug}`);
+	}
 </script>
 
 <style>
@@ -108,6 +115,7 @@
         </div>
         {#if !$session.user}
             <div class="link"><a href="/contact">Contact Us</a></div>
+            <div class="link"><a href="#" on:click={findRandomArticle}>Random</a></div>
         {:else}
             <div class="link"><a href="/cms">Dashboard</a></div>
             <div class="link"><a href="/cms/logout">Logout</a></div>
diff --git a/src/legacy/router.js b/src/legacy/router.js
index 2402543..0cbc3b7 100644
--- a/src/legacy/router.js
+++ b/src/legacy/router.js
@@ -1,8 +1,19 @@
 import express from 'express';
+import Article from '../models/article.js';
+
 const app = express.Router();
 
-app.get('*', function (req, res) {
-	res.render('index');
+app.get('/', async function (req, res) {
+	let page = Number.isInteger(req.query.page) && req.query.page > 0 ? req.query.page : 1;
+	let offset = (page - 1) * 4;
+	let articles = await Article.find().sort('-created_at').limit(4).skip(offset);
+	res.render('index', { articles, offset });
 });
-	
+
+app.use(function (req, res) {
+	// if you actually send HTTP 404, IE will render its own 404 page,
+	// so don't do that.
+	res.render('404');
+});
+
 export default app;
diff --git a/src/legacy/views/404.ejs b/src/legacy/views/404.ejs
new file mode 100644
index 0000000..e025a89
--- /dev/null
+++ b/src/legacy/views/404.ejs
@@ -0,0 +1,10 @@
+<!DOCTYPE HTML>
+<html>
+	<head>
+		<title>HOWFEED.biz</title>
+	</head>
+	<body>
+		<h1>Error 404</h1>
+		<p>Looks like you're barking up the wrong tree!</p>
+	</body>
+</html>
diff --git a/src/legacy/views/footer.ejs b/src/legacy/views/footer.ejs
new file mode 100644
index 0000000..98f4f25
--- /dev/null
+++ b/src/legacy/views/footer.ejs
@@ -0,0 +1,10 @@
+			<tr bgcolor="black" height="1"><td colspan="6"></td></tr>
+			<tr height="18">
+				<td colspan="6">
+					<p style="font-size: 14px; font-family: Tahoma; line-height: 18px; text-align: center; margin: 0;">Copyright &copy; <%= new Date().getFullYear() %> FemboyFinancial Holdings Co., Ltd. (USA LLC). All rights reserved.</p>
+				</td>
+			</tr>
+		</tbody>
+		</table>
+	</body>
+</html>
diff --git a/src/legacy/views/header.ejs b/src/legacy/views/header.ejs
new file mode 100644
index 0000000..28079dc
--- /dev/null
+++ b/src/legacy/views/header.ejs
@@ -0,0 +1,47 @@
+<!DOCTYPE HTML>
+<html>
+	<head>
+		<title>HOWFEED.biz - Optimized for Internet Explorer</title>
+		<script language="JavaScript">
+		<!--
+			function hidePlaceholder(txt) {
+				if (txt.value === "Search") {
+					txt.value = "";
+				}
+			}
+			function showPlaceholder(txt) {
+				if (txt.value === "") {
+					txt.value = "Search";
+				}
+			}
+		-->
+		</script>
+		<style type="text/css">
+		<!--
+			body {
+				width: 640px;
+				margin: 0;
+				font-family: sans-serif;
+				font-size: 24px;
+			}
+			a {
+				text-decoration: none;
+				color: #000;
+				font-weight: bold;
+			}
+		-->
+		</style>
+	</head>
+	<body style="width: 640px;">
+		<table width="640" cellspacing="0" cellpadding="0" border="0">
+		<tbody>
+			<tr align="center" height="36">
+				<td colspan="2"><img src="/logo.png" height="26" width="150"></td>
+				<td colspan="2">
+				<form method="GET" action="/search" style="display: inline;">
+					<input style="border: 4px solid #000;font-family: Tahoma;" type="text" name="query" value="Search" onclick="hidePlaceholder(this);" onblur="showPlaceholder(this);">
+				</form>
+				</td>
+				<td colspan="2"><a href="/contact">CONTACT US</a></td>
+			</tr>
+			<tr bgcolor="black" height="1"><td colspan="6"></td></tr>
\ No newline at end of file
diff --git a/src/legacy/views/index.ejs b/src/legacy/views/index.ejs
index 06148fc..58507c5 100644
--- a/src/legacy/views/index.ejs
+++ b/src/legacy/views/index.ejs
@@ -1,9 +1,14 @@
-<!DOCTYPE HTML>
-<html>
-	<head>
-		<title>HOWFEED.biz</title>
-	</head>
-	<body>
-		<h1>Hello world</h1>
-	</body>
-</html>
+<%- include('header') -%>
+<tr height="64" style="background: url('/background.png');" align="center">
+	<td colspan="6"><h1 style="line-height: 64px;font-size: 48px; margin:0;">WELCOME</h1></td>
+</tr>
+<% for (var article of articles) { %>
+<tr height="85" bgcolor="#96C8EA" style="overflow: scroll">
+	<td></td>
+	<td bgcolor="white" align="center">
+		<img src="http://howfeed.biz/a/<%= article.image %>" height="75" alt="<%= article.title %>">
+	</td>
+	<td colspan="4"><%= article.title %></td>
+</tr>
+<% } %>
+<%- include('footer') -%>
diff --git a/src/server.js b/src/server.js
index d94042c..85c92fa 100644
--- a/src/server.js
+++ b/src/server.js
@@ -320,6 +320,17 @@ mainRouter
             }
         }
     )
+	.get('/a/random',
+		async function(req, res, next) {
+			var articleCount = await Article.countDocuments();
+			var random = Math.floor(Math.random() * articleCount);
+			var randomArticle = await Article.findOne().skip(random).select('slug');
+			res.writeHead(200, {
+				'Content-Type': 'application/json'
+			});
+			res.end(JSON.stringify(randomArticle));
+		}
+	)
     .post('/me/avatar',
         async function(req, res, next) {
             if (!req.user) {
