Create, customize and deploy your own portfolio website in minutes. ✨
This workshop will guide you through the process of building your own portfolio site using Blazor. You will learn how to create a Blazor WebAssembly application, how to use Blazor components, how to communicate between Blazor components, and how to deploy your Blazor application to GitHub Pages and/or Azure.
- Who is this for? Anyone looking to create a portfolio site, learn web development, or test out Codespaces.
- How much experience do you need? Zero. You decide how much you want to customize based on your experience, and time available.
NOTHING!
All you need to have a GitHub account. If you don't have one, you can create a free account here. Also, you need to have a Chromium-based browser like Microsoft Edge or Google Chrome.
- Step 0: Prepare your development environment
- Step 1: Create new Blazor WebAssembly application
- Step 2: Modify
Homecomponent - Step 3: Add
Aboutsection - Step 4: Add
Portfoliosection - Step 5: Add
HeaderandFootersection - Step 6: Split sections into components
- Step 7: Deploy your Blazor application to GitHub Pages
- Step 8: Deploy your Blazor application to Azure (Optional)
DON'T WORRY ABOUT GETTING STUCK!
Each step has a save point. You can find the save point for each step in the save-points directory. If you get stuck, you can always start from each save point for the step you are working on.
- GitHub Codespaces docs overview
- GitHub Codespaces guides
- Use dev containers locally with VS Code and Docker
- Get started with Blazor
- Web Development for Beginners
If you are using Edge or Chrome you will see an option to install the Codespaces app when you launch your Codespaces. The Codespaces app lets you launch your Codespaces within the app so you can work outside of the browser. Look for the app icon and install pop-up to try it out.
Help us make this template repository better by letting us know and opening an issue!.