IT Nota

  • Home
  • How To
  • .NET
  • WordPress
  • Contact
You are here: Home / How To / How to Setup Visual Studio Code for Hugo Static Site Generator

How to Setup Visual Studio Code for Hugo Static Site Generator

Based on a few questions on how to setup an environment to edit content using Hugo, here’s a few simple steps to follow if you want a quick and easy way to do it. Keep in mind, the beauty of using Hugo is that you are free to use any text editor you like.

This is not the only way to do it but this will get you there fast if you don’t have anything setup yet.

Assumptions

  1. Hugo is already installed, if not please check out the steps on how to install Hugo. For Windows OS, here’s a simple way to install Hugo.

  2. Git for Windows is also installed and setup. This is an optional step but it’s highly recommended if you want to track your edit history.

Steps

  1. Download and install Visual Studio Code. Once done, launch the editor.

  2. Download the following Visual Studio Code extensions to help you [Markdown Shortcuts, Better TOML, Git History]. While this step is optional, it will help to speed up your workflow in creating/editing your static site.

    Visual Studio Code Extensions for Hugo

  3. Once you created your Hugo workspace, open the folder from Visual Studio Code.

That’s about it and you’re ready to create your Hugo static site.

When you’re ready to publish the site, check out the post below if you’re thinking about hosting it on an IIS server.

Further Reading

How to Install Hugo on Windows 10
How to Deploy Hugo Static Website to IIS Using Git
How to Setup Naked Domain to Resolve in Cloudflare Pages
How to Open Visual Studio Code from command line macOS

Downloads

Visual Studio Code
Git
Hugo

May 30, 2018 Filed Under: How To Tagged With: Code Editor, Hugo, JAMStack, Microsoft, Visual Studio Code

Leave a Reply Cancel reply

Your email address will not be published. Required fields are marked *

Buy me a coffee Support this site
Buy Me a Coffee?

Categories

  • .NET
  • Coding
  • Cybersecurity
  • Database
  • How To
  • Internet
  • Multimedia
  • Photography
  • Programming
  • Resources
  • Review
  • Tips and Tricks
  • Use Case
  • WordPress
  • Writing

Recent Posts

  • How to Check Installed .NET Framework Version
  • How to Remove .NET Runtime and SDK on Mac
  • How to Solve Intermittent 403 Error in IIS
  • How to Show Hidden Folders and Files in Mac Finder
  • How to Solve MS Office VBA Compile Error UserAuthentication

Recent Posts

  • How to Check Installed .NET Framework Version
  • How to Remove .NET Runtime and SDK on Mac
  • How to Solve Intermittent 403 Error in IIS
  • How to Show Hidden Folders and Files in Mac Finder
  • How to Solve MS Office VBA Compile Error UserAuthentication
  • RSS

Tags

.NET Access AdSense ASP.NET Cdonts Dll Classic ASP Code Editor ETL FSharp Genesis Framework Git Google HP Asset Manager HTML HTML5 Hugo IIS Information Security Internet Internet Information Services iOS JAMStack Linux macOS Microsoft Microsoft SQL Server MVC PHP Python Simple Mail Transfer Protocol Smtp Server Social Media SQL SQL Server SSIS SSMS SSRS Sublime Text Visual Studio Visual Studio Code VPN Windows Windows 8 Windows 10 Windows Server

Copyright © 2011-2022 IT Nota. All rights reserved. Terms of Use | Privacy Policy | Disclosure