This is a small CMS for dev.to authors. personal use for now but may open up for others to use in future.
Deployed to: https://dev-to-cms.now.sh/
based on
- Next.js
- Tailwind CSS
- Preact
- Monaco Editor
- Formik (replacing React Hook Form)
- React Query: https://github.com/tannerlinsley/react-query
- Tailwind UI: https://tailwindui.com/
- give a DEV API key
- list blogposts
- edit blogposts
- Clone existing post
- create a new post
- mark document dirty and prompt before leaving
- if dirty, save to local state and restore!
- when focused on editor, autoscroll up nicely
- keyboard shortcuts for toggling states
- Redirect to edit after posting
- Markdown preview with toggles
- Async status -> nicer UX when clicking submit
- Disable submit button
- show spinner while inflight - web component!! https://github.com/craigjennings11/wc-spinners/
- Show error! - using notifications as a hook!
- integrate Oauth flow from Ben Halpern
- Monaco Editor
We will not offer deleting blogposts but can unpublish.
Todos:
- sticky header?
- combobox for tags and series?
- image upload?
- Day 1 - Setup Next.js and Tailwind UI, list posts through API routes - 90 mins
- Day 2 - setting up a Markdown Editor with Next.js, Tailwind UI, Highlight.js, React Hook Form, and React Query - 3 hours
- Quick Fix - How To Add Monaco Editor to a Next.js app - 18 mins
- Day 3 - Refactoring to Edit Existing Posts - 3 hours