Hugo Portfolio Tutorial

This is a sample repository which is used for guided workshops around Hugo and Azure Static Web Apps. It fundamentally relies upon the Azure Docs, and can be used as part of workshops or self-led learning.

The content in this repository is provided as-is. If you choose to use any content in a production environment, you should make sure that it fits your own needs.

Pre-Requisites

For both options

• Set up a GitHub account if you don't already have one.

For Option 1

• Install Hugo using the most appropriate instructions for your Operating System
• Install Visual Studio Code. Note: VSCode is optional, feel free to use your preferred editor!
• Install Git

Instructions

Option 1 - If you would like to make changes on your local machine

1. Navigate to the Azure Doc Tutorial: Publish a Hugo Site to Azure Static Web Apps.
2. Follow the instructions through the tutorial (including deploying your Web App to Azure Static Web Apps).
3. Copy the URL of the site you just created, navigate to the browser. If the site has finished deploying, you should see the site.
4. Add additional pages in your /content/pages directory. For example, add an about page (similar to the one in this repository).
5. Use the markdown cheat sheet to update the content of the pages.
6. Investigate using Page Bundles to create new blog posts.

Hint: You can check out the ananke theme GitHub repository to see their exampleSite implementation.

7. Share your links in the chat with the group, we'd love to see what you're making! Get creative!
8. Bonus points - If you get to this stage, investigate some of the features of Azure Static Web Apps - Such as Preview Environments, Azure Front Door, Custom Domains and more.

Option 2 - If you would like the 'accelerated' path and want to fork this repository.

1. Fork this repository (Hint: see the tips, references & links section).
2. Navigate to the Azure Doc Tutorial: Publish a Hugo Site to Azure Static Web Apps.
3. Proceed from the Deploy your web app section.
4. Copy the URL of the site you just created, navigate to the browser. If the site has finished deploying, you should see the site.
5. Add additional pages in your /content/pages directory. For example, add an about page (similar to the one in this repository).
6. Use the markdown cheat sheet to update the content of the pages.
7. Investigate using Page Bundles to create new blog posts.

Hint: You can check out the ananke theme GitHub repository to see their exampleSite implementation.

8. Share your links in the chat with the group, we'd love to see what you're making! Get creative!
9. Bonus points - If you get to this stage, investigate some of the features of Azure Static Web Apps - Such as Preview Environments, Azure Front Door, Custom Domains and more.

Tips, References & Links

Git

• Git Cheatsheet

GitHub

• GitHub: Create a new repository
• GitHub: Fork a repository

Hugo

• Hugo: What is hugo?
• Hugo: Getting Started
• Hugo: Ananke Theme by theNewDynamic

Markdown

• Markdown Cheatsheet

Contributing

This project welcomes contributions and suggestions. When you submit code changes, your submissions will be understood under the same MIT License that covers the project.

For detailed guidelines, including Feature Requests, Bug Reports and Code Contributions visit the Contributing Guide.

License

The scripts and documentation in this project are released under the MIT License