CINXE.COM
The GitHub Insider
<!-- Archive Stuff --> <style> .signup { background-color: #d9f2fe; border-bottom: 1px solid #b8dbfc; color: #32383f; font-family: sans-serif; font-size: 1em; padding: 1.4rem 0; text-align: center; width: 100%; } .signup a { color: #0969da; text-decoration: underline; } .signup a:hover { color: black !important; text-decoration: none !important; } @media screen and (max-width:800px) { .signup a { display: block; margin-top: 1rem; } } </style> <div class="signup"> Get new issues of <em>The GitHub Insider</em> in your inbox. <a href="https://resources.github.com/newsletter?utm_medium=web&utm_source=github&utm_campaign=insider-archive-page">Sign up now →</a> </div> <!DOCTYPE html> <html lang="en" dir="ltr" xmlns:v="urn:schemas-microsoft-com:vml" xmlns:o="urn:schemas-microsoft-com:office:office"> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width,initial-scale=1"> <meta name="format-detection" content="telephone=no, date=no, address=no, email=no"> <meta name="x-apple-disable-message-reformatting"> <meta name="color-scheme" content="light dark"> <meta name="supported-color-schemes" content="light dark"> <title>The GitHub Insider</title> <!--[if mso]> <xml> <o:OfficeDocumentSettings> <o:AllowPNG/> <o:PixelsPerInch>96</o:PixelsPerInch> </o:OfficeDocumentSettings> </xml> <![endif]--> <style> /* General reset styles. */ body, table, td, a { -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; } table, td { mso-table-lspace: 0pt; mso-table-rspace: 0pt; } img { -ms-interpolation-mode: bicubic; } img { border: 0; height: auto; line-height: 100%; outline: none; text-decoration: none; } table { border-collapse: collapse !important; } body { height: 100% !important; margin: 0 !important; padding: 0 !important; width: 100% !important; } a[x-apple-data-detectors] { color: inherit !important; text-decoration: none !important; font-size: inherit !important; font-family: inherit !important; font-weight: inherit !important; line-height: inherit !important; } u+#body a { color: inherit; text-decoration: none; font-size: inherit; font-family: inherit; font-weight: inherit; line-height: inherit; } #MessageViewBody a { color: inherit; text-decoration: none; font-size: inherit; font-family: inherit; font-weight: inherit; line-height: inherit; } u+.body .glist { margin-left: 0 !important; } @media only screen and (max-width: 640px) { u+.body .glist { margin-left: 40px !important; } } /* Set default link styles here. Override them on hover to show users they are interactive. */ a { color: #0969da; font-weight: normal; text-decoration: none; } a:hover { color: #0969da !important; text-decoration: underline !important; } a.button { text-align: center; } a.button:hover { background-color: #2c974b !important; border-color: #2c974b !important; color: #ffffff !important; text-decoration: none !important; } @media screen and (max-width: 600px) { a.button { display: block !important; } } </style> <!-- Set your dark mode styles below. --> <style> :root { color-scheme: light dark; supported-color-schemes: light dark; } @media (prefers-color-scheme: dark ) { body, .email-container, .content-container, .callout { background-color: #000000 !important; color: #ffffff !important; } h1, h2, h3, strong { color: #ffffff !important; } a { color: #ffffff !important; text-decoration: underline !important; } .footer a { color: #999999 !important; text-decoration: none !important; } a:hover { color: #ffffff !important; text-decoration: none !important; } .footer a:hover { text-decoration: underline !important; } a.button { color: #ffffff !important; text-decoration: none !important; } .dark-mode-hide { display: none !important; } .dark-mode-show { display: block !important; } .callout a.button { background-color: #2ea44f !important; border-color: #2ea44f !important; } .callout a.button:hover { background-color: #2c974b !important; border-color: #2c974b !important; color: #ffffff !important; text-decoration: none !important; } } </style> </head> <body id="body" class="body" style="background-color: #ffffff; margin: 0 !important; padding: 0 !important;"> <div style="display:none"> Don’t miss these simple tricks for powerful results ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ ͏‌ </div> <!-- This is the main container div, where we set some accessibility basics. --> <div class="email-container" role="article" aria-roledescription="email" aria-label="" lang="en" dir="ltr" style="background-color: #ffffff; font-size: medium; font-size: max(16px, 1rem);"> <!--[if (gte mso 9)|(IE)]> <table cellspacing="0" cellpadding="0" border="0" width="600" align="center" role="presentation"><tr><td> <![endif]--> <div class="content-container" style="color: #000000; font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol'; line-height: 1.5; margin: 1rem auto; max-width: 600px; padding: 1em;"> <a href="https://github.com?utm_source=insider&utm_medium=email&utm_campaign=2024q1-em-GitHub-Insider-August-22" style="display: block; margin: 0 0 2em 0;"> <img alt="GitHub" src="https://images.github.media/EloquaImages/clients/GitHubInc/%7B06958555-b158-43f9-9f4c-f7cc10a305a0%7D_github-logo-email.png" width="100" border="0" style="display: block;" class="dark-mode-hide"> <!--[if !mso]><!--> <img alt="GitHub" src="https://images.github.media/EloquaImages/clients/GitHubInc/%7B369cff35-9244-420e-9a83-1a9040d9e311%7D_github-logo-email-dark-mode.png" width="100" border="0" style="display: none;" class="dark-mode-show"> <!--<![endif]--> </a> <!-- Header --> <p style="margin: 2em 0 2em 0;"> <a href="https://github.com?utm_source=insider&utm_medium=email&utm_campaign=2024q1-em-GitHub-Insider-August-22"> <img alt="" src="https://images.github.media/EloquaImages/clients/GitHubInc/%7B0da1dee9-e914-4030-a21c-f4f02cc63994%7D_github-insider-header-2024.png" width="600" border="0" style="border-radius: 4px; color: #000000; font-size: 1.8em; line-height: 1.4; display: block; max-width: 100%; min-width: 100px; width: 100%;"> </a> </p> <p style="margin: 2em 0 2em 0;"> When it comes to AI, the sky's the limit. ☀️ </p> <p style="margin: 2em 0 2em 0;"> By now, many of us are familiar with the basics of <a href="https://images.github.media/Web/GitHubInc/%7B806adfe1-797b-482e-b920-3f22710493c4%7D_github-insider-archive-feb-2-2024.html" style="color: #0969da; font-weight: normal; text-decoration: none;">prompt engineering</a>, i.e. providing GitHub Copilot with context about our project so we get better, more relevant answers. </p> <p style="margin: 2em 0 2em 0;"> But did you know there is so much more you can do to provide the tool context? In this edition of <em>The GitHub Insider</em>, we’re going to explore some new, super fancy (though still super simple!) prompt strategies to make Copilot work as hard as possible for you and your project. </p> <p style="margin: 2em 0 2em 0;"> Let’s go! </p> <h2 style="color: #000000; font-size: 1.4em; font-weight: bold; line-height: 1.2; margin: 2em 0 0 0;"> 1. Q&A prompt 👷 </h2> <p style="margin: 2em 0 2em 0;"> This is where you get Copilot to prompt you so you can effectively prompt Copilot. This might sound like something out of <em>Inception</em>, but hear me out: this strategy is perfect if you forget to include important details in your initial prompt (which I do all the time). </p> <!-- IMG --> <p style="margin: 2em 0 0 0;"> <center> <img alt="" src="https://images.github.media/EloquaImages/clients/GitHubInc/%7Bd6c6dede-8014-4377-8897-3ddd3c3733c0%7D_gh-insider-aug-2024-2-1.gif" width="600" border="0" style="border-radius: 4px; color: #000000; font-size: 1.8em; line-height: 1.4; display: block; max-width: 100%; min-width: 100px; width: 100%;"> </center> </p> <p style="margin: 2em 0 2em 0;"> Let’s explore how this works! 👇 </p> <p style="margin: 2em 0 2em 0;"> Let’s say you want a recommendation from Copilot on how to structure your project inside VS Code. In your main workspace window, you might see a list of all your project files on the right. If you’re like me, your files are often in no particular order, organized haphazardly like a junk drawer. </p> <!-- IMG --> <p style="margin: 2em 0 0 0;"> <center> <img alt="" src="https://images.github.media/EloquaImages/clients/GitHubInc/%7B2f906079-eb19-4e06-8632-c4aa6ca54df9%7D_gh-insider-aug-2024-2-2.png" width="600" border="0" style="border-radius: 4px; color: #000000; font-size: 1.8em; line-height: 1.4; display: block; max-width: 100%; min-width: 100px; width: 100%;"> </center> </p> <p style="margin: 2em 0 2em 0;"> That’s OK, but having a better organized folder structure will make your project easier to manage and, even better, easier to collaborate with others. </p> <p style="margin: 2em 0 2em 0;"> This is somewhere Copilot can be helpful. You can ask Copilot to propose a folder structure to help you organize your project. To do this, we’ll use the <strong style="font-family:monospace;font-weight:normal;">@workspace</strong> agent in Copilot Chat to ask Copilot. This agent will pass all the information about your current project (including the existing files and folders) along with the prompt. </p> <p style="margin: 2em 0 2em 0;"> Additionally, you can ask Copilot to ask you a series of yes/no questions to help it provide a better recommendation. </p> <!-- IMG --> <p style="margin: 2em 0 0 0;"> <center> <img alt="" src="https://images.github.media/EloquaImages/clients/GitHubInc/%7B66448690-a7ee-4fee-b3c2-019d585a0b58%7D_gh-insider-aug-2024-2-3.png" width="600" border="0" style="border-radius: 4px; color: #000000; font-size: 1.8em; line-height: 1.4; display: block; max-width: 100%; min-width: 100px; width: 100%;"> </center> </p> <p style="margin: 2em 0 2em 0;"> Check out the questions it provided: </p> <!-- IMG --> <p style="margin: 2em 0 0 0;"> <center> <img alt="" src="https://images.github.media/EloquaImages/clients/GitHubInc/%7B7e9981af-cda3-4b8a-8ec9-b685cd6329b3%7D_gh-insider-aug-2024-2-4.png" width="600" border="0" style="border-radius: 4px; color: #000000; font-size: 1.8em; line-height: 1.4; display: block; max-width: 100%; min-width: 100px; width: 100%;"> </center> </p> <p style="margin: 2em 0 2em 0;"> Answer each one, including the question number in your responses. </p> <!-- IMG --> <p style="margin: 2em 0 0 0;"> <center> <img alt="" src="https://images.github.media/EloquaImages/clients/GitHubInc/%7B95c1fda4-a09f-4017-a61c-ed75dc287564%7D_gh-insider-aug-2024-2-5.png" width="600" border="0" style="border-radius: 4px; color: #000000; font-size: 1.8em; line-height: 1.4; display: block; max-width: 100%; min-width: 100px; width: 100%;"> </center> </p> <p style="margin: 2em 0 2em 0;"> (You might get some questions that aren’t yes/no, but that’s the nature of good ol’ AI so just roll with it.) </p> <p style="margin: 2em 0 2em 0;"> And then, voila! You get a nice recommendation for how to structure your project! </p> <!-- IMG --> <p style="margin: 2em 0 0 0;"> <center> <img alt="" src="https://images.github.media/EloquaImages/clients/GitHubInc/%7B801c1295-bffe-4d53-ba9b-9955d607c770%7D_gh-insider-aug-2024-2-6.png" width="600" border="0" style="border-radius: 4px; color: #000000; font-size: 1.8em; line-height: 1.4; display: block; max-width: 100%; min-width: 100px; width: 100%;"> </center> </p> <p style="margin: 2em 0 2em 0;"> The magic of the Q&A prompt is that it helps you put in all the details you would initially have only if you had thought of them. </p> <p style="margin: 2em 0 2em 0;"> So don’t worry about having the perfect prompt the first time; use the Q&A prompt to have Copilot <em>prompt</em> you to give it the best prompt. </p> <h2 style="color: #000000; font-size: 1.4em; font-weight: bold; line-height: 1.2; margin: 2em 0 0 0;"> 2. Pros and cons prompt 👍👎🏽 </h2> <p style="margin: 2em 0 2em 0;"> In programming, there’s rarely a single “right” way to do anything. </p> <p style="margin: 2em 0 2em 0;"> In our above example, I went ahead and started to implement Copilot’s recommendations for structuring my project, creating folders for my API (api), my database (db), and my static files (public). </p> <!-- IMG --> <p style="margin: 2em 0 0 0;"> <center> <img alt="" src="https://images.github.media/EloquaImages/clients/GitHubInc/%7B2fd072dc-0af4-401a-826a-2d9961c1d688%7D_gh-insider-aug-2024-2-7.png" width="600" border="0" style="border-radius: 4px; color: #000000; font-size: 1.8em; line-height: 1.4; display: block; max-width: 100%; min-width: 100px; width: 100%;"> </center> </p> <p style="margin: 2em 0 2em 0;"> Inside my db folder, I have a TypeScript file where I’ve written my database connection class (db.ts), but I’m not sure if this is the right way to connect with this app. Luckily, I can ask Copilot for suggestions on how to implement this logic, but this time, I’m going to ask for the pros and cons of each suggestion. </p> <p style="margin: 2em 0 2em 0;"> I’ll go one step further and affix the TypeScript file to the prompt for even more context (use <strong style="font-family:monospace;font-weight:normal;">#file:filename.ext</strong> to attach your file). </p> <!-- IMG --> <p style="margin: 2em 0 0 0;"> <center> <img alt="" src="https://images.github.media/EloquaImages/clients/GitHubInc/%7Bc5b5bde2-5be2-46a2-9c83-54ba87af3ada%7D_gh-insider-aug-2024-2-8.png" width="600" border="0" style="border-radius: 4px; color: #000000; font-size: 1.8em; line-height: 1.4; display: block; max-width: 100%; min-width: 100px; width: 100%;"> </center> </p> <p style="margin: 2em 0 2em 0;"> And voila! You get suggestions and pros and cons of each method! </p> <!-- IMG --> <p style="margin: 2em 0 0 0;"> <center> <img alt="" src="https://images.github.media/EloquaImages/clients/GitHubInc/%7B4e5cb4cd-bb59-4ad8-bfb4-b2dabde96177%7D_gh-insider-aug-2024-2-9.png" width="600" border="0" style="border-radius: 4px; color: #000000; font-size: 1.8em; line-height: 1.4; display: block; max-width: 100%; min-width: 100px; width: 100%;"> </center> </p> <p style="margin: 2em 0 2em 0;"> Remember, there’s no one right way to do anything—so use a pros and cons prompt and have Copilot give you several options so you can pick the best one for you. </p> <h2 style="color: #000000; font-size: 1.4em; font-weight: bold; line-height: 1.2; margin: 2em 0 0 0;"> 3. Stepwise chain of thought 🔗 </h2> <p style="margin: 2em 0 2em 0;"> Sometimes, the best way of getting the best prompt is to break things down into smaller steps. We can even use Copilot to do this, by asking it to give us a solution one step at a time. </p> <p style="margin: 2em 0 2em 0;"> For instance, normally, if you want to refactor a code file and clean it up, you can ask Copilot (remember to replace <strong style="font-family:monospace;font-weight:normal;">vehiclesService.ts</strong> with the file you want refactored): </p> <p style="margin: 2em 0 2em 0;"> <strong style="font-family:monospace;font-weight:normal;">Help me refactor the code in #file:vehiclesService.ts</strong> </p> <p style="margin: 2em 0 2em 0;"> But you’ll get a pretty verbose response and it will try to do the entire refactoring in one shot, which is way too many changes to validate all at once. </p> <p style="margin: 2em 0 2em 0;"> So instead, ask it to do one step at a time by asking: </p> <p style="margin: 2em 0 2em 0;"> <strong style="font-family:monospace;font-weight:normal;">Help me refactor the code in #file:vehiclesService.ts. Go one step at a time. Do not move to the next step until I give the keyword “next”. Begin.</strong> </p> <!-- IMG --> <p style="margin: 2em 0 0 0;"> <center> <img alt="" src="https://images.github.media/EloquaImages/clients/GitHubInc/%7Bf9680720-e1d2-4707-bff6-76feeafbe6fd%7D_gh-insider-aug-2024-2-10.png" width="600" border="0" style="border-radius: 4px; color: #000000; font-size: 1.8em; line-height: 1.4; display: block; max-width: 100%; min-width: 100px; width: 100%;"> </center> </p> <p style="margin: 2em 0 2em 0;"> In this way, it’ll only work on one change at a time, and you can make sure each step looks good before hitting “next”. </p> <p style="margin: 2em 0 2em 0;"> Remember, the AI assistants are our assistants. That means they are designed to follow our instructions. And unlike human assistants or pair-programmers, Copilot isn’t going to be frustrated if you ask it to do something over and over again in smaller steps. </p> <h2 style="color: #000000; font-size: 1.4em; font-weight: bold; line-height: 1.2; margin: 2em 0 0 0;"> 4. Role prompt 👩🏽‍🏫 </h2> <p style="margin: 2em 0 2em 0;"> Interested in learning <a href="https://github.blog/2023-08-30-why-rust-is-the-most-admired-language-among-developers/?utm_source=insider&utm_medium=email&utm_campaign=2024q1-em-GitHub-Insider-August-22" style="color: #0969da; font-weight: normal; text-decoration: none;">Rust</a>? React? Data science? Or really any other techy thing under the sun? </p> <p style="margin: 2em 0 2em 0;"> Well, good news, with Copilot, you can – and easily! </p> <p style="margin: 2em 0 2em 0;"> Copilot is very good at role playing, you just need to prompt it to take on the right role. Let’s say you want to learn about regular expressions. You could just ask Copilot about the topic, but what if we instead ask Copilot to role play as a teacher who is skilled at making complex topics simple and come up with fun exercises? In this case, let’s also ask it to teach students to be proficient in regular expressions. </p> <p style="margin: 2em 0 2em 0;"> We can take cues from our previous tip and ask it to move us through one step at a time, waiting for the “student” to provide a correct answer before moving on to the next lesson or concept. We can also have the prompt ensure that if the “student” gives the wrong answer, Copilot should offer up a hint. </p> <!-- IMG --> <p style="margin: 2em 0 0 0;"> <center> <img alt="" src="https://images.github.media/EloquaImages/clients/GitHubInc/%7Bf75bffca-a86c-4205-87d9-17ecbaabed63%7D_gh-insider-aug-2024-2-11.png" width="600" border="0" style="border-radius: 4px; color: #000000; font-size: 1.8em; line-height: 1.4; display: block; max-width: 100%; min-width: 100px; width: 100%;"> </center> </p> <p style="margin: 2em 0 2em 0;"> Then watch it go! </p> <p style="margin: 2em 0 2em 0;"> As with our other tips, don’t be afraid to be descriptive and specific with what role you want Copilot to take on. Remember, the more specific you can be, the better the AI is going to be able to provide you with the results you want. </p> <p style="margin: 2em 0 2em 0;"> And have fun exploring! If you come up with a prompt that gets you really good results, you might want to keep it in a text file of your favorite prompts that you can augment in the future. </p> <p style="margin: 2em 0 2em 0;"> Try it out and learn something new today! </p> <!-- IMG --> <p style="margin: 2em 0 0 0;"> <center> <a href="https://www.youtube.com/watch?v=H3M95i4iS5c"> <img alt="" src="https://images.github.media/EloquaImages/clients/GitHubInc/%7B13b7cf87-022c-459a-8270-264e463af063%7D_gh-insider-aug-2024-2-12.png" width="600" border="0" style="border-radius: 4px; color: #000000; font-size: 1.8em; line-height: 1.4; display: block; max-width: 100%; min-width: 100px; width: 100%;"> </a> </center> </p> <!-- A button block. --> <p style="margin: 4em 0 4em 0; text-align: center;"> <a class="button" href="https://github.com/features/copilot/?utm_source=insider&utm_medium=email&utm_campaign=2024q1-em-GitHub-Insider-August-22" style="background: #2ea44f; border: 2px solid #2ea44f; text-decoration: none; padding: 10px 20px; color: #ffffff; border-radius: 4px; display: inline-block; font-weight: bold; mso-padding-alt: 0; text-underline-color: #2ea44f"><!--[if mso]><i style="letter-spacing: 20px;mso-font-width:-100%;mso-text-raise:30pt" hidden> </i><![endif]--><span style="mso-text-raise:15pt;">Get started with GitHub Copilot</span><!--[if mso]><i style="letter-spacing: 25px;mso-font-width:-100%" hidden> </i><![endif]--> </a> </p> <hr style="border-width: 0; background: #eaeaea; color: #eaeaea; height: 1px"> <p style="margin: 2em 0 2em 0; text-align: center;"> <small>✨ This newsletter was written by <a href="https://github.com/filmgirl?utm_source=insider&utm_medium=email&utm_campaign=2024q1-em-GitHub-Insider-August-22" style="color: #0969da; font-weight: normal; text-decoration: none;">Christina Warren</a> and produced by <a href="https://github.com/purpledragon85/?utm_source=insider&utm_medium=email&utm_campaign=2024q1-em-GitHub-Insider-August-22" style="color: #0969da; font-weight: normal; text-decoration: none;">Gwen Davis</a>. ✨</small> </p> <!-- Connect with us section. --> <!-- Callout block --> <!--[if (gte mso 9)|(IE)]> <table cellspacing="0" cellpadding="0" border="0" width="100%" align="center" role="presentation"><tr><td style="background-color: #fff7c2;"> <![endif]--> <div style="background-color: #f5f7f9; border: 1px solid #dbdee2; border-radius: 4px; padding: 2em 2em 2em 2em; text-align: center;" class="callout"> <h3 style="font-size: 1.8em; font-weight: bold; margin: 0 0 0 0;"> More to explore 🌎 </h3> </div> <!--[if (gte mso 9)|(IE)]> </td></tr></table> <![endif]--> <br><br> <!-- Callout block --> <!--[if (gte mso 9)|(IE)]> <table cellspacing="0" cellpadding="0" border="0" width="100%" align="center" role="presentation"><tr><td style="background-color: #fff7c2;"> <![endif]--> <div style="background-color: #fff7c2; border: 1px solid #ebd8b0; border-radius: 4px; padding: 2em 2em 2em 2em; text-align: center;" class="callout"> <h3 style="font-size: 1.2em; font-weight: bold; margin: 0 0 1em 0;"> Join our GitHub Copilot conversations 🤖 </h3> <p style="margin: 1em 0 1em 0;"> Visit our community forum to see what people are saying + offer your own two cents. </p> <p style="margin: 2em 0 0 0;"> <a class="button" href="https://github.com/orgs/community/discussions/categories/copilot/?utm_source=insider&utm_medium=email&utm_campaign=2024q1-em-GitHub-Insider-August-22" style="background: #000000; border: 2px solid #000000; text-decoration: none; padding: 10px 20px; color: #ffffff; border-radius: 4px; display: inline-block; font-weight: bold; mso-padding-alt: 0; text-underline-color: #000000"><!--[if mso]><i style="letter-spacing: 20px;mso-font-width:-100%;mso-text-raise:30pt" hidden> </i><![endif]--><span style="mso-text-raise:15pt;">Visit now</span><!--[if mso]><i style="letter-spacing: 25px;mso-font-width:-100%" hidden> </i><![endif]--> </a> </p> </div> <!--[if (gte mso 9)|(IE)]> </td></tr></table> <![endif]--> <br><br> <!-- Callout block --> <!--[if (gte mso 9)|(IE)]> <table cellspacing="0" cellpadding="0" border="0" width="100%" align="center" role="presentation"><tr><td style="background-color: #d9f2fe;"> <![endif]--> <div style="background-color: #d9f2fe; border: 1px solid #b8dbfc; border-radius: 4px; padding: 2em 2em 2em 2em; text-align: center;" class="callout"> <h3 style="font-size: 1.2em; font-weight: bold; margin: 0 0 1em 0;"> Stay updated on GitHub products 📦 </h3> <p style="margin: 1em 0 1em 0;"> Discover the latest ships, launches, and improvements in our Changelog. </p> <p style="margin: 2em 0 0 0;"> <a class="button" href="https://github.blog/changelog/?utm_source=insider&utm_medium=email&utm_campaign=2024q1-em-GitHub-Insider-August-22" style="background: #000000; border: 2px solid #000000; text-decoration: none; padding: 10px 20px; color: #ffffff; border-radius: 4px; display: inline-block; font-weight: bold; mso-padding-alt: 0; text-underline-color: #000000"><!--[if mso]><i style="letter-spacing: 20px;mso-font-width:-100%;mso-text-raise:30pt" hidden> </i><![endif]--><span style="mso-text-raise:15pt;">Explore now</span><!--[if mso]><i style="letter-spacing: 25px;mso-font-width:-100%" hidden> </i><![endif]--> </a> </p> </div> <!--[if (gte mso 9)|(IE)]> </td></tr></table> <![endif]--> <br><br> <!-- Callout block --> <!--[if (gte mso 9)|(IE)]> <table cellspacing="0" cellpadding="0" border="0" width="100%" align="center" role="presentation"><tr><td style="background-color: #fff7c2;"> <![endif]--> <div style="background-color: #fbefff; border: 1px solid #ecd8ff; border-radius: 4px; padding: 2em 2em 2em 2em; text-align: center;" class="callout"> <h3 style="font-size: 1.2em; font-weight: bold; margin: 0 0 1em 0;"> Take our open source survey 💡 </h3> <p style="margin: 1em 0 1em 0;"> We’re working with the Linux Foundation and researchers at Harvard University to learn more about how organizations fund open source projects. </p> <p style="margin: 2em 0 0 0;"> <a class="button" href="https://hbs.qualtrics.com/jfe/form/SV_eKVt69Ek3H2yYx8?utm_source=insider&utm_medium=email&utm_campaign=2024q1-em-GitHub-Insider-August-22" style="background: #000000; border: 2px solid #000000; text-decoration: none; padding: 10px 20px; color: #ffffff; border-radius: 4px; display: inline-block; font-weight: bold; mso-padding-alt: 0; text-underline-color: #000000"><!--[if mso]><i style="letter-spacing: 20px;mso-font-width:-100%;mso-text-raise:30pt" hidden> </i><![endif]--><span style="mso-text-raise:15pt;">Take the survey now</span><!--[if mso]><i style="letter-spacing: 25px;mso-font-width:-100%" hidden> </i><![endif]--> </a> </p> </div> <!--[if (gte mso 9)|(IE)]> </td></tr></table> <![endif]--> <br><br> <!-- Callout block --> <!--[if (gte mso 9)|(IE)]> <table cellspacing="0" cellpadding="0" border="0" width="100%" align="center" role="presentation"><tr><td style="background-color: #fff7c2;"> <![endif]--> <div style="background-color: #d6fadf; border: 1px solid #4ac26b66; border-radius: 4px; padding: 2em 2em 2em 2em; text-align: center;" class="callout"> <h3 style="font-size: 1.2em; font-weight: bold; margin: 0 0 1em 0;"> Subscribe to our LinkedIn newsletter 🚀 </h3> <p style="margin: 1em 0 1em 0;"> Do your best work on GitHub. Subscribe to our LinkedIn newsletter, <em>Branching Out_</em>. </p> <p style="margin: 2em 0 0 0;"> <a class="button" href="https://www.linkedin.com/newsletters/6958196028076429312/?utm_source=insider&utm_medium=email&utm_campaign=2024q1-em-GitHub-Insider-August-22" style="background: #000000; border: 2px solid #000000; text-decoration: none; padding: 10px 20px; color: #ffffff; border-radius: 4px; display: inline-block; font-weight: bold; mso-padding-alt: 0; text-underline-color: #000000"><!--[if mso]><i style="letter-spacing: 20px;mso-font-width:-100%;mso-text-raise:30pt" hidden> </i><![endif]--><span style="mso-text-raise:15pt;">Sign up now</span><!--[if mso]><i style="letter-spacing: 25px;mso-font-width:-100%" hidden> </i><![endif]--> </a> </p> </div> <!--[if (gte mso 9)|(IE)]> </td></tr></table> <![endif]--> <br><br> <!-- Callout block --> <!--[if (gte mso 9)|(IE)]> <table cellspacing="0" cellpadding="0" border="0" width="100%" align="center" role="presentation"><tr><td style="background-color: #fff7c2;"> <![endif]--> <div style="background-color: #fff1e5; border: 1px solid #ffd8b5; border-radius: 4px; padding: 2em 2em 2em 2em; text-align: center;" class="callout"> <h3 style="font-size: 1.2em; font-weight: bold; margin: 0 0 1em 0;"> Attend GitHub Universe 🪐 </h3> <p style="margin: 1em 0 1em 0;"> Experience the world’s fair of software at the historic Fort Mason Center, October 29-20. </p> <p style="margin: 2em 0 0 0;"> <a class="button" href="https://githubuniverse.com/?utm_source=insider&utm_medium=email&utm_campaign=2024q1-em-GitHub-Insider-August-22" style="background: #000000; border: 2px solid #000000; text-decoration: none; padding: 10px 20px; color: #ffffff; border-radius: 4px; display: inline-block; font-weight: bold; mso-padding-alt: 0; text-underline-color: #000000"><!--[if mso]><i style="letter-spacing: 20px;mso-font-width:-100%;mso-text-raise:30pt" hidden> </i><![endif]--><span style="mso-text-raise:15pt;">Buy your tickets for 20% off now</span><!--[if mso]><i style="letter-spacing: 25px;mso-font-width:-100%" hidden> </i><![endif]--> </a> </p> </div> <!--[if (gte mso 9)|(IE)]> </td></tr></table> <![endif]--> <br><br> <hr style="border-width: 0; background: #eaeaea; color: #eaeaea; height: 1px"> </div> <!--[if (gte mso 9)|(IE)]> </td></tr></table> <![endif]--> <!--[if (gte mso 9)|(IE)]> <table cellspacing="0" cellpadding="0" border="0" width="580" align="center" role="presentation"><tr><td> <![endif]--> <div class="content-container" style="color: #000000; font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol'; line-height: 1.5; margin: 1rem auto; max-width: 580px; padding: 1em;"><!-- This is the footer. --> <center><a href="https://github.com?utm_source=insider&utm_medium=email&utm_campaign=2024q1-em-GitHub-Insider-August-22" style="display: block; margin: 0 0 2em 0;"><img alt="GitHub" border="0" class="dark-mode-hide" src="https://images.github.media/EloquaImages/clients/GitHubInc/%7B06958555-b158-43f9-9f4c-f7cc10a305a0%7D_github-logo-email.png" style="display: block;" width="100" /> <!--[if !mso]><!--> <img alt="GitHub" border="0" class="dark-mode-show" src="https://images.github.media/EloquaImages/clients/GitHubInc/%7B369cff35-9244-420e-9a83-1a9040d9e311%7D_github-logo-email-dark-mode.png" style="display: none;" width="100" /> <!--<![endif]--> </a></center> <p style="font-size: 1.2em; color: #999999; margin: 0 0 2em 0; text-align: center;">The world’s leading AI-powered developer platform.</p> </div> <!--[if (gte mso 9)|(IE)]> </td></tr></table> <![endif]--> </div> </body> </html>