I stopped rewriting the same 95 lines of JavaScript and built this instead

Ketan Vishwakarma — Sun, 22 Mar 2026 09:58:29 +0000

Every Django project I've worked on had the same moment. Somewhere around week two, you're writing a data table. You write the fetch. You write the render. You wire up sorting. You add pagination. You handle the empty state and the error state. You add the delete button with a confirm dialog and a toast. You look at the file and it's 95 lines for something every web app needs.
Then you do it again on the next project. Same 95 lines, different API URL.
I did that enough times that I eventually just built a component for it. Then I built one for images. Then one for forms and more smart-elements.

I spent the last few months turning all of that into declarative HTML Web Components. The idea is simple — instead of writing the logic, you describe what you want as attributes.
A full data table with sorting, search, pagination, delete confirmation, toast notifications, and skeleton loading:

<smart-table
  api-url="/api/users/"
  response-map='{"dataPath":"results","totalPath":"count"}'
  columns='[{"field":"name"},{"field":"status","type":"badge"}]'
  delete-api-url="/api/users"
  page-size="20">
</smart-table>

18 components total. Some highlights:

smart-chart — built on Chart.js and ApexCharts, supports WebSocket live streaming, drag-to-zoom, 6 palettes, export to PNG/CSV/JSON
smart-form — declarative AJAX form engine, handles CSRF automatically, maps field errors from DRF responses, refreshes tables on submit
smart-grid — dashboard layout with drag-to-reorder, resize handles, and localStorage persistence
smart-permission — reactive UI control system, add if="user.role === 'admin'" to any HTML element
smart-input — 8 input types (text, select, datepicker, file, switch, checkbox, radio, textarea), one API

Works with Django, Flask, Rails, plain HTML. No build step, no npm, no framework opinion.
Docs with live demos: smartelements.in
Github Repo: Github-SmartElements
Happy to answer questions about how any of it works.

DEV Community: Ketan Vishwakarma

I stopped rewriting the same 95 lines of JavaScript and built this instead