ashrivastava
menu
// case study — shutterstock-widget-generator← all projects

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.

Professional·web·2025

Shutterstock GmbH · Software Engineer III

// hero
Shutterstock Widget Generator
// stack
frontend
ReactTypeScriptTailwind CSS
backend
database
tools
ViteShutterstock UI WizardPrettierESLint
// 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
// outcomes — impact3

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

// related — other projects
Own productpinnedfeatured
ai2026

JobJam.io — AI Job Search & Application Platform

AI-powered job search platform: discover roles, evaluate fit, tailor applications, and close skill gaps. One-time pricing, no subscriptions.

AILLMsJob SearchAnthropic Claude+3
Own productpinnedfeatured
ai2026

Fathohm — Comprehension-Debt System of Record

See how much of your codebase no human understands. A treemap of your repo colored by human comprehension score, with a tracked, assignable metric for 'who understands what' in an AI-native codebase.

AIDeveloper AnalyticsGitHub AppLLM Classification+2
Own productpinnedfeatured
ai2026

Grenz — Firewall for AI Agents

A local firewall for AI agents: scoped, revocable, observable permissions instead of your full GitHub token. Deny-by-default, MIT licensed, live at grenz.dev.

AI AgentsSecurityIAMMCP+2