During uncertain times, it’s more important than ever to know when to pivot your business, search for new developer resources, and expand your skill set. As a web developer, you need to examine the current landscape and identify the most important, high-impact skills that will help your business remain relevant and suit your clients’ changing needs. Enhancing your marketable skills will allow you to add extra value to new projects and empower you to support your clients throughout COVID-19 and beyond.
You may also find that you have more time on your hands than you scheduled for. Why not make the best of this situation by learning a new skill, or branching out in a new direction?
With all this in mind, I spent some time polling staff here at Shopify and took suggestions from our partner community on their top educational recommendations. The result is a list of 30 helpful resources to diversify your skill set and expand your technical abilities.
To make things a bit easier, I've arranged the resources into the following categories:
In this article
Running webinars and digital meetups
1. Setting Up Webinars for Learner Engagement
In this two-part series, Shopify's own Kerry O'Brien outlines various techniques to create a professional atmosphere for your digital event, and a list of what to prepare ahead of time. Once you've located the perfect space and assembled the right equipment, you can consider extra flourishes like music or a waiting room. From testing audio to arranging screens, Kerry's recommendations cover everything you need to know to get started running webinars. You can catch the second part of the series on LinkedIn.
2. How to Create a Webinar to Teach, Connect, and Grow Your Audience
This guide from ConvertKit is a comprehensive collection of articles exploring different formats to fit your audience and goals, as well as promotional ideas for attracting the right audience. One (often overlooked) aspect that's highlighted is the specific metrics you should track when running webinars, including registrant-to-attendee rate, registration page conversion, and replay view rates.
3. How to Host a Successful Virtual Event: Tips and Best Practices
In this blog post by the team at Hootsuite, Katie Sehl looks at not only webinars, but also Ask Me Anything sessions (AMAs) as a tool to quickly broadcast to an existing audience using platforms like Twitter and Facebook. Leveraging experts to share their knowledge in a live question-and-answer session is a great option, as are including interactive trivia games and contests to keep livestream events engaging.
4. Tips on Running Online Meetings and Events
Based in the UK, the Digital Curation Centre focuses on skills for research data management. Their guide is full of insights they've learned about the functionality of different video sharing platforms. As the report notes, “technology has improved vastly in recent years and is making it far more feasible to work remotely and run virtual events. The potential benefits of this are huge, not least for sustainability and global connections.”
5. How to Host a Virtual Company Hackathon
Larger agencies should consider internal digital events to keep the team aligned—and hackathons are a great way to gather staff together for cross-team collaboration on short-term projects. With so many companies turning to remote working, virtual hackathons can be a great way to enhance employee culture. This article from Built In discusses how to position a hackathon to make the most of the opportunity, as well as formulating guidelines and accommodating for different time zones.
6. Online Networking for Shopify Partners is at its Peak: Are You Joining In?
This article from the Partner League challenges us to think beyond webinar-style presentations and consider creating smaller group discussions that can encourage better interaction. These intimate, invitation-based meetups have the potential to grow business networks and spark conversations that lead to professional partnerships. These online meetups or roundtables can be centered around a specific topic, and the article links out to various online Shopify communities that you can join to be part of these conversations.
You might also like: Handshakes to Headsets: A Guide to Running Virtual Events.
Learning GraphQL
7. The Guide to Learn GraphQL I Wish I Found a Few Months Ago
When learning any new language, it can be a daunting task to find a starting point. This Medium article is a suggested learning guide for GraphQL, curated by a developer who found himself struggling to understand its fundamental concepts. Starting with some introductory videos to get you motivated, Kalin lists the sequence of topics that he considers the most important. From learning how to get to grips with syntax to using Apollo, this guide shows a recommended learning flow from someone who's recently learned themselves.
8. How to GraphQL
How to GraphQL describes itself as “the free and open-source tutorial to learn all around GraphQL to go from zero to production”, which makes it an essential resource for working with this language. The tutorial takes the form of a series of videos alongside supporting documentation and code examples, with fun short quizzes to unlock new chapters. There's also a practical aspect to this course, with tutorials that show you how to create simple apps using GraphQL clients, as well as running queries and writing mutations.
You might also like: The Shopify GraphQL Learning Kit.
9. GraphQL Full Course—Novice to Expert
This YouTube video is a four-hour crash course in GraphQL. It links out to course files on a GitHub repo that you can download and use. By the end, you'll have built a full-stack application from scratch using a GraphQL server on Node.js, with a React front-end, and storing data on MongoDB. In the words of one commenter, “I had watched several videos for GraphQL, I have to say this is so far the best ... actually best of the best.”
10. Shopify's GraphQL Learning Resources
For a more Shopify-specific approach to working with GraphQL, our own developer documentation provides guidance for using GraphQL in your Shopify apps. You can install the Shopify GraphQL app to explore the GraphQL Admin API and run queries and mutations against one of your development stores, or follow a tutorial to build a Shopify app with Node and React.
Headless commerce
11. Headless Commerce is Flexible Commerce
One of the major trends we noted earlier this year, headless commerce involves freeing the front and back-ends of sites from each other so that merchants can have more control over storefront customization. This article from our Plus blog is a deep dive into the benefits of going headless, along with some case studies of Shopify brands who've explored this path. Primarily aimed at enterprise-level merchants, this article is the perfect primer for learning what the headless approach involves, and even includes a handy checklist to determine if it’s the right fit for your clients.
12. Optimizing Ecommerce with Gatsby
This recorded webinar from the team at Gatsby sets out the business case for headless commerce and demonstrates how to use Shopify as the back-end of an ecommerce store that's integrated with Gatsby. Shopify's Storefront API along with its range of apps and secure checkout make it a perfect fit for Gatsby, and this webinar shows practical examples of how both platforms are used in tandem. This video is especially helpful to developers who want a view under the hood: Thomas Slade, VP of Engineering at Shopify Partner Agency Elevar, outlines their project plan when integrating and deploying a Shopify store with Gatsby.
13. Headless Shopify Introduction with Examples of Headless Shopify and Shopify Plus Implementations
Paul Rodgers was an early adopter of the headless approach, and here he showcases a range of different brands using Shopify in the headless context. As Paul himself puts it, ‘This article is designed to provide an introduction into how Shopify can be used in a headless manner, as well as answer some top-level questions around the impact and good use cases.” In addition to running through the pros and cons of headless, Paul presents a wide range of headless stores, operating in different industries and at different scales, so you can see for yourself what this could look like for your clients.
Applying accessibility
14. Hacking Digital Style Guides for Accessibility: Type, Colour, Imagery
Designer Tatiana Mac has kindly made her accessibility course available for free on YouTube, so you can learn how to consider accessibility in your style guides and design systems from the outset of your projects. During the 42 minutes of this class, Tatiana explores the basics of accessibility, linking out to helpful resources as well as providing a primer to accessible design and how it impacts businesses.
15. Creating Accessible Themes
In case you missed it the first time around, now's a great time to watch Tiffany Tse and Nathan Ferguson discuss how Shopify’s Themes Team approaches accessibility. This recording from Unite 2018 looks at common ecommerce tasks, like selecting product options or modifying a cart, and explains how they can be challenging for buyers with disabilities. Ultimately, this talk proves that an accessible web is for everyone. As developers and designers, we share a collective responsibility to build with accessibility in mind.
16. Deque Accessibility Training
Billing themselves as “the most comprehensive digital accessibility training on the web”, Deque provides instructor-led education as well as online, self-paced training. Their modules address all aspects of accessibility for websites and apps, beginning with the fundamentals and ramping all the way up to more advanced techniques for designing user interfaces. They also offer certification to prove your expertise.
17. 24 Accessibility
It may not be Christmas anymore, but that doesn't mean we can't celebrate accessibility with 24 Accessibility, which showers readers with digital accessibility gifts during the holiday season of giving and sharing. Each entry has strong practical value from working with and testing color ratios, to ensuring project documentation is accessible. Every article is written by a different expert in web design and development, including a contribution from Shopify's own Devon Persing. You can also travel back in time to previous years and learn tips and tricks from the archive.
You might also like: Universal Design: 11 Practical Tips to Make Your Sites and Apps More Accessible.
Marketing your business
18. How Podcasting Will Help Connect You With More Agency Clients
Recommended by Ash Ome from Shopify Partner Agency Motif, this podcast on podcasting (so meta!) runs through how to connect with and convert new clients, using engaging content and avoiding ‘salesy’ techniques. This specific podcast features Mark Lipsky, founder of The Radio Agency, who has a lifetime of experience working with audio in a marketing context. Learn how to stand out from the crowd, and connect with the right audience.
19. The Complete A/B Testing Kit
This ebook from HubSpot is a comprehensive guide to using A/B testing for marketing optimization. Of particular interest to the Shopify Partner community is its practical advice on how to use split tests to optimize landing pages, email marketing, and calls-to-action. Some of the great lessons here will help you improve the validity of your tests by focusing on one variable at a time, choosing the best visuals for your client's brand, and analyzing your data effectively.
20. Take Charge, Be a Voice of Reason and Keep Publishing
The team at Animalz ask the question: should you continue publishing content during the COVID-19 crisis? And the answer is a resounding yes. In this considerate and encouraging blog post, marketers are encouraged to approach their work with empathy and authenticity. You can provide your audience with a lot of value in times of uncertainty, and Animalz suggests focusing on content that helps, rather than content optimized for keywords.
21. The Ecommerce Playbook: Numbers, Struggles & Growth
With a strong focus on ecommerce, podcast host Andrew Faris details the ups and downs of marketing. His recent podcast episodes have looked at how brands are responding to COVID-19, and how sometimes constraints can generate creativity. With over 150 episodes that touch on all the various aspects of ecommerce marketing in a transparent and original way, there's a lot to dive into here.
22. Blogging for Business
Recommended to me by Ciarán Oglesby, the Blogging for Business video guide from Ahrefs Academy explores how to match business value with content ideas, how to promote your blog, and much more. Over five hours and 10 videos, you'll learn all you need to know about building a robust content marketing strategy for you or your client’s new blog. Of particular interest is the science behind ranking keywords and how to test your article ideas for “search demand”.
Improving storefront performance
23. How Browsers Work: Behind the Scenes of Modern Web Browsers
If you've ever been interested in learning the internal workings of browser operations, this comprehensive and detailed guide recommended by Helen Lin, Web Development Manager at Shopify, is for you. By examining the individual components of web browsers, we're given a rare view into the engines that power our online experiences. Understanding how browsers work is a huge asset when trying to improve website performance, so diving into this guide is well worth it!
24. How to Debug Liquid Render Performance with Shopify Theme Inspector for Chrome
If you haven't started using Shopify's Theme Inspector for Chrome, now's the perfect time to get this up and running to test your theme code. This blog post shows you how to get started using this developer tool, and identifies specific areas where your themes may be causing slow loading times. Once installed, you can run tests and see reports of total time to render Liquid as well as which elements contribute the most to the total page render time.
25. Fast Load Times
This free online course from Google Developers collects 41 different learning resources that will teach you all you need to know about website performance. From introductory lessons on how to measure site speed to setting performance budgets and asset optimization, this course covers all the aspects of performance in an easy-to-digest format.
You might also like: How to Refactor a Shopify Site for Javascript Performance.
General front-end development resources
26. Syntax
We're huge fans of Wes Bos here at Shopify. His podcast, co-hosted with Scott Tolinski, is a firm favorite with our devs. Their combined experience not only in front-end development but also in creating learning resources makes this a super insightful podcast, and covers a variety of topics including security, headless websites, developer tooling, and more. A recommended listen for sure!
27. Code Ecommerce
Created by design agency Up at Five, this set of two video tutorials are currently free to access (for a limited time), and cover essential topics around theme customization and app development for Shopify. The theme tutorial demonstrates how to integrate React.js with Shopify's Storefront API to create a simple Product page and cart pop-out. But if app development is more your thing, you can learn how to create a ‘Lookbook’ app that allows merchants to choose from photos and add text using Rails, the Shopify App Gem, and Polaris.
28. Developer Tea
Developer Tea is a podcast with bite-sized episodes, designed to fit into your tea break. Recommended by Christopher Marlow, Senior Web Developer at Shopify, he says, “one of the reasons I really like the podcast is because the episodes are short and concise at 8—12 minutes each. It covers a lot of developer topics without talking directly about code, like productivity, career goals, mentoring, and pairing.”
29. How Should Designers Learn to Code?
This two-part guide from the brilliant folks at Smashing answers the age-old question of how designers should learn to code, with an accessible entry point that fans of Helvetica can use to get up and running quickly. The guide gives a great overview on terminal commands, regular expressions, and how to work with text editors, so it's bound to be an essential resource to any designers who’d like to gain some programming skills.
30. The Default Podcast
Last, but by no means least, the Default podcast is a great way to keep up to date with Shopify developer news from veterans Keir Whitaker and Keiran Masterton. In each episode, both experts examine API changes and feature rollouts, and bring you insights from agency owners, app developers, and Shopify team members. Always engaging, these two gentlemen have their fingers on the pulse, making this an unmissable podcast.
You might also like: A CSS Grid Framework for Shopify Collection Pages.
Developer resources: expand your skills, improve yourself, and win more clients
There's no shortage of developer-focused learning resources when you're looking to diversify your skillset. This list is just the beginning—let us know what we missed!
Taking up a new skill or growing your knowledge in a specific area is never easy, and it’s even more difficult while dealing with a global pandemic. But hopefully, this article will help you find guidance and inspiration when navigating these unpredictable waters. Consider which areas you can improve in that will provide the greatest benefit for both you and your clients as you review the list of developer resources.
In the words of author Louisa May Alcott, “I am not afraid of storms for I am learning how to sail my ship.”
Have fun learning!
COVID-19 Response for Shopify Partners
Solidarity and community bring us together. Learn how you can stay connected to the Shopify Partner ecosystem, adjust to these complicated times, and help your clients and users along the way.
Read moreRead more
- The 20 Best Visual Studio Code Extensions for Front End Developers
- How To Use Translation Keys To Create Internationalized Themes
- How to Add CSS Text Animation to Custom Themes
- Free Webinar] Getting Started with Sass and Shopify
- How to Get Published in the Shopify Theme Store
- Add Products Faster With Product CSVs
- A Modern Approach to CSS Pt. 2: Building Resources
- What's New in HTML: 6 Native Elements You Can Use Today
- How to Use PWA and AMP for User Centered Design