From 055d3f1cd15e5cfc8f6ac380551d7eac82b9eafd Mon Sep 17 00:00:00 2001
From: Jordan Eldredge <jordan@jordaneldredge.com>
Date: Tue, 19 Mar 2024 21:00:32 -0700
Subject: [PATCH] Small documentation messaging improvements

---
 website/docs/01-getting-started/index.mdx       |  4 ++--
 .../src/components/HomepageFeatures/index.tsx   | 17 ++++++++++++++---
 website/src/pages/index.tsx                     |  2 +-
 3 files changed, 17 insertions(+), 6 deletions(-)

diff --git a/website/docs/01-getting-started/index.mdx b/website/docs/01-getting-started/index.mdx
index 97db42f5..5a050d62 100644
--- a/website/docs/01-getting-started/index.mdx
+++ b/website/docs/01-getting-started/index.mdx
@@ -3,9 +3,9 @@
 import Tabs from "@theme/Tabs";
 import TabItem from "@theme/TabItem";
 
-**What if building a GraphQL server were as simple as just writing functions?**
+**What if buildng a GraphQL server were as simple as adding annotations to your TypeScript code?**
 
-When you write your GraphQL server in TypeScript, your fields and resolvers are _already_ annotated with type information. _Grats leverages your existing type annotations to automatically extract an executable GraphQL schema from your generic TypeScript resolver code._
+When you write your GraphQL server in TypeScript, your fields and resolvers are _already_ annotated with type information. _Grats leverages your existing type annotations to extract an executable GraphQL schema from your generic TypeScript resolver code._
 
 By making your TypeScript implementation and its types the source of truth, you never have to worry about validating that your implementation matches your schema. Your implementation _is_ your schema!
 
diff --git a/website/src/components/HomepageFeatures/index.tsx b/website/src/components/HomepageFeatures/index.tsx
index 693e39f6..709a24c9 100644
--- a/website/src/components/HomepageFeatures/index.tsx
+++ b/website/src/components/HomepageFeatures/index.tsx
@@ -5,6 +5,7 @@ import HomepageExample from "!!raw-loader!./snippets/homepageExample.out";
 import HomepageExampleFP from "!!raw-loader!./snippets/homepageExampleFP.out";
 import Tabs from "@theme/Tabs";
 import TabItem from "@theme/TabItem";
+import Link from "@docusaurus/Link";
 
 export default function HomepageFeatures(): JSX.Element {
   return (
@@ -13,8 +14,7 @@ export default function HomepageFeatures(): JSX.Element {
         <div className="row">
           <div className="col col--8 col--offset-2">
             <h2 className="text--center margin-bottom--xl">
-              What if building a GraphQL server were as simple as just writing
-              functions?
+              The simplest way to build a GraphQL server in TypeScript
             </h2>
           </div>
         </div>
@@ -42,7 +42,6 @@ export default function HomepageFeatures(): JSX.Element {
               docblock hints. No Grats code is needed at runtime.
             </p>
           </div>
-
           <div className="col col--8 margin-top--xl margin-bottom--xl col--offset-2">
             <Tabs>
               <TabItem value="oop" label="Object Oriented">
@@ -54,6 +53,18 @@ export default function HomepageFeatures(): JSX.Element {
             </Tabs>
           </div>
         </div>
+        <div className="row">
+          <div className="col col--10 text--right margin-bottom--xl">
+            <div className={styles.buttons}>
+              <Link
+                className="button button--primary button--lg"
+                href="https://jordaneldredge.com/blog/grats/"
+              >
+                Read the Blog Post ➔
+              </Link>
+            </div>
+          </div>
+        </div>
       </div>
     </section>
   );
diff --git a/website/src/pages/index.tsx b/website/src/pages/index.tsx
index d1142098..649b7549 100644
--- a/website/src/pages/index.tsx
+++ b/website/src/pages/index.tsx
@@ -21,7 +21,7 @@ function HomepageHeader() {
               className="button button--secondary button--lg"
               to="/docs/getting-started/quick-start"
             >
-              Quickstart
+              Quick Start
             </Link>
           </div>
           <div className={styles.buttons}>