Merge pull request #17 from microsoft/alfredodeza-patch-1

Update Python and JS lessons based on feedback

Author: WirelessLife

04-Harnessing-GitHub-Copilot-with-JavaScript/README.MD

@@ -64,7 +64,7 @@ const siteProps = {
 
 ### 🔎 Step 2: Animate the social media icons with a prompt
 
-An animation can make the social media section more eye-catching. Next, lets ask Copilot’s help to animate the icons. Write the following prompt in the `src/styles.css` file:
+An animation can make the social media section more eye-catching. Ask Copilot’s help to animate the icons. Write the following prompt in the `src/styles.css` file:
 
 ```css
 /* add an amazing animation to the social icons */
@@ -91,11 +91,16 @@ img.socialIcon:hover {
 }
 ```
 
-### 🚀 Step 3: Work with the suggestion
+### 🚀 Step 3: Find out how to run the app
+Open GitHub Copilot chat by clicking on the chat icon on the left side bar and use the input section to ask the following:
 
-Accept the suggestion by pressing the tab key. If you don't receive the exact same suggestion, then you can either experiment with the suggestion provided or keep typing the CSS code until it matches.
+```
+@workspace I want to understand how can I run this React application
+```
 
-Your site should already be running in your Codespace, and the change will reload onto the page automatically. To see them, hover over one of your social media icons in the footer to see the magic!
+The prompts uses `@workspace` which is a special feature of GitHub Copilot chat that allows you to include more context for a more complete answer. Try out other queries using the chat panel for a more interactive workflow.
 
+### Conclusion
+Your site should already be running in your Codespace, and the change will reload onto the page automatically. To see them, hover over one of your social media icons in the footer to see the magic!
 
-Congratulations, through the exercise, you haven't only used copilot to generate code but also done it in an interactive and fun way! You can use GitHub Copilot to not only generate code, but write documentation, test your applications and more.
+Congratulations, through the exercise, you have use GitHub Copilot to generate code and also done it in an interactive and fun way! You can use GitHub Copilot to not only generate code, but write documentation, test your applications and more.

05-Harnessing-GitHub-Copilot-with-Python/README.md

@@ -56,21 +56,14 @@ Next, generate a new endpoint with GitHub Copilot by adding the comment:
 # Create a FastAPI endpoint that accepts a POST request with a JSON body containing a single field called "text" and returns a checksum of the text 
 ```
 
-### 🐍 Step 3: Add necessary imports
+### 🐍 Step 3: Explain code
 
-The generated code causes the application to crash. The crash happens because the `base64` and `os` modules aren't imported. Add the following lines to the top of the file:
-
-```python
-import base64 
-import os
-```
+The `generate()` route creates a pseudo-random token ID using a single line that might be difficult to fully understand. Select the whole function, and then right click on the selection, then select the Copilot menu item, and then the _"Explain This"_ option. The GitHub Copilot chat interface will open to the left and provide you a useful explanation which you can use to interactively ask more questions.
 
 Finally, verify the new endpoint is working by trying it out by going to the `/docs` endpoint and confirming that the endpoint shows up.
 
-
 🚀 Congratulations, through the exercise, you haven't only used copilot to generate code but also done it in an interactive and fun way! You can use GitHub Copilot to not only generate code, but write documentation, test your applications and more.
 
-
 ## Legal Notices
 
 Microsoft and any contributors grant you a license to the Microsoft documentation and other content