Shopify is a powerful eCommerce platform for developers with over 1,000,000 active merchants, and it’s a vibrant community that offers a ton of opportunities for those who are looking to earn revenue by helping merchants solve problems. As a front–end or back–end developer, you can help merchants with everything from theme development and customisation, to building apps, store design, photography, site security and much more.
With so many possibilities in front of you, it can sometimes be challenging to know where to start working with Shopify. Fortunately, there are many free resources out there to help you get started with the platform and streamline your workflow.
Today here is a summary of some of the most useful free Shopify development tools to help you with your client work.
Theme Kit
Shopify comes bundled with a robust online theme editor, but have you always wanted to work locally with your favourite code editor? Theme Kit was built in-house by Shopify’s theme development team and is a cross-platform tool for building Shopify Themes using your favourite and local code editor.
When you’ve installed Theme Kit, developers can watch for local changes to theme files and upload automatically to Shopify, as well as upload themes to various environments. It’s compatible with Linux, Mac and Windows, and can be used to connect with an existing theme or to create a new theme from scratch.
Shopify Liquid code examples
Often one of the best way to learn is through example, so seeing how to implement common theme components is an excellent way to learn about how Shopify themes work and to help developers gain this insight, Shopify has created a library of code examples that cover all the touchpoints of an online store.
These Shopify Liquid Code Examples are here to help to inform to you how various Liquid objects, properties and filters work together as part of components within a theme. Developers can even add these examples directly into their Shopify themes, to allow you to build and customise themes quicker and reliably.
These code examples cover over seven categories, and the library demonstrates some of the most significant store elements such as accessible pagination, product pages and checkout forms.
Liquid Cheat Sheet
The backbone of every Shopify Themes is Liquid, a templating language which uses a mixture of tags, objects and filters to load dynamic Shopify content. This cheat sheet is a searchable database of all the Liquid objects, tags and filters demonstrate simple examples and links to reference documentation.
If you are new to Liquid and theming, then this cheat sheet will help you locate any Liquid elements and will become an essential part of your theme development workflow. This resource has been updated to include the new additions to Liquid so that developers will have access to all examples to all Liquid elements that are in production.
Polaris
Creating and selling a Shopify App is a powerful method for adding new features, plugins and services to a merchant’s online store, but making your Shopify App look like native components can be time-consuming, and that is where Polaris comes into play.
Polaris is Shopify’s design system, and that has a React library with HTML/CSS options as well as a downloadable UI kit which enables developers to build consistent experiences for their apps, this is more than just a developer’s toolkit, the resources in Polaris’s style guide articulate best practices in UX and rationale to ensure a unified visual language.
The guidelines additionally offer advice on how to build apps that follow accessibility best practices, as well as looking at internationalisation considerations to allow your interfaces to be used in every part of the world.
Shopify App CLI
The process for setting up the scaffolding code during app development can be time-intensive and requires some steps before you can get started adding functionality to your app.
This Shopify App CLI is a command-line tool that was designed to reduce the amount of work you needed to get an app up and running, so you can concentrate on building out the features of your app.
This CLI tool not only automates many routine tasks in the development process, but it let’s you add common features to your app, including billing models and web-hooks. Once you’ve installed this, it will create a command that will scaffold a new Shopify App in your current active directory and generate all the basic starter files.
Also, it adds dummy data into your development store so you can test your app thoroughly, by populating your development store with products, customers and orders, so you can have a more realistic environment.
Slate
Similar to Theme Kit, Slate been designed to support theme developers with their workflow and speed up the process of developing, testing and deploying Shopify themes.
Slate helps developers by providing a tested workflow and reliable development toolkit, while also providing more established developers through advanced configuration.
By default, Slate generates a new project using the Shopify Starter Theme, but developers can create their own starter theme which has specifically structured to be used as a starting point for a new project.
Also it uses Theme Kit to watch and update themes, so you can use Slate as part of your theme editing workflow. It also has build script that compiles the theme so that it is fully optimised to run in production. These optimisations include JavaScript, CSS and Minified HTML.
Shopify Partner Academy
Shopify Partner Academy is an online training and certification program that can be accessed through the Shopify’s Partner Dashboard. This online courses cover a wide range of topics including theme and app development, and also include non-technical subjects such as project management, marketing and store operations.
This academy also allows developers to test their knowledge and earn certifications that can be used to verify your expertise in theme or app development. Once you’ve passed these exams, a certification badge will appear in your Partner Dashboard.
