A place to cache linked articles (think custom and personal wayback machine)
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

index.html 23KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280
  1. <!doctype html><!-- This is a valid HTML5 document. -->
  2. <!-- Screen readers, SEO, extensions and so on. -->
  3. <html lang="fr">
  4. <!-- Has to be within the first 1024 bytes, hence before the `title` element
  5. See: https://www.w3.org/TR/2012/CR-html5-20121217/document-metadata.html#charset -->
  6. <meta charset="utf-8">
  7. <!-- Why no `X-UA-Compatible` meta: https://stackoverflow.com/a/6771584 -->
  8. <!-- The viewport meta is quite crowded and we are responsible for that.
  9. See: https://codepen.io/tigt/post/meta-viewport-for-2015 -->
  10. <meta name="viewport" content="width=device-width,initial-scale=1">
  11. <!-- Required to make a valid HTML5 document. -->
  12. <title>Technical Mentorship Reimagined: Time-bound and No Awkward Asks Necessary (archive) — David Larlet</title>
  13. <meta name="description" content="Publication mise en cache pour en conserver une trace.">
  14. <!-- That good ol' feed, subscribe :). -->
  15. <link rel="alternate" type="application/atom+xml" title="Feed" href="/david/log/">
  16. <!-- Generated from https://realfavicongenerator.net/ such a mess. -->
  17. <link rel="apple-touch-icon" sizes="180x180" href="/static/david/icons2/apple-touch-icon.png">
  18. <link rel="icon" type="image/png" sizes="32x32" href="/static/david/icons2/favicon-32x32.png">
  19. <link rel="icon" type="image/png" sizes="16x16" href="/static/david/icons2/favicon-16x16.png">
  20. <link rel="manifest" href="/static/david/icons2/site.webmanifest">
  21. <link rel="mask-icon" href="/static/david/icons2/safari-pinned-tab.svg" color="#07486c">
  22. <link rel="shortcut icon" href="/static/david/icons2/favicon.ico">
  23. <meta name="msapplication-TileColor" content="#f7f7f7">
  24. <meta name="msapplication-config" content="/static/david/icons2/browserconfig.xml">
  25. <meta name="theme-color" content="#f7f7f7" media="(prefers-color-scheme: light)">
  26. <meta name="theme-color" content="#272727" media="(prefers-color-scheme: dark)">
  27. <!-- Documented, feel free to shoot an email. -->
  28. <link rel="stylesheet" href="/static/david/css/style_2021-01-20.css">
  29. <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. -->
  30. <link rel="preload" href="/static/david/css/fonts/triplicate_t4_poly_regular.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)" crossorigin>
  31. <link rel="preload" href="/static/david/css/fonts/triplicate_t4_poly_bold.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)" crossorigin>
  32. <link rel="preload" href="/static/david/css/fonts/triplicate_t4_poly_italic.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)" crossorigin>
  33. <link rel="preload" href="/static/david/css/fonts/triplicate_t3_regular.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin>
  34. <link rel="preload" href="/static/david/css/fonts/triplicate_t3_bold.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin>
  35. <link rel="preload" href="/static/david/css/fonts/triplicate_t3_italic.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin>
  36. <script>
  37. function toggleTheme(themeName) {
  38. document.documentElement.classList.toggle(
  39. 'forced-dark',
  40. themeName === 'dark'
  41. )
  42. document.documentElement.classList.toggle(
  43. 'forced-light',
  44. themeName === 'light'
  45. )
  46. }
  47. const selectedTheme = localStorage.getItem('theme')
  48. if (selectedTheme !== 'undefined') {
  49. toggleTheme(selectedTheme)
  50. }
  51. </script>
  52. <meta name="robots" content="noindex, nofollow">
  53. <meta content="origin-when-cross-origin" name="referrer">
  54. <!-- Canonical URL for SEO purposes -->
  55. <link rel="canonical" href="https://shopify.engineering/technical-mentorship-reimagined">
  56. <body class="remarkdown h1-underline h2-underline h3-underline em-underscore hr-center ul-star pre-tick" data-instant-intensity="viewport-all">
  57. <article>
  58. <header>
  59. <h1>Technical Mentorship Reimagined: Time-bound and No Awkward Asks Necessary</h1>
  60. </header>
  61. <nav>
  62. <p class="center">
  63. <a href="/david/" title="Aller à l’accueil"><svg class="icon icon-home">
  64. <use xlink:href="/static/david/icons2/symbol-defs.svg#icon-home"></use>
  65. </svg> Accueil</a> •
  66. <a href="https://shopify.engineering/technical-mentorship-reimagined" title="Lien vers le contenu original">Source originale</a>
  67. </p>
  68. </nav>
  69. <hr>
  70. <p>Struggling with a concept and frantically trying to find the answers online? Are you thinking: <em>I should just ping a teammate or Is this something I should already know? That’s fine, I’ll ask anyway. </em>And then you do ask and get an answer and are feeling pretty darn proud of yourself and move forward. <em>But wait, now I have about 25 follow-up questions. </em>Sound familiar?</p>
  71. <p>Or how about the career growth questions that can be sometimes too uncomfortable asking your lead or manager? <em>Oh, I know, I’ll take them to reddit. But wait, they have no company context. </em>Yeah, also familiar. <em>I know. I should get a mentor! But darn. I’ve heard so many stories… Who do I approach? Will they be interested? What if they reject me? And what if it’s not working out?</em></p>
  72. <p>Shopify is a collaborative place. We traditionally <a href="https://shopify.engineering/pair-programming-explained" target="_blank" title="Pair Programming Explained - Shopify Engineering" rel="nofollow noopener noreferrer">pair with other developers</a> and conduct code reviews to level up. This approach is great for just-in-time feedback and unblocking us on immediate problems. We wanted to continue this trend and also look at how we can support developers in growing themselves through longer term conversations.</p>
  73. <p>We surveyed our developers at Shopify and learned that they:</p>
  74. <ul>
  75. <li>Love to learn from others at Shopify</li>
  76. <li>Are busy people and find it challenging to make dedicated time for learning</li>
  77. <li>Want to grow in their technical and leadership skills.</li>
  78. </ul>
  79. <p>These findings birthed the idea of building a mentorship program targeted at solving these exact problems.<strong> Enter Shopify’s Engineering Mentorship Program. </strong>Shopify’s RnD Learning Team partnered with developers across the company to design a unique mentorship program and this guide walks readers through the structure, components, value-adds, and lessons we’ve had over the past year.</p>
  80. <h1>Gathering Participants</h1>
  81. <p>Once a quarter developers get an email inviting them to join the upcoming cycle of the program and sign up to be a mentee, mentor, or both. In addition to the email that is sent out, updates are posted in a few prominent Slack channels to remind folks that the signup window for the upcoming cycle is now open.</p>
  82. <p>When signing up to participate in the program, mentees are asked to select their areas of interest and mentors are asked to select their areas of expertise. The current selections include:</p>
  83. <ul>
  84. <li>Back-end</li>
  85. <li>Data</li>
  86. <li>Datastores</li>
  87. <li>Front-end</li>
  88. <li>Infrastructure</li>
  89. <li>Mobile - Android</li>
  90. <li>Mobile - iOS</li>
  91. <li>Mobile - React Native</li>
  92. <li>Non-technical (leadership, management).</li>
  93. </ul>
  94. <p>Mentors are also prompted to choose if they are interested in supporting one or two mentees for the current cycle.</p>
  95. <h1>Matching Mentors and Mentees</h1>
  96. <p>Once the signup period wraps up, we run an automated matching script to pair mentees and mentors. Pairs are matched based on a few criteria:</p>
  97. <ul>
  98. <li>Mentor isn’t mentee's current lead</li>
  99. <li>Mentor and mentee don’t report to same lead</li>
  100. <li>Aligned areas of interest and expertise based on selections in sign-up forms</li>
  101. <li>Mentee job level is less than or equal to mentor job level.</li>
  102. </ul>
  103. <p>The matching system intentionally avoids matching based upon criteria such as geographic location or department to broaden the developer’s network and gain company context they would have otherwise not been exposed to.</p>
  104. <p>Pairs are notified by email of their match and invited to a kickoff meeting where organizers welcome participants, explain the program model and value that they will receive as a mentor or mentee, and answer any questions.</p>
  105. <h1>Running the Six Week Program Cycle</h1>
  106. <p>Each program cycle runs for six weeks and pairs are expected to meet for approximately one hour per week.</p>
  107. <figure><img alt="Shopify’s Engineering Mentorship Program overview" data-src="https://cdn.shopify.com/s/files/1/0779/4361/files/Shopify_Engineering_Mentorship_Program_overview.jpg?v=1612976625" class="lazyload">
  108. <figcaption>Shopify’s Engineering Mentorship Program overview</figcaption>
  109. </figure>
  110. <p>The time bound nature of the program enables developers to try out the program and see if it’s a good fit for them. They can connect with someone new and still feel comfortable knowing that they can walk away, no strings attached.</p>
  111. <p>The voluntary signup process ensures that developers who sign up to be a mentor are committed to supporting a mentee for the six week duration and mentees can rest assured that their mentor is keen on supporting them with their professional growth. The sign-up emails as well as the sign-up form reiterate the importance of only signing up as a mentor or mentee if you can dedicate at minimum an hour per week for the six week cycle.</p>
  112. <h2>Setting Goals</h2>
  113. <p>In advance of the first meeting, mentees are asked to identify technical skills gaps they want to improve. During their first meeting, mentees and mentors work together building a tangible goal that they can work towards over the course of the six weeks. Goals often change and that’s expected.</p>
  114. <p>Through the initial kickoff meeting and weekly check-ins via Slack, we reinforce and reiterate throughout the program that the goal itself is never the goal, but an opportunity to work towards a moving target.</p>
  115. <p>Defining the goal is often the most challenging part for mentees. Mentors take an active role in supporting them craft this—the program team also provides tons of real examples from past mentees.</p>
  116. <h2>Staying Connected as a Group</h2>
  117. <p>Outside of the one on one weekly meetings between each pairing of mentor and mentee, the broader mentorship community stays connected on Slack. Two Slack channels are used to manage the program and connect participants with one another and with the program team.</p>
  118. <p>The first Slack channel is a public space for all participants as well as anyone at the company who is curious about the program. This channel serves the purpose to advertise the program and keep participants connected to each other as well as to the program team. This is done by regularly asking questions and continuously sharing their experiences of what’s working well, how they’ve pivoted (or not) from their initial goals, and any general tips to support fellow mentors and mentees throughout the program.</p>
  119. <p>The second Slack channel is a private space that is used exclusively by the program team and mentors. This channel is a space for mentors to be vulnerable and lean on fellow mentors for suggestions and resources.</p>
  120. <h2>Preparing the Participants with a Guidebook</h2>
  121. <p>Beyond the Slack channels, the other primary resource our participants use is a mentorship guidebook that curates tips and resources for added structure. The program team felt that a guidebook was an important aspect to include for participants who were craving more support. While it is entirely an optional resource to use, many first time mentors and mentees find it to be a helpful tool in navigating an otherwise open ended relationship between themselves and their match. It includes tips on sample agendas for your first meeting, example goals, and ways to support your mentee. For example, invite them to one of your meetings and debrief afterwards, pair, or do a code review.</p>
  122. <h1>Growing Mentor’s Skills Too</h1>
  123. <p>Naturally teaching someone else a technical concept helps reinforce it in our own minds. Our mentors constantly share how they’ve found the program helps refine their craft skills as well:</p>
  124. <p><em>“Taking a step back from my day-to-day work to meet with [them] and chatting about career goals at a higher level, gave me more insight into what I personally want from my career path as well.”</em></p>
  125. <p>The ability to mentor others in their technical acumen and craft is a skill that’s valued at Shopify. As engineers progress in their career here, being an effective mentor becomes a bigger piece of what’s expected in the role. The program gives folks a place to improve both their mentorship and leadership skills through iteration.</p>
  126. <p>Throughout the program, mentors receive tips and resources from engineering leaders at the company that are curated by the program team and shared via Slack, but the most valuable piece ends up being the support they provide each other through a closed channel dedicated to mentors.</p>
  127. <p>Here’s an actual example of how mentors help unblock each other:</p>
  128. <div>
  129. <p><strong>Mentor 1</strong>: <em>Hey! Im curious to know how y’all are supporting your mentees in coming up with a measurable goal? My mentee’s original goal was “learn how Shopify core works” and we’ve scoped that down to “learn how jobs are run in core” but we still don’t have it being something that’s measurable and can clearly be ticked off by the end of the 6 weeks. They aren’t the most receptive to refining the goal so I’m curious how any of you have approached that as well?</em></p>
  130. </div>
  131. <div>
  132. <p><strong>Mentor 2</strong>: <em>Hmmm, I’d try to get to the “why” when they say they want to learn how Shopify core works. Is it so they can find things easier? Make better decisions by having more context? Are they interested in why it’s structured the way it is to inform them on future architecture decisions? Maybe that could help in finding something they can measure. Or if they’re just curious, could the goal be something like being able to explain to someone new to Shopify what the different components of the system are and how they interact? Or they’re able to create a new job in core in x amount of time?</em></p>
  133. </div>
  134. <div>
  135. <p><strong>Mentor 3</strong>: <em>If you've learned how something works, you should be able to tell someone else. So I turn these learning goals into a goal to write a wiki page or report, make a presentation, or teach someone else one on one.</em></p>
  136. </div>
  137. <div>
  138. <p><strong>Mentor 1</strong>: <em>Thanks for all the replies! I surfaced adapting the learning goal to have an outcome so they've decided on building an example that can be used as documentation and shared with their team. They're writing this example in the component their team maintains as well which will help in "learn how Shopify works" as they weren't currently familiar with the component</em>.</p>
  139. </div>
  140. <h1>Gathering Program Feedback</h1>
  141. <p>At the end of the six weeks mentees and mentors are asked to provide constructive feedback to one another and the program officially comes to a close. </p>
  142. <p>Program participants receive a feedback survey that helps organizers understand what’s working well and what to revise for future cycles. Participants share</p>
  143. <ul>
  144. <li>Whether they would recommend the program to someone else or not</li>
  145. <li>What the best part of the program was for them</li>
  146. <li>What they would like to see improved for future cycles.</li>
  147. </ul>
  148. <p>Tweaks are made within a short month or so and the next cycle begins. A new opportunity to connect with someone else, grow your skills, and do it in a time-bound and supportive environment.</p>
  149. <h1>What We’ve Learned in 2020</h1>
  150. <p>Overall, it’s been working well. The type of feedback we receive from participants is definitely share-worthy:</p>
  151. <p><em>“was phenomenal to learn more about Production Engineering and our infrastructure. Answered hundreds of mind-numbing questions with extreme patience and detail; he put in so much time to write and share resources—and we wrapped up with a live exercise too! I always look forward to our sessions and it was like walking into a different, fantasy-like universe each time. Hands down the best mentoring experience of my professional career thus far.” </em>- Senior Developer</p>
  152. <ul>
  153. <li>We’ve had 300+ developers participate as mentees and 200+ as mentors.</li>
  154. <li>98% of survey respondents indicated that they would recommend the program to someone else.</li>
  155. <li>The demand is there. Each cycle of the program we have to turn away potential mentees because we can’t meet the demand due to limited mentors. We are working on strategies to attract more mentors to better support the program in 2021.</li>
  156. </ul>
  157. <p>The themes that emerged in terms of where participants found the most value are around:</p>
  158. <ul>
  159. <li>
  160. <strong>Building relationships</strong>: getting to know people is hard. Getting to know colleagues in a fully remote world is near impossible. This program helps.</li>
  161. <li>
  162. <strong>Having dedicated time for learning set aside each week:</strong> we’ve all got a lot to do. We know that making time for learning is important, but it can easily fall on the back burner. This program helps with that too.</li>
  163. <li>
  164. <strong>Developing technical craft skills</strong>: growing your technical chops? Say no more.</li>
  165. <li>
  166. <strong>Developing skills as a teacher and mentor</strong>: getting better at supporting peers can be tricky. You need experience and a safe space to learn with real people.</li>
  167. <li>
  168. <strong>Gaining broader Shopify context:</strong> being a T-shaped developer is an asset. By T-shaped we are referring to the vertical bar of the “T” as the areas the developer is an expert in, while the horizontal bar refers to areas where the developer has some breadth and less depth of knowledge. Getting outside of our silos and learning about how different parts of Shopify work helps build stronger developers and a stronger team.</li>
  169. </ul>
  170. <p>Reinvesting in the developers at Shopify is one way that we help individuals grow in their careers and increase the effectiveness of our teams.</p>
  171. <p>Some great resources that inspired us:</p>
  172. <div class="marketing-block marketing-block--light marketing-block--padded">
  173. <p><a href="https://www.linkedin.com/in/naqsar/" target="_blank" title="Sarah Naqvi on LinkedIn" rel="nofollow noopener noreferrer">Sarah is a Senior Program Manager</a> who manages Engineering learning programs at Shopify. For the past five years, she has been working on areas such as designing and building the initial version of the Dev Degree program to now designing and delivering the Engineering Mentorship Program. She is focused on helping our engineers develop their professional skills and creating a strong Engineering community at Shopify.</p>
  174. </div>
  175. <hr>
  176. <p>We're planning to DOUBLE our engineering team in 2021 by hiring 2,021 new technical roles (see what we did there?). Our platform handled record-breaking sales over BFCM and commerce isn't slowing down. <a href="https://www.shopify.com/careers/2021?itcat=EngBlog&amp;itterm=Post" target="_blank">Help us scale &amp; make commerce better for everyone</a>.</p>
  177. </article>
  178. <hr>
  179. <footer>
  180. <p>
  181. <a href="/david/" title="Aller à l’accueil"><svg class="icon icon-home">
  182. <use xlink:href="/static/david/icons2/symbol-defs.svg#icon-home"></use>
  183. </svg> Accueil</a> •
  184. <a href="/david/log/" title="Accès au flux RSS"><svg class="icon icon-rss2">
  185. <use xlink:href="/static/david/icons2/symbol-defs.svg#icon-rss2"></use>
  186. </svg> Suivre</a> •
  187. <a href="http://larlet.com" title="Go to my English profile" data-instant><svg class="icon icon-user-tie">
  188. <use xlink:href="/static/david/icons2/symbol-defs.svg#icon-user-tie"></use>
  189. </svg> Pro</a> •
  190. <a href="mailto:david%40larlet.fr" title="Envoyer un courriel"><svg class="icon icon-mail">
  191. <use xlink:href="/static/david/icons2/symbol-defs.svg#icon-mail"></use>
  192. </svg> Email</a> •
  193. <abbr class="nowrap" title="Hébergeur : Alwaysdata, 62 rue Tiquetonne 75002 Paris, +33184162340"><svg class="icon icon-hammer2">
  194. <use xlink:href="/static/david/icons2/symbol-defs.svg#icon-hammer2"></use>
  195. </svg> Légal</abbr>
  196. </p>
  197. <template id="theme-selector">
  198. <form>
  199. <fieldset>
  200. <legend><svg class="icon icon-brightness-contrast">
  201. <use xlink:href="/static/david/icons2/symbol-defs.svg#icon-brightness-contrast"></use>
  202. </svg> Thème</legend>
  203. <label>
  204. <input type="radio" value="auto" name="chosen-color-scheme" checked> Auto
  205. </label>
  206. <label>
  207. <input type="radio" value="dark" name="chosen-color-scheme"> Foncé
  208. </label>
  209. <label>
  210. <input type="radio" value="light" name="chosen-color-scheme"> Clair
  211. </label>
  212. </fieldset>
  213. </form>
  214. </template>
  215. </footer>
  216. <script src="/static/david/js/instantpage-5.1.0.min.js" type="module"></script>
  217. <script>
  218. function loadThemeForm(templateName) {
  219. const themeSelectorTemplate = document.querySelector(templateName)
  220. const form = themeSelectorTemplate.content.firstElementChild
  221. themeSelectorTemplate.replaceWith(form)
  222. form.addEventListener('change', (e) => {
  223. const chosenColorScheme = e.target.value
  224. localStorage.setItem('theme', chosenColorScheme)
  225. toggleTheme(chosenColorScheme)
  226. })
  227. const selectedTheme = localStorage.getItem('theme')
  228. if (selectedTheme && selectedTheme !== 'undefined') {
  229. form.querySelector(`[value="${selectedTheme}"]`).checked = true
  230. }
  231. }
  232. const prefersColorSchemeDark = '(prefers-color-scheme: dark)'
  233. window.addEventListener('load', () => {
  234. let hasDarkRules = false
  235. for (const styleSheet of Array.from(document.styleSheets)) {
  236. let mediaRules = []
  237. for (const cssRule of styleSheet.cssRules) {
  238. if (cssRule.type !== CSSRule.MEDIA_RULE) {
  239. continue
  240. }
  241. // WARNING: Safari does not have/supports `conditionText`.
  242. if (cssRule.conditionText) {
  243. if (cssRule.conditionText !== prefersColorSchemeDark) {
  244. continue
  245. }
  246. } else {
  247. if (cssRule.cssText.startsWith(prefersColorSchemeDark)) {
  248. continue
  249. }
  250. }
  251. mediaRules = mediaRules.concat(Array.from(cssRule.cssRules))
  252. }
  253. // WARNING: do not try to insert a Rule to a styleSheet you are
  254. // currently iterating on, otherwise the browser will be stuck
  255. // in a infinite loop…
  256. for (const mediaRule of mediaRules) {
  257. styleSheet.insertRule(mediaRule.cssText)
  258. hasDarkRules = true
  259. }
  260. }
  261. if (hasDarkRules) {
  262. loadThemeForm('#theme-selector')
  263. }
  264. })
  265. </script>
  266. </body>
  267. </html>