Cream & Slush

J'ai eu un Ninja Slushi et je suis tombé immédiatement sur le problème classique : j'avais une machine, un frigo plein de trucs disparates, et aucune idée de ce que je pouvais vraiment faire. Chaque recette en ligne était éparpillée, aucune ne s'ajustait à la taille de ma machine, et personne ne vous prévenait quand un mélange n'allait pas geler ou était bien trop alcoolisé pour être slushé. Alors j'ai construit le site que j'aurais aimé trouver, un endroit rétro et amusant façon bar à soda où vous lui dites ce que vous avez sous la main et il vous dit ce que vous pouvez faire tout de suite.

• Un chercheur d'ingrédients « Qu'est-ce que je peux faire ». Sélectionnez ce qui est dans votre frigo et il affiche instantanément les recettes réalisables, plus une liste « presque » quand il vous manque un ou deux ingrédients
• 161 recettes de boissons glacées, des sodas et mocktails aux milkshakes, frappés, sorbets, gelato et cocktails glacés, cherchables par nom ou par ingrédient
• Ajustement automatique aux quatre tailles de Slushi (48, 64, 74, 112 oz) pour que chaque quantité soit juste pour votre machine
• Des avertissements de sécurité en direct intégrés à chaque recette. Il signale les mélanges à risque de non-congélation et les taux d'alcool excessifs avant que vous ne versiez
• Une vérification d'âge 21 ans et plus sur les recettes alcoolisées, plus des soumissions communautaires et des avis notés en cerises, pour que le site continue de grandir tout seul

• J'ai transformé un PDF de recherche corrompu en un produit propre. J'ai extrait un bloc JSON abîmé, plein d'artefacts de balises et de sauts de ligne par token, je l'ai reconstruit par appariement de crochets en données valides, puis j'ai normalisé 86 ingrédients en catégories sélectionnables
• Une logique de correspondance par théorie des ensembles. Une recette n'est réalisable que si vous avez tous ses ingrédients essentiels, les optionnels étant ignorés, ce qui donne au chercheur son côté intelligent
• Un vrai moteur de science alimentaire : des multiplicateurs d'ajustement machine, une table de correspondance alcool-vers-taux, une limite de volume d'alcool fort, et une détection du risque de non-congélation
• Une architecture statique par défaut. Les recettes sont livrées en props JSON statiques avec une recherche côté client via useMemo, donc aucune base de données ni API pour ralentir les choses ou coûter de l'argent
• Un SEO bien fait : JSON-LD de recette pour les résultats enrichis, sitemap, OpenGraph, plus des images de recette et des épingles Pinterest générées automatiquement par des scripts

• Tout est habillé façon bar à soda des années 1950 : des titres en script Pacifico, des rayures bonbon, des pois, des coins festonnés et de grosses ombres portées façon diner. Ça a du caractère
• Vous pouvez arriver avec n'importe quoi dans votre frigo et il vous propose une boisson que vous pouvez faire dans les cinq minutes
• Il fait discrètement de la vraie chimie. La plupart des gens ne savent pas que leur mélange ne va pas geler avant que ça échoue, et ça le repère en amont
• Il génère même automatiquement ses propres images de partage et épingles Pinterest. Le moteur marketing fait partie de la construction

Environ deux semaines de construction concentrée, d'un PDF de recherche corrompu à un site complet prêt pour la monétisation.

2 semaines · 1 sprint · 112 commits

Le point le plus délicat a été la récupération des données. La base de recettes source arrivait sous forme d'un PDF abîmé avec du JSON corrompu, donc j'ai dû extraire, nettoyer, et reconstruire par appariement de crochets en quelque chose d'utilisable, puis normaliser des dizaines de synonymes d'ingrédients pour que le chercheur ne traite pas « eau froide » et « eau » comme deux choses différentes. L'autre gros morceau a été l'angle alcool. 21 des 30 recettes d'origine étaient alcoolisées, ce qui complique l'éligibilité aux régies publicitaires, donc j'ai conçu autour d'une vérification d'âge, de signaux de sécurité, et d'un plan de monétisation qui démarre sur les pages sans alcool.

• Next.js 14 (App Router)
• React 18
• TypeScript
• Tailwind CSS 3.4
• JSON static data (no DB for recipes)
• libSQL / @libsql/client (submissions, reviews)
• Vercel Blob storage
• Vercel AI SDK
• Zod
• PostHog
• Sharp + opentype.js (image and pin generation)
• Vitest
• Vercel