Posts

✔️ Platform - Hugo ✔️ Theme - PaperMod ✔️ Comment - giscus ✔️ Hosting - Github Page ✔️ PageSpeed - 100% ✔️ Cost - 100% Free PageSpeed Insights Mobile ⚡ Desktop ⚡

This is a toast notification Web Component using Stenciljs. Built with Stencil Built with TailwindCSS v3.x Demo Demo Installation npm install cb-toast Or use npm cdn <script type="module" src="https://cdn.jsdelivr.net/npm/cb-toast@1.0.3/dist/cb-toast/cb-toast.esm.js"></script> Usage The Coolbrains toast Component can be use as following: <cb-toast></cb-toast> <button id="showToastSuccess" class="bg-green-700">Success</button> <script> let cbToast = document.querySelector('cb-toast'); document.getElementById('showToastSuccess').addEventListener('click', event => { cbToast.Toast({ title: 'Success', //default description: 'success message', //default timeOut: 3000, //default position: 'top-right', //default type: 'success', //default }); }); </script> Positions 'top'; 'bottom'; 'top-left'; 'top-right'; //default 'bottom-left'; 'bottom-right'; type 'success'; //default 'info'; 'warning'; 'error'; Code Github

SOLID principles were introduced by Robert C.Martin (Uncle Bob). - Robert Cecil Martin What does SOLID stand for? S – Single Responsibility Principle A class should have one and only one reason to change, meaning that a class should have only one job O – Open Closed Principle Software entities (classes, modules, functions, etc.) should be open for extension but closed for modification. L – Liskov Substitution Principle Every subclass or derived class should be substitutable for its base or parent class...

This is a TreeView Web Component using Stenciljs. Built with Stencil Built with TailwindCSS v3.x *** Special thanks to Hasibul Haque Demo codesandbox Installation npm install cb-treeview Or use npm cdn <script type="module" src="https://cdn.jsdelivr.net/npm/cb-treeview@1.0.0/dist/cb-treeview/cb-treeview.esm.js"></script> Usage The Coolbrains TreeView Component can be use as following: <cb-treeview></cb-treeview> <script> const data = [ { id: 1, name: 'Parent 1', parentId: null, children: [ { id: 3, name: 'Parent 1-0', parentId: 1, children: [ { id: 2, name: 'Leaf', parentId: 3, children: [ { id: 8, name: 'Leaf', parentId: 2, children: [], }, ], }, ], }, { id: 4, name: 'Parent 1-1', parentId: 1, children: [], }, ], }, { id: 5, name: 'Parent 2', parentId: null, children: [], }, { id: 9, name: 'Parent 3', parentId: null, children: [ { id: 4, name: 'Parent 3-0', parentId: 9, children: [], }, { id: 4, name: 'Parent 3-1', parentId: 9, children: [], }, ], }, ]; const cbTreeView = document....

Please first watch this video Step 1: Install nodejs LTS version https://nodejs.org/en/ Step 2: install iisnode (x86 or x64 ) download link : https://github.com/Azure/iisnode Step 3: Install url-rewrite download link : https://www.iis.net/downloads/microsoft/url-rewrite Step 4: Create Simple Nuxt Application https://nuxtjs.org/guide/installation#using-code-create-nuxt-app-code Step 5: deploy on IIS https://nuxtjs.org/faq/deployment-azure-portal web config <security> <requestFiltering> <hiddenSegments> <add segment="node\_modules" /> </hiddenSegments> </requestFiltering> </security> <iisnode node\_env="production" /> Special thanks to Hasibul Haque