Skip to content

rowangs/cad-frontend

Folders and files

NameName
Last commit message
Last commit date

Latest commit

Β 

History

20 Commits
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 

Repository files navigation

πŸ–ŒοΈ Mini CAD App

A browser-based Mini CAD (Computer-Aided Design) app built from scratch with a Node.js backend and HTML5 canvas frontend. It supports drawing lines, rectangles, circles, squiggles, and erasing β€” along with undo/redo, tabbed boards, and image exporting.

Live Demo: Mini CAD App
Backend API: Render Deployment


🌐 Features

✏️ Drawing Tools

  • Line, Rectangle, Circle, Freehand (Squiggle), Eraser

🎨 UI Controls

  • Color Picker
  • Brush Size Slider
  • Undo & Redo
  • Clear Board
  • Export Canvas as PNG
  • Multiple Boards (Tabs)

πŸ” Data Persistence

  • Shape data is saved per board to a Node/Express backend
  • Shapes are automatically reloaded when switching boards

🧠 Tech Stack

Layer Technology
Frontend HTML, CSS, JavaScript (Vanilla)
Backend Node.js, Express.js
Deployment GitHub Pages (frontend) + Render (backend)
Data Store In-memory object per board

πŸš€ Setup Instructions

πŸ”§ Backend (Node.js + Express)

  1. Clone backend repo:
    git clone https://github.com/rowangs/cad-backend
    cd cad-backend
    npm install
    node index.js

About

frontend for cad

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published