codeseed
Sign in
Explore Projects
DartintermediatewebAI generated

Dart Web Markdown Notes App

A browser-based note-taking app compiled from Dart to JavaScript that renders Markdown live as the user types and saves notes to browser local storage. Learners practice Dart web development, DOM manipulation, and Markdown parsing.

Estimate
~8.5h
Steps
5
Completed by
0
Proposed by
codeseed.app

Dart web · markdown package · dart:html

Sign in to claim this project

Project roadmap

  1. 01

    Set up the Dart web project

    ~1.5h

    Create a Dart web project with webdev and a basic HTML page shell.

  2. 02

    Build the editor layout

    ~2h

    Create a split-pane editor and preview area using dart:html event listeners for keystrokes.

  3. 03

    Render Markdown live

    ~1.5h

    Use the markdown package to convert typed Markdown into HTML shown in the preview pane in real time.

  4. 04

    Persist notes

    ~1.5h

    Save note content and titles to browser localStorage so notes survive page reloads.

  5. 05

    Add a notes sidebar

    ~2h

    Build a sidebar listing all saved notes that lets the user switch between them.

Resources

Ready to build this?

Get a GitHub repo and start building. Your AI reviewer checks each step as you go.

~8.5h · 5 steps

Tech stack

Dart webmarkdown packagedart:html