Sinds januari 2021

Doars

Doars is een lichtgewicht front-end framework dat ik heb ontwikkeld om reactiviteit aan websites toe te voegen zonder de overhead van grotere bibliotheken. Het stelt ontwikkelaars in staat om interactieve functies direct in HTML toe te voegen, waardoor webontwikkeling intuïtiever en efficiënter wordt.

Het bouwen van Doars was een transformerende ervaring die mijn expertise in front-end webontwikkeling heeft verdiept. Ik begon ermee in januari 2021 om een declaratieve aanpak voor interactiviteit te verkennen, met de focus op het inbedden van logica direct in de markup in plaats van aparte JavaScript-bestanden. Deze paradigmaverschuiving—van traditionele React-stijl apps naar hypermedia-gedreven applicaties, vooral in combinatie met plugins zoals doars-fetch voor servercommunicatie—bracht unieke uitdagingen met zich mee in statebeheer en prestatieoptimalisatie. Het onderhouden ervan heeft het verfijnen van plugins voor navigatie, persistentie en routing omvat, terwijl ik iteratief werk op basis van gebruikersfeedback om het modulair en lichtgewicht te houden.

Met slechts 11kB geminificeerd integreert Doars naadloos in bestaande projecten zonder een volledige applicatiearchitectuur te vereisen, waardoor het ideaal is voor het incrementeel verbeteren van server-gerenderde sites. De snelle updatecycli zorgen ervoor dat alleen relevante richtlijnen vernieuwen, waardoor ontwikkelingsworkflows versnellen en gebruikerservaringen verbeteren. Hier is een eenvoudig voorbeeld van het toevoegen van een dynamische lijst:

<div d-state="{ messages: ['Hallo!', 'Hoe gaat het?'] }">
  <ol>
    <template d-for="message of messages">
      <li d-text="message"></li>
    </template>
  </ol>
  <input d-reference="input" type="text">
  <button d-on:click="messages.push($references.input.value); $references.input.value=''">Toevoegen</button>
</div>
<script src="https://cdn.jsdelivr.net/npm/@doars/doars@3/dst/doars.iife.js"></script>
<script>
  document.addEventListener('DOMContentLoaded', () => {
    const doars = new window.Doars();
    doars.enable();
  });
</script>

Deze aanpak heeft me waardevolle lessen geleerd in het balanceren van eenvoud met functionaliteit, waardoor snellere iteraties en betere samenwerking mogelijk zijn. Hoewel ik geen extern gebruik heb bijgehouden, illustreert Doars mijn vermogen om te innoveren in front-end ontwikkeling en praktische tools te leveren die echte problemen oplossen.

Link

Verder lezen

Bezoek de Doars projectwebsite voor meer informatie of bekijk de Doars broncode beschikbaar op GitHub.

Je kunt ook meer te weten komen over andere open-source projecten van mij: