xoron :verified:<p>Functional Web Components with LitElements.</p><p>For practice and learning i decided to create a <a href="https://infosec.exchange/tags/UIFramework" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>UIFramework</span></a> to make LitElements more functional. i like the idea of webcomponents and <a href="https://infosec.exchange/tags/litElement" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>litElement</span></a>, but i liked the <a href="https://infosec.exchange/tags/reactSyntax" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>reactSyntax</span></a> for what i see as "more readable" and "more maintainable" code. So i decided to create a simple todo app using a <a href="https://infosec.exchange/tags/functional" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>functional</span></a> approach with <a href="https://infosec.exchange/tags/LitElements" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>LitElements</span></a>.</p><p>Im investigating additional features and improvements so i dont reccommend anyone to adopt using this yet. The implementation is far from finished, but seems to be working enough to test.</p><p>Future improvements on this im looking into are:<br>- bottom up state management<br>- encrypted state persistence at rest</p><p>Blog: <a href="https://positive-intentions.com/blog/dim-functional-webcomponents" rel="nofollow noopener" translate="no" target="_blank"><span class="invisible">https://</span><span class="ellipsis">positive-intentions.com/blog/d</span><span class="invisible">im-functional-webcomponents</span></a></p><p>GitHub: <a href="https://github.com/positive-intentions/dim" rel="nofollow noopener" translate="no" target="_blank"><span class="invisible">https://</span><span class="ellipsis">github.com/positive-intentions</span><span class="invisible">/dim</span></a></p><p>Demo: <a href="https://dim.positive-intentions.com/?path=/story/components-todo--basic" rel="nofollow noopener" translate="no" target="_blank"><span class="invisible">https://</span><span class="ellipsis">dim.positive-intentions.com/?p</span><span class="invisible">ath=/story/components-todo--basic</span></a></p><p><a href="https://infosec.exchange/tags/WebDevelopment" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>WebDevelopment</span></a> <a href="https://infosec.exchange/tags/LitElements" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>LitElements</span></a> <a href="https://infosec.exchange/tags/JavaScript" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>JavaScript</span></a> <a href="https://infosec.exchange/tags/FrontEnd" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>FrontEnd</span></a> <a href="https://infosec.exchange/tags/WebComponents" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>WebComponents</span></a> <a href="https://infosec.exchange/tags/StateManagement" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>StateManagement</span></a> <a href="https://infosec.exchange/tags/Encryption" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>Encryption</span></a> <a href="https://infosec.exchange/tags/Coding" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>Coding</span></a> <a href="https://infosec.exchange/tags/OpenSource" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>OpenSource</span></a></p>