diff --git a/src/app/db/data.ts b/src/app/db/data.ts
index 03fcfe1..4d5cf98 100644
--- a/src/app/db/data.ts
+++ b/src/app/db/data.ts
@@ -5,9 +5,9 @@ documents {
         manifest: {
             title: string
             authors: string[]
-            date: unix epoch integer[]
+            date: unix epoch integer[] -> if multiple revisions, put the earlier dates first
             type: presentation | report | white paper | other
-            latest: integer >= 1
+            latest: integer >= 1 -> the latest revision of the document (earliest = 1)
             keywords: string[]
             topics: string[]
             references: string[],
diff --git a/src/app/document/view/[slug]/page.tsx b/src/app/document/view/[slug]/page.tsx
index b3b502f..792d701 100644
--- a/src/app/document/view/[slug]/page.tsx
+++ b/src/app/document/view/[slug]/page.tsx
@@ -4,27 +4,14 @@ import {
   documents,
   topics as topicList,
   authors as authorList,
-} from '../../../db/data'
+} from '@/app/db/data'
 import Link from 'next/link'
 import { notFound } from 'next/navigation'
 import { Fragment } from 'react'
+import { epoch2datestring } from '@/app/utils/epoch2datestring'
 
 const zillaSlab = Zilla_Slab({ subsets: ['latin'], weight: ['500'] })
 
-function epoch2datestring(epoch: number): string {
-  // Create a new Date object from the epoch
-  const date = new Date(epoch * 1000)
-
-  // Format the date to the specified format
-  const formattedDate = date.toLocaleDateString('en-US', {
-    month: 'short', // abbreviated month name
-    day: '2-digit', // day as two digits
-    year: 'numeric', // four digit year
-  })
-
-  return formattedDate
-}
-
 export default function Page({
   params,
 }: Readonly<{ params: { slug: string } }>) {
diff --git a/src/app/page.tsx b/src/app/page.tsx
index 95359ef..8248f1c 100644
--- a/src/app/page.tsx
+++ b/src/app/page.tsx
@@ -1,9 +1,96 @@
-import styles from './home.module.css'
+import Link from 'next/link'
+import {
+  documents,
+  authors,
+  topics as topicsList,
+  affiliations,
+} from './db/data'
+import { epoch2datestring } from './utils/epoch2datestring'
+import { Fragment } from 'react'
 
 export default function Home() {
+  const RandomDocs = (): React.ReactNode[] => {
+    // Convert the object keys into an array
+    const keys = Object.keys(documents)
+
+    // Determine the number of keys to process (all if fewer than 10)
+    const numKeysToProcess = keys.length < 10 ? keys.length : 10
+
+    // Shuffle the keys array if there are more than 10 keys
+    if (keys.length > 10) {
+      for (let i = keys.length - 1; i > 0; i--) {
+        const j = Math.floor(Math.random() * (i + 1))
+        ;[keys[i], keys[j]] = [keys[j], keys[i]]
+      }
+    }
+
+    // Select keys based on numKeysToProcess
+    const selectedKeys = keys.slice(0, numKeysToProcess)
+
+    // Iterate over each of the selected keys
+    return selectedKeys.map((key, index) => {
+      const { title, dates, type, topics } = documents[key].manifest
+      let dateString = epoch2datestring(dates[dates.length - 1])
+      let typeString = ''
+      switch (type) {
+        case 'report':
+          typeString = 'report'
+          break
+        case 'presentation':
+          typeString = 'presentation'
+          break
+        case 'white paper':
+          typeString = 'white paper'
+          break
+        case 'datasheet':
+          typeString = 'datasheet'
+          break
+        case 'dwm':
+          typeString = 'DWM'
+          break
+        case 'other':
+          typeString = 'document'
+          break
+      }
+
+      const randomFromArray = (arr: string[]): string =>
+        arr[Math.floor(Math.random() * arr.length)]
+
+      return (
+        <div key={index}>
+          <Link href={`/document/view/${key}`}>{title}</Link>, a {typeString}{' '}
+          about {topicsList[randomFromArray(topics)]['name']} published on{' '}
+          {dateString}
+          .
+          <br />
+        </div>
+      )
+    })
+  }
+
+  const AuthorDisplay = () => {
+    return Object.entries(authors).map(([author, data], index) => {
+      let affiliationSlug = data.affiliation[0].split('@')[1]
+      let affiliation = affiliations[affiliationSlug]
+      return (
+        <div key={index}>
+          <Link href={`/author/${author}`}>
+            {data.name.first}
+            {data.name.nickname ? ` "${data.name.nickname}" ` : ' '}
+            {data.name.last}
+          </Link>{' '}
+          of{' '}
+          <Link href={`/affiliation/${affiliationSlug}`}>
+            {affiliation.short}
+          </Link>
+        </div>
+      )
+    })
+  }
+
   return (
-    <div className='content text-slate-800'>
-      <p className={styles.message}>
+    <div className='content text-slate-800 flex flex-wrap'>
+      <p className='font-serif text-lg max-w-lg'>
         eeXiv<sup>2</sup> is a free distribution service and an open-access
         archive for nearly 2.4 million scholarly articles in the fields of
         physics, mathematics, computer science, quantitative biology,
@@ -11,6 +98,31 @@ export default function Home() {
         science, and economics. Materials on this site may be published
         independently through other channels.
       </p>
+      <div className='bg-slate-800 rounded-lg p-6 w-full lg:max-w-lg md:max-w-md my-4 lg:my-0'>
+        <span className='text-3xl md:text-4xl text-slate-200'>eeXiv News</span>
+        <br className='my-2' />
+        <span className='text-xl text-slate-400'>
+          Stay up to date with what is happening at eeXiv.
+        </span>
+        <br className='my-2' />
+        <span className='text-lg text-slate-200'>Latest news</span>
+        <br className='my-4' />
+        <div className='text-slate-50'>
+          - eeXiv is currently under active development!
+        </div>
+      </div>
+      <div className='grid grid-cols-1 space-y-2 mt-4'>
+        <hr className='mx-auto w-full h-1 border-0 bg-slate-200 my-2 rounded-md' />
+        <span className='font-serif text-xl'>
+          Selected documents in various disciplines
+        </span>
+        <RandomDocs />
+        <hr className='mx-auto w-full h-1 border-0 bg-slate-200 my-2 rounded-md' />
+        <span className='font-serif text-xl'>
+          Our esteemed faculty and alumni
+        </span>
+        <AuthorDisplay />
+      </div>
     </div>
   )
 }
diff --git a/src/app/utils/epoch2datestring.ts b/src/app/utils/epoch2datestring.ts
new file mode 100644
index 0000000..f595cff
--- /dev/null
+++ b/src/app/utils/epoch2datestring.ts
@@ -0,0 +1,13 @@
+export function epoch2datestring(epoch: number): string {
+  // Create a new Date object from the epoch
+  const date = new Date(epoch * 1000)
+
+  // Format the date to the specified format
+  const formattedDate = date.toLocaleDateString('en-US', {
+    month: 'short', // abbreviated month name
+    day: '2-digit', // day as two digits
+    year: 'numeric', // four digit year
+  })
+
+  return formattedDate
+}