Website Howto

| Nov 10, 2022
  • Facebook is terrible for discoverability and fuck mark zuckerbrerg.
    • Facebook makes it hard to find what you need.
    • Facebook makes it hard to know who is interested vs who just wants to browse
  • A real website feels professional.

Accounts to Create

Netlify

Github

Software to Install

Install Github Desktop

Install Typora

Install Notepad ++

Install Git

Install Go

Install Python

Install NodeJS

Install Hugo

Install additional NPM Packages for Docsy Theme

  • npm install autoprefixer
  • npm install postcss-cli
  • npm install postcss

Install Netlify CLI

Discussion

Open Source

  • Freely distributed software with a permissive license

Markdown

  • https://commonmark.org/help
  • Why use markdown
    • Easy to read.
    • Good editors.
    • Converts to other formats.
      • Converting from Word using Typora.
      • Exporting to PDF with Typora.

Yaml

Hugo

Hugo Frontmatter

Docsy Hugo Theme

Running Hugo Locally

  • Why do this?

    • Test Changes before sending to the website
    • Run at the campsite
  • How do you do this

    • Run from the root of the website folder
    • hugo server -D
    • http://localhost:1313/

Git

  • Commits/Changes

  • Local and Remote

  • Github Desktop Application

  • Github Web User Interface

  • Command Line Interface

    • git add .;git commit -m 'updates'; git push
  • Branches - Make a version of the site for Staff/NPC’s or for testing.

  • Blame/Annotate - See who made a change and when.

  • Binary Files - Use large file storage. This is only for Text not for Binary Files.

  • Triggered “build”

    • Netlify doesn’t deploy if build fails!

Netlify

Lets make this website!

Before we get started

  • This is as easy as this process can be but this is NOT a novice process it’s technical and intiminating. If you decide this it too much for your needs thank you for your time I can either configure this for you or we can find a tool that works better for you like Squarespace or Wix.
  • We will be using the command line and you will need to take notes.
  • We will go as slow as the slowest person on the call.
  • If you have any questions ask and we will talk it through. No need to stay confused.
    • If you want to go over this again please let me know we can just go through any parts you have had problems with.

Configure Local Hugo Instance

Configure Netlify Integration

  • add github repository in netlify ui.
  • pick a subdomain.
  • redirects
    • I use one for Discord and the google feedback form.
    • public/_redirects
  • configure Netlify CLI
  • confirm that build and deploy worked good

Configure Site URL in Hugo Setup File

  • update configuration file
  • push
  • confirm that we are good. Watch it build

Configure Search in Hugo Setup File

Configure Github in Hugo Setup File

Configure Favicon

https://www.docsy.dev/docs/adding-content/iconsimages/

Configure Large Media Setup

Static resources

  • Static Resources Folder
    • PDF
      • Layout with Affinity Designer
    • Epub
      • Convert with Typora / Panadoc
    • Maps / Large images

Next Steps

  • Escaping from facebook means that you need to start to build all of the things that facebook “does” but do it without their tools

  • Mailing list?

Printed books

  • How do they relate back to your website. Which is the “cannon” source

    • Lulu

    • Mixiam