How to build a rock, paper, scissors game with GitHub Copilot
Tags: tutorial, githubcopilot, python, githubcodespaces
Published: 2023-03-03 17:30:31

In this tutorial, we will build a rock, paper, scissors game with GitHub Copilot. We will also explore GitHub Copilot, a cloud-based AI tool that assists users of various editors in suggesting lines of code and whole functions instantly. We will discuss how Copilot has redefined productivity for millions of developers, and the benefits it provides. This tutorial includes the use of CodeTour, a VS Code extension, that allows developers to create and follow a guided walkthrough of a codebase. Let's get started!

## What is GitHub Copilot?
GitHub Copilot has helped redefine productivity for millions of developers by introducing them to the magic of AI assistance. GitHub Copilot is a cloud-based artificial intelligence tool developed by GitHub and OpenAI to assist users of Visual Studio, Visual Studio Code, Neovim, and JetBrains by suggesting lines of code and whole functions instantly. With Copilot, you can write a regular expression or interact with an API for the first time without leaving your editor. 

## Why I love GitHub Copilot
GitHub Copilot boosts productivity because it helps developers spend more time thinking about the theory they are building than about the code itself. 

However, beyond productivity, GitHub Copilot helps provide me with psychological safety. Psychological safety refers to the belief that you can speak up, ask questions, make mistakes, and contribute without fear of punishment or humiliation. When employees feel safe to learn, ask questions, contribute, and lead, it boosts the team’s and individual’s overall confidence, morale, and performance.

Unfortunately, the reality is psychological safety is not always common at work. When I’m feeling uncertain about asking for help, or I’m not even sure how to word my questions, I can use GitHub Copilot to help me:
* Brainstorm ideas when I reach a mental block
* Jog my memory
* Retain focus
* Determine if I’m going in the right direction

## Why would I build a rock, paper, scissors game?
* I did this for fun
* I did this to build my Python skills. I’m a baby Pythonista. For the past 5 years, I’ve been writing different forms of JavaScript on the frontend and backend, but ever since I started using GitHub Copilot, I’ve taken up an interest in Python. And I want to continue to read, type, and navigate code written in Python. It’s a less verbose language than JavaScript, so it feels easy for me to learn.
* I wanted to create a short, fun activity to help folks learn how to leverage GitHub Copilot because it’s not always obvious how to get started. Hint: Provide as much context as possible through comments and lines of code.
* I remember building a rock, paper, scissors game when I was in a coding bootcamp back in 2018. At the time, the logic seemed so difficult. I’m hoping this can be a helpful tool for developers who are learning to code. 
* I want to continue to creatively use GitHub Copilot for different situations to understand its limitations and strengths.

## To complete this tutorial, you will need:
* Access to [GitHub Copilot](https://github.com/features/copilot)
* Open this [repository](https://github.com/blackgirlbytes/rock-paper-scissors-copilot/)

{% github blackgirlbytes/rock-paper-scissors-copilot %}

## How does this work?
The CodeTour prompts developers to write comments and lines of code that trigger GitHub Copilot to generate code to create a rock, paper, scissors game.

## What is CodeTour?
[CodeTour](https://marketplace.visualstudio.com/items?itemName=vsls-contrib.codetour) is a VS Code extension developed by my amazing coworker, [Jonathan Carter](https://github.com/lostintangent)! It allows developers to create and follow a guided walkthrough of a codebase. 

## What you will find in this repository
In this [repository](https://github.com/blackgirlbytes/rock-paper-scissors-copilot/), you will find:
* a `main.py` file with no contents
* a devcontainer that installs CodeTour and GitHub Copilot when the Codespace is created
* a CodeTour to guide the developer through using GitHub Copilot to develop a rock, paper, scissors game. 


## How to use the guided CodeTour

Navigate to this [repository](https://github.com/blackgirlbytes/rock-paper-scissors-copilot/) that I created. Then follow the instructions below:

#### Step 1 
Choose 'Use this template', and 'Open in a codespace'

<img width="618" alt="Open in a codespace image" src="https://user-images.githubusercontent.com/22990146/222702705-3b6a58e5-bde4-4197-8372-056629d87006.png">

#### Step 2
Choose the “Explorer Icon” on the left sidebar of your editor.

<img width="431" alt="Highlighting the Explorer Icon" src="https://user-images.githubusercontent.com/22990146/222706773-ad2fcb4f-5346-4bcc-995f-88c1ceec8083.png">

#### Step 3
Toggle the CodeTour panel

<img width="411" alt="Highlighting the Code Tour panel" src="https://user-images.githubusercontent.com/22990146/222707067-f03533f9-3625-4597-a201-1d17b76f112a.png">

#### Step 4
Press the “Play button” to start the tour.

<img width="437" alt="Highlighting the Play button" src="https://user-images.githubusercontent.com/22990146/222708745-53e644aa-dc2b-44d0-8484-ac335847e14d.png">

#### Step 5
Your CodeTour will begin! Follow the CodeTour’s steps to learn how to use GitHub Copilot.

<img width="437" alt="Highlighting the start of a CodeTour" src="https://user-images.githubusercontent.com/22990146/222709106-ebdfe7c2-e198-4e76-8be4-cdd592453b6a.png">

## Your CodeTour will take you through the following steps

#### Step 1 
Introduction: Hi there! this is a guided tour to help you learn GitHub Copilot. We will build a rock, paper, scissors game with Python.


#### Step 2
Let's give GitHub Copilot some context about what we're building. Write this comment `# Write a rock, paper, scissors, game` at the top of your main.py file. 
<img width="1438" alt="Write a rock paper scissors game comment" src="https://user-images.githubusercontent.com/22990146/222714683-d065c102-9b0c-4645-83d6-dfcf732d3b20.png">

Now, let's prompt Copilot to import the random module. Write this comment `# import random module` on the next line. Press enter to create a new line and accept Copilot's suggestion.

<img width="1429" alt="Screen Shot 2023-03-03 at 6 58 46 AM" src="https://user-images.githubusercontent.com/22990146/222715309-72f40d08-e94f-438a-9719-cf0d14a2aebb.png">


#### Step 3
Now, let's prompt Copilot to create a main function that handles the logic of the game with a comment that says `# define main function that handles all the logic`. Press enter to create a new line and accept Copilot's suggestion. 

<img width="1498" alt="define main function" src="https://user-images.githubusercontent.com/22990146/222715649-84631082-4771-4b5b-9236-9b396a7b313e.png">

#### Step 4  
Now, let's prompt Copilot to call the main function. Write this comment `# call main function` on the next line. Press enter to create a new line and accept Copilot's suggestion. 

<img width="1507" alt="Call main function" src="https://user-images.githubusercontent.com/22990146/222715869-176895c5-26bb-43a7-adb1-fe579064f689.png">

#### Step 5  

Try it out! Let's run the code to see if it works. In your terminal, run `python3 main.py`. It should start the rock, paper, scissors game. Mission complete! You've used GitHub Copilot to create a rock, paper, scissors game in Python!
<img width="1086" alt="Playing the game in the terminal" src="https://user-images.githubusercontent.com/22990146/222713921-70e04ad7-6522-4b28-8eea-819da728c3d0.png">

## Do you have feedback?
Feel free to create an issue in the [repo](https://github.com/blackgirlbytes/rock-paper-scissors-copilot/) or comment below!! 
There’s definitely room for improvement as this is my first time using CodeTour to guide people through GitHub Copilot. 

Follow [me](https://dev.to/blackgirlbytes) and [GitHub](https://dev.to/github) for similar content about GitHub!