#alpinejs #eleventy #javascript #laravel #laravel #rails #craftcmsIntegrating Alpine.js + Pre/Server-rendered contentAlpine.js is a great choice for adding some interactive feature to a server rendered, static or pre-rendered site. In the Alpine.js GitHub Issues, we’ve seen a lot of questions around how to deal with content that’s pre-rendered or server-rendered in Alpine.js in orde ...
#alpinejs #eleventy #javascriptIntegrating Alpine.js with Eleventy & YAML files to create Alpine Playground's CollectionsAdding collections to Alpine.js Playground, essentially bringing it in line with projects such as awesome-alpine and alpinetoolbox.com. It came from the fact that I’m curating quite a bit of content for each newsletter and it makes sense that content featured on the newslet ...
#eleventy #alpinejs #javascript #nodeHow to migrate a bunch of HTML pages (Alpine.js Playground) to EleventyAlpine.js Playground was recently migrated from custom build scripts & HTML pages to leverage Eleventy. For context, Alpine.js Playground’s custom build scripts + HTML files had the following pros and cons. Pros: simple very simple, everything is in the scripts folder. ...
#alpinejs #javascriptPractical Alpine.js: x-data data access & data fetching/AJAX examplesAlpine.js “A rugged, minimal framework for composing JavaScript behavior in your markup.” is a great, lightweight replacement for interactive jQuery or Vanilla JS sprinkles due to its small size (~7kb min-gzipped) & the fact it can be included from a CDN with a sc ...
#alpinejs #javascriptRun Alpine.js inside of ReactAlpine.js is well-suited for building widgets and easily creating client-side experiences for websites that are mainly server-side rendered or static. Good news: it is possible (at the time of writing with Alpine.js 2.x) to integrate Alpine.js with React trivially. Alpine.js is & ...
#javascript #nodeAdvantages and Disadvantages of Node.jsJavaScript is perhaps the most highly regarded of the different programming languages out there, and in terms of client-side programming languages, there are few tools that are peers to JavaScript. In terms of web development, it is clear that JavaScript has a very important role ...
#javascript #node #testing #deploymentManaging Your Videos With HTML and JavaScriptThis article explains how to manage video content with HTML and JavaScript. Video content has become a significant part of Internet use, and it plays a large role in user experience. The ability to effectively include video content in your sites can help you improve user experien ...
#vuejs #javascriptFix "[Vue warn]: You are using the runtime-only build of Vue"This post explains how to fix “[Vue warn]: You are using the runtime-only build of Vue where the template compiler is not available. Either pre-compile the templates into render functions, or use the compiler-included build.”. This error happens when using the Vue CLI ...
#jest #testing #javascript #nodeJest set, clear and reset mock/spy/stub implementationBetween test runs we need mocked/spied on imports and functions to be reset so that assertions don’t fail due to stale calls (from a previous test). This is a way to mitigate what little statefulness is in the system. In unit tests of complex systems, it’s not always ...
#jest #testing #javascript #nodeJest .fn() and .spyOn() spy/stub/mock assertion referenceWhere other JavaScript testing libraries would lean on a specific stub/spy library like Sinon - Standalone test spies, stubs and mocks for JavaScript. Works with any unit testing framework., Jest comes with stubs, mocks and spies out of the box. This post looks at how to instanti ...