If you made it through the first post in this series you might have noticed two things. One, it was a very long post. Two, the process of getting a result on the page was absurd. The goal of that post was not to show you the best practice in front end development but all …
Continue reading “Setting up and Using Grunt with Less in Magento 2”
For a long time I have been using a little Javascript on Magento 2 sites to open up the Minicart when a customer clicks the “Add to Cart” button. But a few days back i took a second look at this little piece of Javascript and realized there was a better way to do this. …
Continue reading “A great use for Require JS Mixins – The catalog “Add to Cart” trick”
PWA Studio is the official Magento Inc. project to bring full PWA functionality to the Magento e-commerce platform. That is a bit of a mouthful but boiled down it means that the Magento 2 front end is going 100% headless and using React JS as its presentation application. If all or any of that was …
Front end web development has change a lot since the release of Magento 1. Where once the tools and technologies you would use on a daily basis where carved in stone, now there seems to be a new tool (or framework) to learn every couple of days. The primary goal for an eCommerce platform is …
Continue reading “Less in Magento 2 for Front End Developers”
Recently, one of our clients wanted to know if we could change the default sorting direction for the product list on their site. In Magento 2, the default sorting order is ascending, but what if you would like to set it to descending by default? While it would seem like this would be a simple …
Continue reading “Changing Default Product Sorting in Magento 2”
A theme in Magento 2 defines the look and feel of your store, which is what your customers see when they visit a site. It is the domain of the front-end developer and the starting point for almost every tutorial that describes front-end development in Magento 2. Luckily, the task of setting up a theme …
In the last section we talk about the Network tab of the browser. In this post we are going to dig into how to control the way files are output to the browser from Magento. This is going place you in the drive seat of this massive application. Get your crash helmet!!! The Require JS …
Continue reading “Debugging Javascript and Require JS – Part 2”
In the last post we walked through the process of setting up a jQuery slider on a page. To keep the post concise, I passed over some details that I want to flesh out here. The first is a look into what the browser “sees” when we are using Require JS. In the first blog …
Continue reading “Debugging Javascript and Require JS – Part 1”
This is the second in my series of JavaScript in Magento 2. To follow along, I have created a GitHub repo with the starter theme on the master branch and a branch for each article at their finished point. This post will include content for the theme and for cms content. To follow along, checkout …
Continue reading “Adding a jQuery Slider to a Magento 2 Site”
JavaScript is hard. No other way to say it. And the implementation of JavaScript in Magento 2 is even more challenging. Even for seasoned Magento 1 developer or seasoned front end developer, the way Magento has integrated JavaScript into the application has many twists and turns that can stop you dead in your development tracks. …
