Front-End Development

In my previous blog, Rich Text Editor in Vue Application: Using Quill.js, we covered the fundamentals of setting up Quill.js in a Vue.js application to create a rich text editor. This blog will build on that foundation by diving deeper into Quill.js customization in Vue.js to meet specific needs. By the end of this tutorial, […]

Rich text editors are essential for many web applications, allowing users to format text, add links, and even insert media directly into their content. Quill.js is a powerful, customizable open-source editor that integrates seamlessly with modern frameworks like Vue.js. This tutorial will walk us through the steps to set up and integrate Quill.js in a […]

In this tutorial, we’ll explore how to achieve Vue.js Location Autocomplete by integrating the Google Maps Places Autocomplete API with a custom Geo Location component. We’ll walk you through each step to set up the Vue.js Location Autocomplete feature, manage user input, and bind it to Vue’s v-model for smooth two-way data binding. Prerequisites for […]

Lazy loading should be considered for large applications with numerous routes. Sometimes, optimizing performance may risk delivering a better user experience. Using the technique known as “lazy loading,” the browser loads only the modules or parts that are required for the particular scenario. All the modules will not be loaded except the active route. This […]

In this blog post, we’ll develop a Custom Select Picker using Vue.js, TypeScript, and jQuery. This article will teach you how to use Vue.js to create a custom select-picker component. Select-pickers are adaptable user interface elements that let users select from a list of alternatives in numerous ways. We’ll improve this component by adding more features […]

AI has arrived in the ever-evolving world of software development and staying ahead means embracing tools that can boost productivity and streamline workflows. GitHub Copilot, an AI-powered coding assistant developed by GitHub and OpenAI, has been turning heads since its debut. Integrated seamlessly with Visual Studio Code (VS Code), Copilot is more than just an […]

A rabbit hole Recently, I was learning about some new Adobe software, and came across the line of code import Theme from “@swc-react/theme”. This quickly dropped me into the web development education rabbit hole… A quick search shows me that “@swc-react/theme” is React Wrappers for Spectrum Web Components. Another search shows that Spectrum Web Components […]

Part 1: Optimizing Server Performance Speed is a critical factor for the success of any online store, and optimizing your Magento 2 website’s performance can significantly enhance user experience, conversion rates, and search engine rankings. Nobody enjoys a website that loads slowly, and it’s well-known that an ecommerce site with prolonged loading times can result […]

Debugging modern web applications can be a challenging task. Redux DevTools is an excellent tool for tracking state changes and dispatching actions in Redux applications. Combined with source maps in Webpack, you can easily trace back to your original source code, making debugging much more straightforward. In this post, we’ll walk through setting up Redux […]

Webpack is an amazing bundler for JavaScript and, with the correct loader, it can also transform CSS, HTML, and other assets.  When a new AEM project is created via the AEM Project Archetype and the front-end module is set to general, Adobe provides a Webpack configuration to generate the project’s client libraries. Introducing Vite Vite […]

TypeScript offers significant benefits for software development, including improved productivity, code quality, and reliability. It is a useful option for creating contemporary online apps because of its static typing, improved tooling support, and JavaScript compatibility. Error handling is a critical aspect of software development that impacts applications’ reliability, security, and user experience. By implementing robust […]

Story within Story: In Storybook, “Story within Story” means using parts of one story in another. Instead of remaking stuff, developers just import existing stories and use their parts in a new story. This helps make complex UIs by combining simpler parts from different stories, making coding faster and more efficient. Suppose you have two […]