Add nav, update links to use reference style, update misrendering alert

Author: chrisreddington

content/full-day/6-code.md

@@ -1,5 +1,8 @@
 # Coding with GitHub Copilot
 
+| [← Helping GitHub Copilot understand context][walkthrough-previous] | [Next: GitHub flow →][walkthrough-next] |
+|:-----------------------------------|------------------------------------------:|
+
 We've explored how we can use GitHub Copilot to explore our project and to provide context to ensure the suggestions we receive are to the quality we expect. Now let's turn our attention to putting all this prep work into action by generating new code! We'll use GitHub Copilot to aid us in adding functionality to our website and generate the necessary unit tests.
 
 ## Scenario
@@ -43,7 +46,7 @@ Let's build our new route in our Flask backend with the help of code completion.
 
 4. Create the route which will call the database to find all breeds, and returns a JSON array with their names and IDs. If you begin typing `@app.route` or add a comment with the requirements like `# Route to get all breeds`, you should notice italicized text generated by GitHub Copilot.
 5. Select <kbd>Tab</kbd> to accept the code suggestion.
-6. Navigate to [http://localhost:5100/api/breeds](http://localhost:5100/api/breeds) to validate the route.
+6. Navigate to [http://localhost:5100/api/breeds][localhost-breeds] to validate the route.
 
 > [!NOTE]
 > As with the prior exercise, we don't provide specific prompts to use with Copilot, as part of the learning experience is to discover how to interact with Copilot. If you are unfamiliar with Flask or how to add routes, you can look at the routes defined above for inspiration, or ask Copilot chat for guidance!
@@ -59,8 +62,8 @@ With the route created, we want to now add the tests to ensure the code is corre
 5. Type **/tests** and select <kbd>tab</kbd> to activate the command, then press <kbd>enter</kbd> to run the command. GitHub Copilot will generate the tests!
 6. Select the **Apply edits** button just above the generated code suggestion to apply the changes to **test_app.py**.
 7. Review and validate the code, making any necessary changes. Select **Keep** once you're satisfied.
-    > [!IMPORTANT]
-    > GitHub Copilot, like any generative AI solution, can make mistakes. Always review the generated code, making any necessary changes to ensure it's accurate and performs as expected.
+> [!IMPORTANT]
+> GitHub Copilot, like any generative AI solution, can make mistakes. Always review the generated code, making any necessary changes to ensure it's accurate and performs as expected.
 8. Open a terminal window in your codespace or VS Code by selecting <kbd>Ctl</kbd>+<kbd>Shift</kbd>+<kbd>`</kbd>
 9. Ensure the virtual server is activated by running the terminal command `source ./venv/bin/activate`
 10. Navigate to the **server** folder by running the terminal command `cd server`
@@ -84,19 +87,28 @@ Adding the filters to the page will require updating a minimum of three files -
     - The page should automatically refresh whenever a change is made
     - Tests should be updated for any changes to the endpoint.
 6. Review the code suggestions to ensure they behave the way you expect them to, making any necessary changes. Once you're satisfied, you can select **Keep** on the files individually or in Copilot Chat to accept all changes.
-7. Open the page at [http://localhost:4321](http://localhost:4321) to see the updates!
+7. Open the page at [http://localhost:4321][localhost] to see the updates!
 8. Run the Python tests by using `python -m unittest` in the terminal as you did previously.
 9. If any changes are needed, explain the required updates to GitHub Copilot and allow it to generate the new code.
 
 > [!IMPORTANT]
 > Working iteratively a normal aspect of coding with an AI pair programmer. You can always provide more context to ensure Copilot understands, make additional requests, or rephrase your original prompts.
 
 ## Summary and next steps
-
-Congratulations! You've worked with GitHub Copilot to add new features to the website - the ability to filter the list of dogs. Let's close out by [creating a pull request with our new functionality](./7-github-flow.md)!
+Congratulations! You've worked with GitHub Copilot to add new features to the website - the ability to filter the list of dogs. Let's close out by [creating a pull request with our new functionality][walkthrough-next]!
 
 ## Resources
-
-- [Asking GitHub Copilot questions in your IDE](https://docs.github.com/en/copilot/using-github-copilot/copilot-chat/asking-github-copilot-questions-in-your-ide)
-- [Copilot Edits](https://code.visualstudio.com/docs/copilot/copilot-edits)
-- [Copilot Chat cookbook](https://docs.github.com/en/copilot/copilot-chat-cookbook)
+- [Asking GitHub Copilot questions in your IDE][copilot-questions]
+- [Copilot Edits][copilot-chat-edits]
+- [Copilot Chat cookbook][copilot-chat-cookbook]
+
+| [← Helping GitHub Copilot understand context][walkthrough-previous] | [Next: GitHub flow →][walkthrough-next] |
+|:-----------------------------------|------------------------------------------:|
+
+[copilot-chat-cookbook]: https://docs.github.com/en/copilot/copilot-chat-cookbook
+[copilot-chat-edits]: https://code.visualstudio.com/docs/copilot/copilot-edits
+[copilot-questions]: https://docs.github.com/en/copilot/using-github-copilot/copilot-chat/asking-github-copilot-questions-in-your-ide
+[localhost]: http://localhost:4321
+[localhost-breeds]: http://localhost:5100/api/breeds
+[walkthrough-previous]: 5-context.md
+[walkthrough-next]: 7-github-flow.md