jdh-company.com / portfolio

PORTFOLIO

Selectie van webprojecten.

Webontwikkeling

Alle websites zijn responsive, volgen de allernieuwste webstandaarden en best practices, en zijn zo lean mogelijk gebouwd.

Amber Console

Amber Console — demo van een projectieconsole in een amberkleurig plasmapalet
Amber Console — demo van een radarscope in een P7-CRT-fosforpalet

PROJECT

  • Naam: Amber Console
  • Type: CSS-framework / designsysteem
  • Licentie: BSD 3-Clause (open source)

BESCHRIJVING

Monochroom CSS-framework met de uitstraling van een industrieel bedieningspaneel uit de late jaren tachtig; zonder runtime-dependencies en zonder buildstap, met optionele JavaScript-modules voor effecten die CSS zelf niet kan.

BIJZONDERE FEATURES

  • 11 paletten: plasmagassen en CRT-fosforen
  • 9,4 KB gzipped, geen dependencies
  • WCAG AA-contrast gecontroleerd in elk palet

URL

dutchdiederik.github.io/AmberConsole

github.com/DutchDiederik/AmberConsole

STACK

  • HTML5
  • CSS3
  • JavaScript
  • npm

Allergy Note

Allergy Note op iPhone — allergieselectie, de gegenereerde allergiekaart en het taalselectiescherm

BEDRIJF

  • Naam: Allergy Note
  • Sector: Voedselallergie / reizen
  • Platform: Web-app (PWA)

BESCHRIJVING

Web-app die je voedselallergieën en dieetwensen in elke taal toont, zodat je overal ter wereld veilig kunt eten; gebouwd met React, Vite en Tailwind CSS.

BIJZONDERE FEATURES

  • Allergiekaart in vele talen
  • Allergiekaart opslaan als afbeelding
  • Allergietekst kopiëren naar klembord

URL

https://allergynote.com

STACK

  • HTML5
  • CSS3
  • JavaScript
  • React
  • Tailwind CSS
  • Vite

Poppy Cool

Poppy Cool — home
Poppy Cool — fotoboek

BEDRIJF

  • Naam: Poppy Cool
  • Sector: Airconditioning
  • Locatie: Rotterdam

BESCHRIJVING

Marketingsite met fullscreen videohero, fotoboek en contactformulier; gebouwd met TypeScript en Vite, uitgeleverd als statische site.

BIJZONDERE FEATURES

  • Fullscreen videohero
  • Cookiebanner met Google Consent Mode
  • Fotoboek met projectfoto's

URL

https://poppycool.nl

STACK

  • HTML5
  • CSS3
  • TypeScript
  • Vite
  • JSON-LD
  • Google Analytics

JDH Company

JDH Company — donker thema
JDH Company — licht thema

BEDRIJF

  • Naam: JDH Company
  • Sector: IT dienstverlening
  • Locatie: Rotterdam

BESCHRIJVING

Gebouwd zonder frameworks, afhankelijkheden of buildstap; alleen HTML, CSS en een kleine hoeveelheid JavaScript.

BIJZONDERE FEATURES

  • Ultra lightweight
  • Donker en licht thema
  • Nederlands en Engels

URL

https://jdh-company.com

STACK

  • HTML5
  • CSS3
  • JavaScript
  • JSON-LD
  • SVG
  • Google Analytics