Prepare your Magento environment for checkout development
Before starting development in the checkout process, it is essential to make a few updates and ensure that the development environment is set up correctly within Chrome.
Chrome DevTools Configuration
- Open up Chrome DevTools.
- Go to the Network tab.
- Ensure the “Disable Cache” checkbox is checked. This prevents Google Chrome from caching JavaScript assets while working.
- Make sure Chrome DevTools remains open to prevent cache from re-enabling.
Magento Developer Mode and Cache
- Ensure Magento developer mode is enabled.
- Turn on caches.
- Use Magento cache clean (built into the docker-magento project).
The Magento cache clean is a simple file watcher that automatically cleans any affected cache types, greatly aiding in Magento development.
Admin Configuration Updates
To make the development experience more pleasant, make a few updates within the admin settings.
Updating Default Cookie Settings
- Go to Stores > Configuration.
- Under General > Web, select “Default Cookie Settings.”
- Change “Cookie Lifetime” from the default 3600 seconds (1 hour) to 31536000 seconds (1 year).
- Save the configuration.
Updating Admin Session Lifetime
- Scroll down to Advanced > Admin.
- Under Security, change “Admin Session Lifetime” from 900 seconds (15 minutes) to 31536000 seconds (1 year).
- Save the configuration.
Clearing Cache
- Go to Cache Management.
- Clear any invalidated caches to refresh and apply the updated settings.
PhpStorm Configuration
- Open PhpStorm > Preferences.
- Go to the Plugins section.
- Search for and install the Magento PhpStorm plugin. This plugin aids in IntelliSense, autocomplete, and other helpful features.
- Ensure the plugin is enabled for your project under “PHP Frameworks.”
- Check the “Enable Magento Integration” box and confirm that it displays the correct version number of Magento.
XDebug Setup
It is a great idea to set up XDebug within PhpStorm before attempting any custom work beyond the lessons in this course. If stuck on a particular issue, XDebug can be used to quickly determine the problem.
With these configurations in place, you should be ready to start development.
Enroll to access all lessons, source code & comments.
Enroll now to Unlock