Notion Clone — React JS + JSON Server (NoteFlow)
Intermediate notion-clone notes block-editor react

Notion Clone — React JS + JSON Server (NoteFlow)

By Sandeep Pal

Build NoteFlow — Notion-style block editor with pages, sidebar, todos, favorites, and JSON Server API. Detailed step-by-step guide.

₹349 ₹799 56% OFF
Tech stack
React JS JSON Server React Router Context API contentEditable REST API JavaScript
Log in to purchase
Need help with the project code?

If you run into any issues while building or running this project, email care@toolliyo.com. Our team will get back to you within 24 hours with solutions.

  • Complete source code ZIP
  • Guidelines PDF inside ZIP
  • Ready to download after purchase
  • Lifetime access from dashboard

Project details

Notion Clone — React JS + JSON Server (NoteFlow)

Build NoteFlow — a Notion-style block editor with pages, sidebar tree, favorites, editable blocks, todos, and search. Project 17 with full step-by-step guide.

What you get

  • notion-app/ — React frontend + db.json JSON Server API
  • Block types: heading, text, bullet, todo, callout, code
  • NOTION_CLONE_REACT_JS.md — Detailed guide with architecture diagrams

Features

  • Nested page sidebar · Favorites · Create page (POST)
  • Inline editable blocks · Todo checkboxes (PATCH)
  • Add/delete blocks · Page search · Notion-inspired UI

Run

cd notion-app && npm install && npm run dev:all

Stack

React · Vite · React Router · JSON Server · Context API · contentEditable · CSS

Toolliyo Assistant
Ask about tutorials, ebooks, training, pricing, mentor services, and support. I use public site content only—not admin or internal tools.

care@toolliyo.com

Need callback? Share your details