diff --git a/packages/typescriptlang-org/src/copy/en.ts b/packages/typescriptlang-org/src/copy/en.ts
index 5437886dbfad..a3cc55664a82 100644
--- a/packages/typescriptlang-org/src/copy/en.ts
+++ b/packages/typescriptlang-org/src/copy/en.ts
@@ -4,6 +4,7 @@ import { headCopy } from "./en/head-seo"
 import { docCopy } from "./en/documentation"
 import { indexCopy } from "./en/index"
 import { playCopy } from "./en/playground"
+import { comCopy } from "./en/community"
 
 export const messages = {
   ...navCopy,
@@ -11,6 +12,7 @@ export const messages = {
   ...headCopy,
   ...indexCopy,
   ...playCopy,
+  ...comCopy,
 }
 
 export const lang = defineMessages(messages)
diff --git a/packages/typescriptlang-org/src/copy/en/community.ts b/packages/typescriptlang-org/src/copy/en/community.ts
new file mode 100644
index 000000000000..bf78b2555334
--- /dev/null
+++ b/packages/typescriptlang-org/src/copy/en/community.ts
@@ -0,0 +1,30 @@
+export const comCopy = {
+  com_layout_title: "How to set up TypeScript",
+  com_layout_description: "",
+  com_headline: "Connect with us",
+  com_connect_online: "Connect online",
+  com_connect_online_description:
+    " Tell us what’s working well, what you want to see added or improved, and find out about new updates.",
+  com_online_stack_overflow_desc:
+    "Engage with your peers and ask questions about Typescript on",
+  com_online_stack_overflow_tag: "using the tag",
+  com_online_discord_header: "Chat",
+  com_online_discord_desc:
+    "Chat with other TypeScript users in the TypeScript Community Chat.",
+  com_online_github_desc: "Found a bug, or want to give us feedback?",
+  com_online_github_href: "Tell us on github",
+  com_online_twitter_desc: "Stay up to date. Follow us on Twitter",
+  com_online_blog_desc:
+    "Learn about the latest TypeScript developments via our",
+  com_online_typed_desc: "TypeScript definition files",
+  com_online_typed_href: "Browse the thousands of",
+  com_online_typed_available_for:
+    "available for common libraries and frameworks.",
+  com_person: "Connect in person",
+  com_conferences: "Conferences",
+  com_conferences_alt_img: "logo of ",
+  nav_: {
+    id: "foo",
+    defaultMessage: "foo",
+  },
+}
diff --git a/packages/typescriptlang-org/src/copy/es.ts b/packages/typescriptlang-org/src/copy/es.ts
index 27a32f00010d..aad376686f4f 100644
--- a/packages/typescriptlang-org/src/copy/es.ts
+++ b/packages/typescriptlang-org/src/copy/es.ts
@@ -5,6 +5,7 @@ import { headCopy } from "./es/head-seo"
 import { docCopy } from "./en/documentation"
 import { indexCopy } from "./en/index"
 import { playCopy } from "./es/playground"
+import { comCopy } from "./en/community"
 
 export const lang: Copy = defineMessages({
   ...englishMessages,
@@ -13,4 +14,5 @@ export const lang: Copy = defineMessages({
   ...headCopy,
   ...indexCopy,
   ...playCopy,
+  ...comCopy,
 })
diff --git a/packages/typescriptlang-org/src/copy/ja.ts b/packages/typescriptlang-org/src/copy/ja.ts
index fa4312d7f8d7..be5fab956df0 100644
--- a/packages/typescriptlang-org/src/copy/ja.ts
+++ b/packages/typescriptlang-org/src/copy/ja.ts
@@ -1,8 +1,10 @@
 import { defineMessages } from "react-intl"
 import { playCopy } from "./ja/playground"
 import { Copy, messages as englishMessages } from "./en"
+import { comCopy } from "./en/community"
 
 export const lang: Copy = defineMessages({
   ...englishMessages,
   ...playCopy,
+  ...comCopy,
 })
diff --git a/packages/typescriptlang-org/src/copy/vo.ts b/packages/typescriptlang-org/src/copy/vo.ts
index 8aa032031468..5c9da9294611 100644
--- a/packages/typescriptlang-org/src/copy/vo.ts
+++ b/packages/typescriptlang-org/src/copy/vo.ts
@@ -1,8 +1,10 @@
 import { defineMessages } from "react-intl"
 import { navCopy } from "./vo/nav"
 import { Copy, messages as englishMessages } from "./en"
+import { comCopy } from "./en/community"
 
 export const lang: Copy = defineMessages({
   ...navCopy,
   ...englishMessages,
+  ...comCopy,
 })
diff --git a/packages/typescriptlang-org/src/copy/zh.ts b/packages/typescriptlang-org/src/copy/zh.ts
index ec77fd7e18cb..b9861a1a4fa6 100644
--- a/packages/typescriptlang-org/src/copy/zh.ts
+++ b/packages/typescriptlang-org/src/copy/zh.ts
@@ -5,6 +5,7 @@ import { navCopy } from "./zh/nav"
 import { headCopy } from "./zh/head-seo"
 import { docCopy } from "./zh/documentation"
 import { indexCopy } from "./zh/index"
+import { comCopy } from "./en/community"
 
 export const messages = {
   ...chineseMessages,
@@ -13,6 +14,7 @@ export const messages = {
   ...headCopy,
   ...indexCopy,
   ...playCopy,
+  ...comCopy,
 }
 
 export const lang = defineMessages(messages)
diff --git a/packages/typescriptlang-org/src/templates/pages/community.tsx b/packages/typescriptlang-org/src/templates/pages/community.tsx
index 71a15171d296..72f03dc525fd 100644
--- a/packages/typescriptlang-org/src/templates/pages/community.tsx
+++ b/packages/typescriptlang-org/src/templates/pages/community.tsx
@@ -3,114 +3,226 @@ import { Layout } from "../../components/layout"
 import { Intl } from "../../components/Intl"
 import { graphql } from "gatsby"
 import { CommunityPageQuery } from "../../__generated__/gatsby-types"
-import { indexCopy } from "../../copy/en/index"
 import { createInternational } from "../../lib/createInternational"
 import { useIntl } from "react-intl"
 
-
 import meetups from "../../../../community-meta/generated/meetups.json"
 
 import "./css/community.scss"
+import { comCopy } from "../../copy/en/community"
 
-const conferences =
-  [
-    {
-      "title": "TSConf",
-      "location": "Seattle, WA",
-      "url": "https://tsconf.io",
-      "date": "October 11th, 2019",
-      "image": require("../../assets/community/conferences/tsconf-2019-logo.png")
-    },
-    {
-      "title": "TSConf IT",
-      "location": "Desenzano del Garda",
-      "url": "https://ts-conf.it/",
-      "date": "October 25th, 2019",
-      "country": "🇮🇹",
-      "image": require("../../assets/community/conferences/tsconf-it-2019-logo.png")
-    },
-    {
-      "title": "TSConf JP",
-      "location": "Tokyo",
-      "url": "https://tsconf.jp",
-      "date": "February 22nd, 2020",
-      "country": "🇯🇵",
-      "image": require("../../assets/community/conferences/tsconf-jp-logo.png")
-    },
-    {
-      "title": "TSConf:EU",
-      "location": "Linz",
-      "url": "https://tsconf.eu",
-      "date": "March 31st, 2020",
-      "country": "🇦🇹",
-      "image": require("../../assets/community/conferences/tsconf-eu-2020-logo.png")
-    }
-  ]
+const conferences = [
+  {
+    title: "TSConf",
+    location: "Seattle, WA",
+    url: "https://tsconf.io",
+    date: "October 11th, 2019",
+    image: require("../../assets/community/conferences/tsconf-2019-logo.png"),
+  },
+  {
+    title: "TSConf IT",
+    location: "Desenzano del Garda",
+    url: "https://ts-conf.it/",
+    date: "October 25th, 2019",
+    country: "🇮🇹",
+    image: require("../../assets/community/conferences/tsconf-it-2019-logo.png"),
+  },
+  {
+    title: "TSConf JP",
+    location: "Tokyo",
+    url: "https://tsconf.jp",
+    date: "February 22nd, 2020",
+    country: "🇯🇵",
+    image: require("../../assets/community/conferences/tsconf-jp-logo.png"),
+  },
+  {
+    title: "TSConf:EU",
+    location: "Linz",
+    url: "https://tsconf.eu",
+    date: "March 31st, 2020",
+    country: "🇦🇹",
+    image: require("../../assets/community/conferences/tsconf-eu-2020-logo.png"),
+  },
+]
 
 type Props = {
   data: CommunityPageQuery
   pageContext: any
 }
 
-export const Comm: React.FC<Props> = (props) => {
+export const Comm: React.FC<Props> = props => {
   const intl = useIntl()
-  const i = createInternational<typeof indexCopy>(intl)
+  const i = createInternational<typeof comCopy>(intl)
 
   return (
-    <Layout title="How to set up TypeScript" description="" lang={props.pageContext.lang} allSitePage={props.data.allSitePage}>
+    <Layout
+      title={i("com_layout_title")}
+      description={i("com_layout_description")}
+      lang={props.pageContext.lang}
+      allSitePage={props.data.allSitePage}
+    >
       <div className="raised main-content-block container community">
-        <h1>Connect with us</h1>
-        <h2>Connect online</h2>
-        <p className="banner-text">Tell us what’s working well, what you want to see added or improved, and find out about new updates.</p>
+        <h1>{i("com_headline")}</h1>
+        <h2>{i("com_connect_online")}</h2>
+        <p className="banner-text">{i("com_connect_online_description")}</p>
 
         <div className="row callouts">
           <div className="callout" style={{ flex: 1 }}>
-            <a aria-labelledby="stack-header" className="icon stackoverflow img-circle" href="{{ site.data.urls.ts_stackoverflow_tagged }}" target="_blank"></a>
-            <a href="{{ site.data.urls.ts_stackoverflow_tagged }}" id="stack-header" target="_blank"><h3 className="community-callout-headline">Stack Overflow</h3></a>
-            <div className="text">Engage with your peers and ask questions about Typescript on <a href="{{ site.data.urls.ts_stackoverflow_tagged }}" target="_blank">Stack Overflow</a> using the tag <b>typescript.</b></div>
+            <a
+              aria-labelledby="stack-header"
+              className="icon stackoverflow img-circle"
+              href="{{ site.data.urls.ts_stackoverflow_tagged }}"
+              target="_blank"
+            ></a>
+            <a
+              href="{{ site.data.urls.ts_stackoverflow_tagged }}"
+              id="stack-header"
+              target="_blank"
+            >
+              <h3 className="community-callout-headline">Stack Overflow</h3>
+            </a>
+            <div className="text">
+              {i("com_online_stack_overflow_desc")}{" "}
+              <a
+                href="{{ site.data.urls.ts_stackoverflow_tagged }}"
+                target="_blank"
+              >
+                Stack Overflow
+              </a>{" "}
+              {i("com_online_stack_overflow_tag")} <b>typescript.</b>
+            </div>
           </div>
           <div className="callout col-md-4" style={{ flex: 1 }}>
-            <a aria-labelledby="discord-header" className="icon discord img-circle" href="https://discord.gg/typescript"></a>
-            <a href="https://discord.gg/typescript" id="discord-header"><h3 className="community-callout-headline">Chat</h3></a>
-            <div className="text">Chat with other TypeScript users in the TypeScript Community Chat.</div>
+            <a
+              aria-labelledby="discord-header"
+              className="icon discord img-circle"
+              href="https://discord.gg/typescript"
+            ></a>
+            <a href="https://discord.gg/typescript" id="discord-header">
+              <h3 className="community-callout-headline">
+                {i("com_online_discord_header")}
+              </h3>
+            </a>
+            <div className="text">{i("com_online_discord_desc")}</div>
           </div>
           <div className="callout col-md-4" style={{ flex: 1 }}>
-            <a aria-labelledby="github-header" className="icon bug img-circle" href="{{ site.data.urls.ts_github_issues }}" target="_blank"></a>
-            <a href="{{ site.data.urls.ts_github_issues }}" id="github-header"> <h3 className="community-callout-headline">GitHub</h3></a>
-            <div className="text">Found a bug, or want to give us feedback? <a href="{{ site.data.urls.ts_github_issues }}">Tell us on GitHub</a>.</div>
+            <a
+              aria-labelledby="github-header"
+              className="icon bug img-circle"
+              href="{{ site.data.urls.ts_github_issues }}"
+              target="_blank"
+            ></a>
+            <a href="{{ site.data.urls.ts_github_issues }}" id="github-header">
+              {" "}
+              <h3 className="community-callout-headline">GitHub</h3>
+            </a>
+            <div className="text">
+              {i("com_online_github_desc")}{" "}
+              <a href="{{ site.data.urls.ts_github_issues }}">
+                {i("com_online_github_href")}
+              </a>
+              .
+            </div>
           </div>
         </div>
         <div className="row callouts">
           <div className="callout col-md-4">
-            <a aria-labelledby="twitter-header" className="icon twitter img-circle" href="{{ site.data.urls.ts_twitter }}" target="_blank"></a>
-            <a href="{{ site.data.urls.ts_twitter }}" id="twitter-header" target="_blank"><h3 className="community-callout-headline">Twitter</h3></a>
-            <div className="text">Stay up to date.  Follow us on Twitter <a href="{{ site.data.urls.ts_twitter }}" target="_blank">@typescript</a>!</div>
+            <a
+              aria-labelledby="twitter-header"
+              className="icon twitter img-circle"
+              href="{{ site.data.urls.ts_twitter }}"
+              target="_blank"
+            ></a>
+            <a
+              href="{{ site.data.urls.ts_twitter }}"
+              id="twitter-header"
+              target="_blank"
+            >
+              <h3 className="community-callout-headline">Twitter</h3>
+            </a>
+            <div className="text">
+              {i("com_online_twitter_desc")}
+              <a href="{{ site.data.urls.ts_twitter }}" target="_blank">
+                @typescript
+              </a>
+              !
+            </div>
           </div>
           <div className="callout col-md-4">
-            <a aria-labelledby="blog-header" className="icon blog img-circle" href="{{ site.data.urls.ts_blog }}" target="_blank"></a>
-            <a href="{{ site.data.urls.ts_blog }}" id="blog-header" target="_blank"><h3 className="community-callout-headline">Blog</h3></a>
-            <div className="text">Learn about the latest TypeScript developments via our <a href="{{ site.data.urls.ts_blog }}" target="_blank">blog</a>!</div>
+            <a
+              aria-labelledby="blog-header"
+              className="icon blog img-circle"
+              href="{{ site.data.urls.ts_blog }}"
+              target="_blank"
+            ></a>
+            <a
+              href="{{ site.data.urls.ts_blog }}"
+              id="blog-header"
+              target="_blank"
+            >
+              <h3 className="community-callout-headline">Blog</h3>
+            </a>
+            <div className="text">
+              {i("com_online_blog_desc")}
+              <a href="{{ site.data.urls.ts_blog }}" target="_blank">
+                blog
+              </a>
+              !
+            </div>
           </div>
           <div className="callout col-md-4">
-            <a aria-labelledby="deftyped-header" className="icon definitelytyped img-circle" href="{{ site.data.urls.definitelytyped_github }}" target="_blank"></a>
-            <a href="{{ site.data.urls.definitelytyped_github }}" id="deftyped-header" target="_blank"><h3 className="community-callout-headline">Definitely Typed</h3></a>
-            <div className="text">Browse the thousands of <a href="{{ site.data.urls.definitelytyped_github }}" target="_blank">TypeScript definition files</a> available for common libraries and frameworks.</div>
+            <a
+              aria-labelledby="deftyped-header"
+              className="icon definitelytyped img-circle"
+              href="{{ site.data.urls.definitelytyped_github }}"
+              target="_blank"
+            ></a>
+            <a
+              href="{{ site.data.urls.definitelytyped_github }}"
+              id="deftyped-header"
+              target="_blank"
+            >
+              <h3 className="community-callout-headline">Definitely Typed</h3>
+            </a>
+            <div className="text">
+              {i("com_online_typed_desc")}{" "}
+              <a
+                href="{{ site.data.urls.definitelytyped_github }}"
+                target="_blank"
+              >
+                {i("com_online_typed_href")}
+              </a>{" "}
+              {i("com_online_typed_available_for")}
+            </div>
           </div>
         </div>
 
-
-        <h2>Connect in person</h2>
+        <h2>{i("com_person")}</h2>
 
         <div style={{ display: "none" }}>
-          <h3>Conferences</h3>
+          <h3>{i("com_conferences")}</h3>
           <div className="callouts">
             <div className="row">
               {conferences.map(conference => (
                 <div className="callout col-md-4">
-                  <a href={conference.url} rel="noopener" target="blank"><img src={conference.image} className="icon img-square" alt={"logo of " + conference.title} /></a>
-                  <a href={conference.url}><h4 className="community-callout-headline">{conference.title}</h4></a>
+                  <a href={conference.url} rel="noopener" target="blank">
+                    <img
+                      src={conference.image}
+                      className="icon img-square"
+                      alt={
+                        `${i("com_conferences_alt_img")} ` + conference.title
+                      }
+                    />
+                  </a>
+                  <a href={conference.url}>
+                    <h4 className="community-callout-headline">
+                      {conference.title}
+                    </h4>
+                  </a>
                   <div className="text">
-                    {conference.location} {conference.country}<br /><time>{conference.date}</time>
+                    {conference.location} {conference.country}
+                    <br />
+                    <time>{conference.date}</time>
                   </div>
                 </div>
               ))}
@@ -121,17 +233,30 @@ export const Comm: React.FC<Props> = (props) => {
         <h3>Upcoming Meetups</h3>
         <div className="callouts">
           <div className="row">
-            {meetups.filter(m => m.event).sort((l, r) => new Date(l.event!.date).getTime() - new Date(r.event!.date).getTime()).map(m => (
-              <div className="col1 upcoming-event" >
-                <h4>{m.meetup.title}</h4>
-                <h4>{intl.formatDate(m.event!.date)}</h4>
-                <div className="meetup-text"><div dangerouslySetInnerHTML={{ __html: m.event!.richDescription }} /></div>
-              </div>
-            ))}
+            {meetups
+              .filter(m => m.event)
+              .sort(
+                (l, r) =>
+                  new Date(l.event!.date).getTime() -
+                  new Date(r.event!.date).getTime()
+              )
+              .map(m => (
+                <div className="col1 upcoming-event">
+                  <h4>{m.meetup.title}</h4>
+                  <h4>{intl.formatDate(m.event!.date)}</h4>
+                  <div className="meetup-text">
+                    <div
+                      dangerouslySetInnerHTML={{
+                        __html: m.event!.richDescription,
+                      }}
+                    />
+                  </div>
+                </div>
+              ))}
           </div>
         </div>
       </div>
-    </Layout >
+    </Layout>
   )
 }
 // {meetups.map(m => (
@@ -141,11 +266,14 @@ export const Comm: React.FC<Props> = (props) => {
 //     <div className="text">{m.meetup.country}<br /><a rel="noopener" target="blank" href={m.meetup.url}>Website</a>{m.meetup.twitter ? <a rel="noopener" target="blank" href={meetup.twitter}>Twitter</a> : null}</div>
 //   </div>
 // ))}
-export default (props: Props) => <Intl><Comm {...props} /></Intl>
-
+export default (props: Props) => (
+  <Intl>
+    <Comm {...props} />
+  </Intl>
+)
 
 export const query = graphql`
-    query CommunityPage {
-      ...AllSitePage
-    }
+  query CommunityPage {
+    ...AllSitePage
+  }
 `