working example using API KEY

Author: Alex Patterson

amplify/backend/api/ccd/schema.graphql

@@ -4,6 +4,7 @@ type Blog
   @aws_cognito_user_pools
   @auth(
     rules: [
+      { allow: public, provider: apiKey }
       {
         allow: groups
         groups: ["Admin"]
@@ -29,6 +30,7 @@ type Post
   @searchable
   @auth(
     rules: [
+      { allow: public, provider: apiKey }
       {
         allow: groups
         groups: ["Admin"]
@@ -54,6 +56,7 @@ type Post
   comment_status: Boolean
   ping_status: Boolean
   comment_count: Int
+  post_featured_image: String
   blog: Blog @connection(name: "BlogPosts")
   comments: [Comment] @connection(name: "PostComments")
   category: [Category] @connection(name: "PostCategories")

amplify/backend/backend-config.json

@@ -30,12 +30,20 @@
       "output": {
         "authConfig": {
           "defaultAuthentication": {
-            "authenticationType": "AMAZON_COGNITO_USER_POOLS",
-            "userPoolConfig": {
-              "userPoolId": "authccdb1bcb9cf"
+            "authenticationType": "API_KEY",
+            "apiKeyConfig": {
+              "apiKeyExpirationDays": 365,
+              "description": "ccdapikey"
             }
           },
-          "additionalAuthenticationProviders": []
+          "additionalAuthenticationProviders": [
+            {
+              "authenticationType": "AMAZON_COGNITO_USER_POOLS",
+              "userPoolConfig": {
+                "userPoolId": "authccdb1bcb9cf"
+              }
+            }
+          ]
         }
       },
       "dependsOn": [

nextjs/pages/post/[id].tsx

@@ -1,19 +1,24 @@
-import { API } from 'aws-amplify';
-import { useRouter } from 'next/router';
-import '../../configureAmplify';
+import { API } from "aws-amplify";
+import { useRouter } from "next/router";
+import "../../configureAmplify";
+import gql from "graphql-tag";
 
 const getPost = `
-  query getPostById($postId: String!) {
-    getPostById(postId: $postId) {
-      id title content
+  query getPost($id: ID!) {
+    getPost(id: $id) {
+      id post_title post_content
     }
   }
 `;
 
-const listPosts = `
+const listPosts = gql`
   query listPosts {
     listPosts {
-      id title content
+      items {
+        post_title
+        id
+        post_content
+      }
     }
   }
 `;
@@ -26,8 +31,8 @@ export default function Post({ post }) {
   return (
     <div>
       <h1>Post</h1>
-      <h2>{post.title}</h2>
-      <h2>{post.content}</h2>
+      <h2>{post.post_title}</h2>
+      <h2>{post.post_content}</h2>
     </div>
   );
 }
@@ -36,7 +41,7 @@ export async function getStaticPaths() {
   const postData: any = await API.graphql({
     query: listPosts,
   });
-  const paths: any = postData.data.listPosts.map((post) => ({
+  const paths: any = postData.data.listPosts.items.map((post) => ({
     params: { id: post.id },
   }));
   return {
@@ -49,11 +54,12 @@ export async function getStaticProps({ params }) {
   const { id } = params;
   const postData: any = await API.graphql({
     query: getPost,
-    variables: { postId: id },
+    variables: { id: id },
   });
+  console.log(postData);
   return {
     props: {
-      post: postData.data.getPostById,
+      post: postData.data.getPost,
     },
   };
 }

nextjs/pages/posts.tsx

@@ -8,9 +8,11 @@ import AWSAppSyncClient, { AUTH_TYPE } from "aws-appsync";
 const listPosts = gql`
   query listPosts {
     listPosts {
-      id
-      title
-      content
+      items {
+        post_title
+        id
+        post_content
+      }
     }
   }
 `;
@@ -34,8 +36,8 @@ export default function Posts() {
       const postData: any = await client.query({
         query: listPosts,
       });
-
-      setPosts(postData.data.listPosts);
+      console.log(postData.data.listPosts.items);
+      setPosts(postData.data.listPosts.items);
     }
   }, []);
 
@@ -44,7 +46,7 @@ export default function Posts() {
       <h1>Posts</h1>
       {posts.map((post) => (
         <Link href={`/post/${post.id}`} key={post.id}>
-          <a>{post.title}</a>
+          <a>{post.post_title}</a>
         </Link>
       ))}
     </div>

nextjs/src/aws-video-exports.js

@@ -0,0 +1,8 @@
+// WARNING: DO NOT EDIT. This file is automatically generated by AWS Amplify. It will be overwritten.
+
+const awsvideoconfig = {
+    "awsInputVideo": "ccdvod-dev-input-xzkln6vc",
+    "awsOutputVideo": "d3lbx3hw011qkz.cloudfront.net"
+};
+
+export default awsvideoconfig;