Continuing our Plop.js journey from the last blog. Be sure to go back and read the previous installment in this series. In our previous discussion, we explored an introduction to Plop.js and its installation in a Next.js project. Additionally, we looked at a basic skeleton of plopfile.js. Understanding the Components of plopfile.js As we saw […]
Posts Tagged ‘front-end’
Lessons from the Front: Mapping Bootstrap Grid Parameters
Intro 📖 While working on a recent project to migrate a Sitecore 9.1 solution to Sitecore XM Cloud, an interesting situation arose with Bootstrap grid parameters. More specifically, with grid rendering parameters configured on renderings migrated from the legacy 9.1 content tree into the XM Cloud content tree. To start, some (brief?) background on SXA […]
Using TypeScript with React: Best Practices
Nowadays, TypeScript has become the first choice for building scalable and maintainable React applications. By combining the approaches for static typing with dynamic capabilities of React, TypeScript enhances productivity, improves the readability of code and reduces the runtime errors. In this blog, we will explore best practices for using TypeScript in React projects, covering type […]
Adobe Sites: Migrating from Webpack to Vite
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 […]
Angular 17: Maximize Your Development Efficiency and Performance
Angular has long been a leading web development framework, powering countless dynamic websites with its robust features and scalable architecture. However, recent advances in technology have seen other frameworks offering faster, more efficient solutions. With the release of Angular 17, the framework responds with a transformative update, enhancing performance and flexibility. This post will examine […]
useOptimistic: Powering Next.js
In today’s blog, we will examine an experimental hook that helps us display optimized results when we display data we fetch from the server. What can we do to optimize such a use case? Is there a way to show updated data as it is being fetched from the server? We will explore precisely that […]
Advanced Array Methods in JavaScript: Part 3
Welcome back to the third part of our series on elevating your JavaScript skills through array methods. Having established a solid foundation with simple array methods, we’re now poised to tackle more advanced methods. In this blog, we will discover sophisticated array methods that offer greater flexibility and power in manipulating data. Prepare to unlock […]
Exploring AngularJS Routing: A Practical Guide
AngularJS is a widely adopted JavaScript framework, arming developers with a rich arsenal of tools to engineer dynamic and captivating web applications. Notably, its robust routing capabilities emerge as a key pillar for constructing Single Page Applications (SPAs). Effectively orchestrating navigation and dynamically presenting diverse content sans the need for complete page refreshes, AngularJS routing […]
Exploring Basics of React’s useReducer and useRef Hooks
In the vast landscape of React development, developers are armed with powerful tools to navigate challenges effortlessly: the useReducer and useRef hooks. This guide offers a deep dive into these hooks, unveiling their functionalities, adaptable use cases, and advanced methodologies. What is `useReducer`? The <strong>useReducer</strong> hook in React is a cornerstone for managing state, offering […]
Essential Array Methods Guide: Part 2
In continuation of Part 1, we will now delve into essential array methods that enhance your JavaScript toolkit. These methods allow you to effortlessly handle complex data manipulation tasks, opening new possibilities for your projects. isArray() isArray() is your trusty detector for identifying arrays. Just pass any value to Array.isArray(), and it quickly tells you whether […]
Essential Array Methods Guide: Part 1
Arrays are a cornerstone of JavaScript programming, offering a versatile way to keep and manage data. In this initial segment, we`ll explore the essential array methods that every JavaScript developer should know. If you’re eager to advance further, keep an eye out for advanced array methods in JavaScript. Introduction to Essential Array Methods Arrays are […]
useFormState in Next.js: Form Management
In my previous blog, we had discussed using server actions with our forms and managing the loading state with the new useFormStatus hook from react-dom. In this one, we are going to explore another experimental hook from react-dom: useFormState. Concisely, useFormState is a hook to which we provide a function to manipulate form data. The […]