Bytesize is a web application template designed to help you kickstart your web development projects with ease. The core philosophy of Bytesize is simplicity and lightweight performance.

Features

• Preconfigured Pocketbase Backend: Easily manage your backend with Pocketbase.
• Modern Frontend Stack: Utilizes Templ, HTMX, Tailwind CSS, and DaisyUI for a seamless and responsive user interface.
• Hot Reloading: Air is preconfigured to enable hot reloading in the browser, enhancing your development workflow.

Prerequisites

Before you begin, ensure you have the following installed:

1. Go: Download Go

2. Node and NPM: Download Node.js and NPM

3. Air: Install Air with the following command:

   curl -sSfL https://raw.githubusercontent.com/air-verse/air/master/install.sh | sh -s -- -b $(go env GOPATH)/bin

   Then, alias Air (if Air is not found):

   alias air='$(go env GOPATH)/bin/air'

4. Templ: Install Templ with the following command:

   Note: You may need to run the templ generate --watch --proxy="http://localhost:3000" --open-browser=true command manually the first time before using the makefile command.

   go install github.com/a-h/templ/cmd/templ@latest

   Add the Go path to your shell configuration file (~/.bashrc or ~/.zshrc):

   export PATH=$PATH:$(go env GOPATH)/bin

   Source the file:

   source ~/.bashrc
   # or
   source ~/.zshrc

   Check the Templ version:

   templ --version

5. TailwindCSS: Install TailwindCSS with NPM:

   npm install -D tailwindcss

   Initialize TailwindCSS:

   npx tailwindcss init

Getting Started

To get started with Bytesize, follow these steps:

1. Clone the Repository:

   git clone https://github.com/cmcd97/bytesize.git
   cd bytesize

2. Install Dependencies:

   go mod tidy
   npm install

   you make also need to run templ generate to generate the go files otherwise you will get an error stating that your local packages are not found

3. Run the Application in Development Mode:

   make dev

4. Build the Binary:

   If you just want to build the binary you will find an app binary in the ./bin directory after running this command. Ensure that you are building for the desired OS.

   make build

Documentation

Every directory contains a README.md file which explains the purpose of the directory and how you can make use of it. Feel free to delete these if you want, they are only there to help provide context to the repo structure.

Disclaimer

A large amount of the documentation is generated by ChatGPT, I will update it as I use this template in my future projects, otherwise feel free submit improvements

Real world examples:

Submit a PR or create an issue to add your projects here

• OffsideFPL: A fresh take on Fantasy Premier League (FPL), designed to raise the stakes in your mini leagues! Each week, managers compete to climb the leaderboard while avoiding suspension.
  • Repository Link

Inspiration

I started learning Go by building webapps with HTMX and Templ. I learned a lot from the Anthony GG YouTube channel and based my first template off of this video and the Superkit repo. After building a few apps with this template I wanted to try an integrate Pocketbase. I came across pocketbase-htmx from a reddit thread. I really liked the project structure of this repo but it didn't include any hot reloading (Air) or any sort of styling. Bytesize is my attempt of taking the hot reloading and UI styling from Superkit and combining it with the project structure of pocketbase-htmx.