Skip to content
Real-time Collaborative Markdown Editor
JavaScript HTML CSS
Branch: master
Clone or download
Latest commit c6761fb Sep 4, 2019
Type Name Latest commit message Commit time
Failed to load latest commit information.
amplify updated to add sub by id Sep 4, 2019
public updated site title Apr 1, 2019
src updated to add sub by id Sep 4, 2019
.gitignore updated readme Apr 2, 2019
.graphqlconfig.yml initial commit Mar 29, 2019 Update Apr 4, 2019
package.json debounce updatePost Apr 4, 2019
writewithme.gif updated readme Apr 2, 2019
yarn.lock debounce updatePost Apr 4, 2019

✍️ Write with me

A real-time collaborative blog post editor built with GraphQL, React, React Markdown, & AWS AppSync.

This repo goes along with the medium post "How to Build a Real-time Collaborative Markdown Editor with React Hooks, GraphQL & AWS AppSync". Click here to check it out.

Try it out at

Base schema

Here's the base schema:

type Post @model {
  id: ID!
  clientId: ID!
  markdown: String!
  title: String!
  createdAt: String

We have a Post type that has a few properties. The most important property is the markdown. This is where we are keeping up with the state of the post.

We also have a clientId to properly handle GraphQL subscriptions on the client.

Launching the app

Deploy this fullstack app with a single click to the Amplify Console:


Run locally with the Amplify CLI

  1. Clone the repo
git clone
  1. Change into the directory & install dependencies
cd write-with-me

npm install
  1. Initialize the Amplify backend
amplify init
  1. Push the application into your account
amplify push
You can’t perform that action at this time.