/amplify-simple-blog

Low-code blog created with AWS Amplify, NextJS and Typesense. UI is created from Figma design.

Primary LanguageJavaScript

Minimal Viable Blog with AWS Amplify and Typesense search

This blog showcases low-code development using Amplify Studio and Amplify CLI. The blog allows Admin user group to create posts and add tags to posts as well as upload images. The blog also allows users to search for posts by title. The blog is built using AWS Amplify, Next.js, Typesense.

This is a Next.js project bootstrapped with create-next-app.

Getting Started

  • Run amplify init to initialize your Amplify project.

  • add Typesense api keys in amplify/backend/api/simplebloggql/parameters.json. As this project uses @typesense transformer for our AppSync schema. Optional for search functionality.

  • Run amplify push to provision the backend resources.

  • Link Figma design file to your Amplify Studio project.

  • In Amplify Studio connect the figma file to the backend resources and update forms to use the new backend.

  • Run amplify pull to re-generate the ui components.

  • More information available in my blog post

Run the development server:

npm run dev
# or
yarn dev
# or
pnpm dev
# or
bun dev

Open http://localhost:3000 with your browser to see the result.

You can start editing the page by modifying pages/index.tsx. The page auto-updates as you edit the file.

API routes can be accessed on http://localhost:3000/api/hello. This endpoint can be edited in pages/api/hello.ts.

The pages/api directory is mapped to /api/*. Files in this directory are treated as API routes instead of React pages.

This project uses next/font to automatically optimize and load Inter, a custom Google Font.

Learn More

To learn more about Next.js, take a look at the following resources:

To learn more about Amplify, take a look at the following resources: