Skip to content

Instantly share code, notes, and snippets.

@oscar230
Last active January 10, 2024 07:24
Show Gist options
  • Save oscar230/e9ff521a4dd1d0b6cc9475cb509472f9 to your computer and use it in GitHub Desktop.
Save oscar230/e9ff521a4dd1d0b6cc9475cb509472f9 to your computer and use it in GitHub Desktop.
simple-html-build-script
#!/bin/bash
SRCDIR=$1
OUTDIR=$2
HTMLPATH=$3
COMPONENTSDIR=$SRCDIR"/components/"
sed "s/$(basename $HTMLPATH)//" $COMPONENTSDIR"header.html" > temporaryfilepleaseremove.html
cat temporaryfilepleaseremove.html $HTMLPATH $COMPONENTSDIR"footer.html" > $OUTDIR"/"$(basename $HTMLPATH)
rm temporaryfilepleaseremove.html
echo "Built page $page"
#!/bin/bash
SRCDIR="src"
OUTDIR="out"
PAGES=$SRCDIR"/pages/*"
rm -rf $OUTDIR/*
mkdir -p $OUTDIR
cp -r $SRCDIR/resources/ $OUTDIR
cp -r $SRCDIR/styles/ $OUTDIR
cp $SRCDIR/* $OUTDIR 2>/dev/null
for page in $PAGES; do
[ -e "$page" ] || continue
sh build-page.sh $SRCDIR $OUTDIR $(realpath $page)
done
echo "Site built successfully!"
#!/bin/bash
SRCDIR="./src/"
OUTDIR="./out/"
SRCHASHSUM=$(sh ./hashdir.sh $SRCDIR)
sh "./build-site.sh"
echo "\e[34mWill open $(realpath $OUTDIR/index.html) using default browser.\e[39m"
open $(realpath $OUTDIR/index.html) 2>/dev/null &
echo "\e[34mWatching directory $SRCDIR...\e[39m"
while true; do
PRESRCHASHSUM=$SRCHASHSUM
SRCHASHSUM=$(sh ./hashdir.sh $SRCDIR)
if [ "$PRESRCHASHSUM" = "$SRCHASHSUM" ]; then
sleep 0.5
else
echo "\e[34mDirectory fingerptint changed...\e[39m \e[90m($SRCHASHSUM)\e[39m"
sh "./build-site.sh"
fi
done
#!/bin/bash
HASHSUM=$(find $1 -type f \( -exec sha1sum "$PWD"/{} \; \) | awk '{print $1}' | sort | sha1sum)
echo $HASHSUM
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>AAA</title>
<link rel="shortcut icon" href="favicon.ico" type="image/x-icon">
<link rel="stylesheet" href="styles/main.css">
</head>
<body itemscope itemtype="https://schema.org/WebPage">
<meta itemprop="accessibilityControl" content="fullKeyboardControl">
<meta itemprop="accessibilityControl" content="fullMouseControl">
<meta itemprop="accessibilityHazard" content="noFlashingHazard">
<meta itemprop="accessibilityHazard" content="noMotionSimulationHazard">
<meta itemprop="accessibilityHazard" content="noSoundHazard">
<meta itemprop="accessibilityAPI" content="ARIA">
<header itemscope itemtype="https://schema.org/Organization">
<h1 id="globalTitle" itemprop="name">
<a href="index.html" itemprop="url"></a>
Oscar
</h1>
</header>
<main aria-label="Main content" aria-label="Main content" itemscope itemtype="https://schema.org/Blog">
<article>
<p>ABC</p>
</article>

Setup

Directory tree

  • src/
    • components/
      • footer.html
      • header.html
    • pages/
      • index.html
    • resources/
    • styles/
      • fonts/
      • main.css
  • favicon.ico
  • robots.txt
  • build-page.sh
  • build-site.sh
  • dev.sh
  • hashdir.sh

Requirements

  • Bash
  • awk
  • sha1sum
  • realpath

Build production

sh build-site.sh

Develop

sh dev.sh
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment