DOCX Editor

A web-based DOCX file viewer and editor with rich text formatting capabilities.

• File Operations:

  • Open existing DOCX files
  • Create new documents
  • Save documents

• Rich Text Editing:

  • Bold, italic, underline formatting
  • Font size and family selection
  • Text alignment (left, center, right, justify)
  • Lists (ordered and unordered)
  • Headers (H1-H6)
  • Text and background colors

• Export Options:

  • Export as DOCX
  • Export as Markdown
  • Export as plain text

├── backend/
│   └── index.ts           # Main API server
├── frontend/
│   ├── index.html         # Main HTML template
│   ├── index.tsx          # React app entry point
│   ├── components/
│   │   ├── App.tsx        # Main app component
│   │   ├── Editor.tsx     # Rich text editor
│   │   ├── Toolbar.tsx    # Formatting toolbar
│   │   └── FileManager.tsx # File operations
│   └── style.css          # Styles
├── shared/
│   └── types.ts           # Shared TypeScript types
└── README.md

1. Visit the application URL
2. Click "New Document" to create a new document or "Manage Files" to open existing documents
3. Use the rich text toolbar to format your content:
   • Text formatting (bold, italic, underline, strikethrough)
   • Font family and size selection
   • Text and background colors
   • Text alignment (left, center, right, justify)
   • Lists (bulleted and numbered)
   • Headers (H1-H6)
   • Indentation and horizontal rules
   • Undo/redo functionality
4. Documents auto-save as you type
5. Export your document in DOCX, Markdown, or plain text format
6. Upload existing DOCX files (parsing implementation in progress)

• Frontend: React with TypeScript
• Backend: Hono API framework
• DOCX Processing: docx library for reading/writing
• Rich Text Editor: Custom implementation with contentEditable and document.execCommand
• Storage: Val Town Blob storage
• Styling: TailwindCSS

• GET /api/documents - List all documents
• GET /api/documents/:id - Get specific document
• POST /api/documents - Save/create document
• DELETE /api/documents/:id - Delete document
• POST /api/export - Export document in various formats
• POST /api/upload - Upload DOCX file (basic implementation)

• DOCX file parsing is basic (creates placeholder document)
• No collaborative editing features
• No document versioning
• Limited advanced formatting options (tables, images, etc.)

• Full DOCX parsing with mammoth.js or similar
• Advanced formatting (tables, images, charts)
• Document templates
• Collaborative editing
• Version history
• Print functionality
• Spell check