Built a browser-based lamp engraving configurator and learned that "just render the text" is never just that.
Customers pick a lamp, place their text, and get a laser-ready file.
Three problems that turned out to be deeper than they looked:
🔹 Script fonts. Mapping characters to glyphs isn't typography. Terminal letters kept their connecting strokes because OpenType rules were never applied. Fixed by shaping the full text run with HarfBuzz the same engine Chrome uses, so contextual alternates, final forms and ligatures come from the font itself. Verified pixel-by-pixel against the browser's own rendering.
🔹 Millimetres, not pixels. The SVG drives a laser cutter, so every glyph is measured in real mm against engraving zones. Text auto-shrinks to fit, never crosses a boundary, and holds an 18 mm minimum letter height.
🔹 Unique order numbers. Browser counters collide when two customers export at once. Moved to a server-side counter with flock tested with 20 simultaneous requests, 20 unique numbers.
Precision work beats clever work. Every fix was verified by measuring ink pixels, not by looking at the screen.
🔗 Live demo: https://lnkd.in/d9nGb-QX
(https://lnkd.in/d9nGb-QX)#WebDevelopment (https://www.linkedin.com/search/results/all/?keywords=%23webdevelopment&origin=HASH_TAG_FROM_FEED) #JavaScript (https://www.linkedin.com/search/results/all/?keywords=%23javascript&origin=HASH_TAG_FROM_FEED) #OpenType (https://www.linkedin.com/search/results/all/?keywords=%23opentype&origin=HASH_TAG_FROM_FEED) #SVG (https://www.linkedin.com/search/results/all/?keywords=%23svg&origin=HASH_TAG_FROM_FEED) #Manufacturing (https://www.linkedin.com/search/results/all/?keywords=%23manufacturing&origin=HASH_TAG_FROM_FEED)
0
48
Digital SaaS Product Landing Page – Responsive Marketing Website
A modern landing page for a digital SaaS product, designed to explain the product quickly, build trust and turn visitors into sign-ups.
Sections I built:
• Hero with clear call-to-action and product preview
• Feature highlights, about section and product statistics
• Team showcase, testimonials and blog section
• Newsletter subscription, contact area and polished footer
Highlights:
• Fully responsive on mobile, tablet and desktop
• Clean, reusable Tailwind CSS components
• Lightweight code for fast loading
Stack: HTML · Tailwind CSS · JavaScript
Live: https://digital-saas-landing.netlify.app/
0
36
Room Designer – Interactive 2D Room & Floor Layout Planner
A browser-based planner that helps users design a room before buying furniture or renovating. They place, move and resize furniture on a grid-based floor plan and see the layout update instantly.
What I built:
• Drag & drop furniture and room elements on a Fabric.js canvas
• Grid-based floor plan with multiple rooms
• Real-time rendering with move, rotate and resize controls
• Clean toolbar and properties panel for quick editing
Ideal for furniture stores, interior designers, event planners and real estate websites that want customers to visualize a space.
Stack: Fabric.js · JavaScript · HTML · CSS
Live demo: https://room-design-editor.netlify.app/
0
42
Convert Box – Online File Converter for Images, Video & Audio
One simple web app that replaces several converter tools. Users drop in a file, pick the output format and download the result in seconds.
Supported formats:
• Images: JPG, PNG, TIFF, JFIF and more
• Video: MP4, MOV, AVI, MKV
• Audio: MP3, WAV, OGG, AAC, FLAC, M4A, WMA
Highlights:
• Drag & drop upload with multiple files at once
• Clean, responsive interface that works on any device
• Fast conversions powered by FFmpeg
Stack: JavaScript · FFmpeg · HTML · CSS
Live: https://convert-box.netlify.app/
0
49