add fullstack courses page

Author: Allicolyer

packages/gatsby-theme/src/components/TutorialListing.tsx

@@ -22,14 +22,7 @@ const TutorialListing: React.FunctionComponent<TutorialListingProps> = ({
   tutorial,
 }) => {
   return (
-    <Card
-      width={[1]}
-      p={4}
-      my={4}
-      borderRadius={8}
-      boxShadow="small"
-      key={tutorial.id}
-    >
+    <Card width={[1]} p={4} my={4} borderRadius={8} boxShadow="small">
       <Link to={getTutorialOverviewSlug(tutorial.fileAbsolutePath)}>
         <Heading>{tutorial.frontmatter.tutorialTitle}</Heading>
       </Link>

packages/gatsby-theme/src/components/shared/Header.tsx

@@ -51,8 +51,8 @@ const Nav = withTheme(
           </Container>
           <Container justifyContent="center">
             <NavLink to="/fundamentals">Fundamentals</NavLink>
-            <NavLink to="/guides">Guides</NavLink>
-            <NavLink to="/community">Community</NavLink>
+            <NavLink to="/courses">FullStack Course</NavLink>
+            <NavLink to="/community">Community Tutorials</NavLink>
             <NavLink to="/components">Components</NavLink>
           </Container>
           <Container justifyContent="flex-end">

packages/gatsby-theme/src/pages/community.tsx

@@ -12,7 +12,11 @@ const Community = data => {
       <Content>
         <Heading> Community Tutorials </Heading>
         {tutorials.map(tutorial => {
-          return <TutorialListing tutorial={tutorial.node} />;
+          return (
+            <div key={tutorial.node.id}>
+              <TutorialListing tutorial={tutorial.node} />
+            </div>
+          );
         })}
       </Content>
     </Layout>

packages/gatsby-theme/src/pages/courses.tsx

@@ -0,0 +1,19 @@
+import * as React from 'react';
+import Layout from '../components/layout';
+import { Content } from '../components/shared/styledHelpers';
+import { Heading, Text } from '../components/shared/base';
+
+const courses = () => {
+  return (
+    <Layout>
+      <Content>
+        <Heading> Fullstack Course </Heading>
+        <Text>A general introduction to GraphQL for frontend and backend developers.</Text>
+        <Text> Read this tutorial to learn about GraphQL's basic concepts and prepare
+          yourself for a hands-on beginner tutorial.</Text>
+      </Content>
+    </Layout>
+  );
+};
+
+export default courses;