diff --git a/examples/blog-starter/components/date.js b/examples/blog-starter/components/date-formater.js
similarity index 74%
rename from examples/blog-starter/components/date.js
rename to examples/blog-starter/components/date-formater.js
index eac5681378bfd..b346c94cab03f 100644
--- a/examples/blog-starter/components/date.js
+++ b/examples/blog-starter/components/date-formater.js
@@ -1,6 +1,6 @@
 import { parseISO, format } from 'date-fns'
 
-export default function Date({ dateString }) {
+export default function DateFormater({ dateString }) {
   const date = parseISO(dateString)
   return <time dateTime={dateString}>{format(date, 'LLLL	d, yyyy')}</time>
 }
diff --git a/examples/blog-starter/components/hero-post.js b/examples/blog-starter/components/hero-post.js
index 1ef6a35763cf5..68f7cb984ad03 100644
--- a/examples/blog-starter/components/hero-post.js
+++ b/examples/blog-starter/components/hero-post.js
@@ -1,5 +1,5 @@
 import Avatar from '../components/avatar'
-import Date from '../components/date'
+import DateFormater from '../components/date-formater'
 import CoverImage from '../components/cover-image'
 import Link from 'next/link'
 
@@ -24,7 +24,7 @@ export default function HeroPost({
             </Link>
           </h3>
           <div className="mb-4 md:mb-0 text-lg">
-            <Date dateString={date} />
+            <DateFormater dateString={date} />
           </div>
         </div>
         <div>
diff --git a/examples/blog-starter/components/post-header.js b/examples/blog-starter/components/post-header.js
index fe9cd62aa7e3c..4a832420cbd27 100644
--- a/examples/blog-starter/components/post-header.js
+++ b/examples/blog-starter/components/post-header.js
@@ -1,5 +1,5 @@
 import Avatar from '../components/avatar'
-import Date from '../components/date'
+import DateFormater from '../components/date-formater'
 import CoverImage from '../components/cover-image'
 import PostTitle from '../components/post-title'
 
@@ -18,7 +18,7 @@ export default function PostHeader({ title, coverImage, date, author }) {
           <Avatar name={author.name} picture={author.picture} />
         </div>
         <div className="mb-6 text-lg">
-          <Date dateString={date} />
+          <DateFormater dateString={date} />
         </div>
       </div>
     </>
diff --git a/examples/blog-starter/components/post-preview.js b/examples/blog-starter/components/post-preview.js
index bf1aa0746721c..ac8c8b98a5628 100644
--- a/examples/blog-starter/components/post-preview.js
+++ b/examples/blog-starter/components/post-preview.js
@@ -1,5 +1,5 @@
 import Avatar from '../components/avatar'
-import Date from '../components/date'
+import DateFormater from '../components/date-formater'
 import CoverImage from './cover-image'
 import Link from 'next/link'
 
@@ -22,7 +22,7 @@ export default function PostPreview({
         </Link>
       </h3>
       <div className="text-lg mb-4">
-        <Date dateString={date} />
+        <DateFormater dateString={date} />
       </div>
       <p className="text-lg leading-relaxed mb-4">{excerpt}</p>
       <Avatar name={author.name} picture={author.picture} />