Front-End Development

When you work at Perficient, you’re never “in it alone.” We pride ourselves on having a collaborative, supportive environment dedicated to fostering both career and personal growth. Perficient’s Agile Community is one of the latest ways colleagues can connect with each other, breaking down walls and collaborating globally in a whole new way. “It makes […]

While there aren’t too many things to highlight in the new React JS 17 release, there are a few new high-sway enhancements to the React JS Core. The Newest Enhancements The compilation method for React JS is the most interesting improvement. Let’s look at the compiled code of JSX in a component that uses an […]

The ability to show/hide an HTML element should be simple enough, right? Well, we can use some HTML attributes and JavaScript functions if we want to, but what if we want to do perform this task without using JavaScript. Is it possible? Yes, it is possible. We can do it with just CSS. Yes, you […]

There is always the question that runs in the mind of developers, do I choose ternaries or logical && to use in React? Personally, I always prefer logical && over ternaries to handle the truth condition. Let me explain why. Just a few days ago, I was writing the following React code: import React from […]

In my latest AEM project, I had a particular challenge with some front-end code, an AJAX call, and CORS.   While running the site on localhost, the search code attempted to make an AJAX call to a search API. The API would not allow my localhost site. This meant that front-end developers had a hard […]

When Sitecore Experience Accelerator (SXA) was launched, it was a real game-changer for the rapid implementation of Sitecore sites and for marketers wanting more freedom and control over creating content and campaign pages. SXA Themes also allow sites to share a standard site layout while making sure that the site has the right look and […]

Recently, I worked on one bug where GTM tracking was breaking for an embedded YouTube video with a custom play button. The video played perfectly fine on the click of the play button, but it was not getting tracked by GTM. I didn’t find anything wrong in the code, so I researched and found that […]

Heading Overview  For those that may not be familiar with heading levels, here is a quick run-down. Titles on your web page will have heading (<H>) tags to indicate their level of importance. Web developers use <H> tags for page titles to structure the content of the page. Not only are <H> tags used for […]

Recently, I published a blog post regarding AEM Customization: Show Unpublished Reference Alert for Content Path where I showed how to customize the Pathfield and Xffield resourceType. In doing this, I was able to showcase how to create a notification for the content author as to whether the selected content path is published or not. […]

The CSS transform property allows a developer to perform a number of different actions on an element that changes how that element appears in the browser.  While the realm of possibilities for what you can do with one or more of the transform values is very large, here are some common uses to save time […]

HTML5 semantic sectioning elements are great for identifying page structure. Landmark elements such as <header> <nav> <main> <footer> <aside> <section> <article> and <form> are much easier to identify than a sea of <div>s, and provide accessible structure for screen reader users without having to add any ARIA attributes. Using these elements properly helps developers understand […]

Lazy loading images is a technique for modern web developers where you instruct the client’s browser to only download images as they are needed.  This leads to tremendous performance improvements, as client devices do not waste bandwidth downloading assets which are not being rendered.  To achieve this, we’ll use some client side mechanisms from css-tricks.com […]