Back to Projects
web
2025

Shutterstock Widget Generator

This project integrates the Shutterstock UI Wizard tool to help developers generate embeddable widgets in either HTML or React. It provides a live preview feature and several customization options such as layout, content, and styling. The project demonstrates how to incorporate the widget into modern web applications, allowing users to seamlessly embed Shutterstock assets.

Shutterstock Widget Generator
Technologies

Frontend

React
TypeScript
Tailwind CSS

Backend

Database

Tools

Vite
Shutterstock UI Wizard
Prettier
ESLint
Challenges
  • Integrating third-party scripts and styles dynamically
  • Maintaining live preview functionality within React
  • Handling customization parameters from the wizard
Solutions
  • Used a sandboxed iframe to render third-party widget previews
  • Mapped wizard settings to React state management for real-time updates
  • Created an abstraction layer for embedding HTML or React code dynamically
Key Outcomes & Impact

Built a reusable component for live widget previews

Users can copy embeddable code directly from the interface

Improved UX by providing instant visual feedback for each setting

Other Projects

Paperclip - AI Company OS
Paperclip - AI Company OS

Explored Paperclip - an open-source orchestration platform for zero-human companies where AI agents (CEO, engineers, marketers, QA) collaborate autonomously.

View Project
NanoClaw - AI Agent on Raspberry Pi
NanoClaw - AI Agent on Raspberry Pi

Deployed NanoClaw, an open-source AI agent framework, on a $35 Raspberry Pi 3 with 1GB RAM. Scans grocery receipts via Discord, tracks price-per-kg across shops, and builds a personal inflation tracker - all locally for ~$1/month.

View Project