Gooo^("goo")

!!Gooo has been sidelined by me for the time being.... It was an explortation on how I could build a better developer experience building applications with go, templ, vue, and echo. Please see below for all of the features that were at one point offered :) !!This is a work in progress and not meant for production yet!!

Gooo^("goo") is a powerful and flexible toolkit for developing modern web applications using Go, Templ, Vue 3, and Echo. It is designed to enhance the developer experience with features like router prefetching, Vue HMR (Hot Module Replacement), Go live reloading, and Tailwind CSS live reloading. The toolkit is fully customizable, allowing developers to tailor it to their specific needs while maintaining a rapid development workflow. You can change anything

The code is delivered as-is directly from the Tmmcmasters/Gooo repository. Execute the get-gooo script and follow the instructions for ease of setup and use. The terminal script that is run is get-gooo which is from this repository. See Get-Gooo

For more documentation, see gooo.dev (NOT FINISHED/PUBLISHED YET)

Table of Contents

• Features
• Getting Started
  • Prerequisites
  • Installation / Setup
  • Development Workflow
• Project Structure
• Configuration
• Contributing
• License
• Contact

Features

• Vue 3 Integration: Leverage the power of Vue 3 Composition API with Vite for a fast and modern front-end development experience.
• Vite Integration: Utilize Vite for a lightning-fast development experience with hot module reloading and automatic bundling.
• Templ for Go: Use Templ to create type-safe, performant server-side rendered templates in Go.
• Echo Framework: Utilize the lightweight and fast Echo web framework for building robust Go backends.
• Hot Reloading:
  • Vue HMR for instant front-end updates.
  • Go live reloading for seamless backend.
  • Templ Proxy Live reloading for server-side templates.
  • Tailwind CSS live reloading for real-time styling updates.
• Router Prefetching: Improve performance with intelligent router prefetching for faster page loads with GoooLink.
• Tailwind CSS: Utilize Tailwind CSS for styling and responsive design.
• Shadcn-Vue: Utilize Shadcn-vue(out of the box) for a modern and accessible UI library or whatever you want.
• Customizable: Fully customizable setup to adapt to various project requirements.
• TypeScript Support: Out of the box with Vite and Vue Single File Components.
• Linting and Formatting: Built-in support for ESLint and Prettier for code quality and formatting.
• Included Dockerfile: A ready-to-run Dockerfile for easy deployment.
• Included Makefile: A ready-to-run Makefile for easy development and deployment.
• Included Env Script/Files: A customizable ready-to-run env script for easy deployment.

Getting Started

Prerequisites

Ensure you have the following installed:

• Node.js (v22+ recommended)
• npm
• Go
• Templ (For the server side templates)
• Make (for development and deployment)

Installation-Setup

1. Download and Run the Get-Gooo script:

   For Linux/MacOS

   curl -L -o get-gooo https://github.com/Tmmcmasters/Get-Gooo/raw/refs/heads/main/get-gooo
   chmod +x get-gooo
   ./get-gooo

   For Windows

   Invoke-WebRequest -Uri https://github.com/Tmmcmasters/Get-Gooo/raw/refs/heads/main/get-gooo.exe -OutFile get-gooo.exe
   .\get-gooo.exe

2. Install Templ CLI:

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

3. Install Front-end dependencies:

   npm install

4. Run go mod tidy for good fortune

   go mod tidy

5. Ensure that you have Make installed

   make --version

   If you don't have Make installed, you can download it from https://www.gnu.org/software/make/.

   If you are on a windows terminal, it is advised to setup WSL so that you can use the Makefile. If you do not want to use WSL, you might be able to setup Make with Chocolatey. Check this Article: Medium Article

6. Generate environment variables

   make build-gen-envs
   make gen-envs

7. Run locally

   make run

Development Workflow

1. Run the development server:

   make run

2. Run the prod server:

   make run-build

Project Structure

Gooo/
├── .github/
├── .vscode/
├── client/
│   ├── components/         # Vue components
│   ├── composables/        # Vue composable functions
│   ├── layout/             # Vue layout templates
│   ├── lib/                # Vue library functions
│   ├── page/               # Vue page templates
│   ├── stores/             # Vue pinia stores
│   ├── utils/              # Vue utility functions
│   ├── home.ts             # Vue home page entrypoint
│   ├── themeSwitcher.ts    # Vue theme switcher entrypoint
│   └── todos.ts            # Vue todo page entrypoint
├── constants/
├── gen/                    # Vite generated files
│── generate-envs/          # Generates env files go script
│── generate-manifest/      # Generates manifest files go script
│── handlers/               # Server-side handlers for API
│── helpers/                # Helper functions
│── inject-tailwind/        # Injects Tailwind CSS into template files
├── node_modules/
├── server/                 # Backend server-side-templates
│   ├── components/         # General components
│   ├── generated/          # Auto-generated templates
│   ├── icons/              # Icon components
│   ├── layout/             # Layout templates for server
│   ├── pages/              # Server-side pages templates
│   └── utility/            # Utility templates for server
├── static/                 # Static assets like favicon.ico
├── tmp/
│   └── main
├── .air.toml
├── .editorconfig
├── .env.dev                # Actual dev env file that is read
├── .env.dev2               # Template dev env file
├── .env.prod
├── .env.prod2
├── .gitattributes
├── .gitignore
├── Dockerfile
├── env.d.ts
├── eslint.config.js
├── go.mod
├── go.sum
├── LICENSE
├── Makefile
├── notes.md
├── package.json
├── package-lock.json
├── railway.json
├── README.md
├── tailwind.css
├── tsconfig.json
├── tsconfig.app.json
├── tsconfig.node.json
└── vite.config.ts

Configuration

• No Special Configs for now
• Vite Configuration: Customize the Vite setup by editing vite.config.ts. Refer to the Vite Configuration Reference for details.
• Tailwind CSS: Tailwind is pre-configured for live reloading. Modify tailwind.css to customize styles.
• Echo Routes: Define server routes in the Go backend using the Echo framework. Check main.go for examples.
• Dockerfile: Use the provided Dockerfile for deployment. Adjust as you see fit.
• Makefile: Use the provided Makefile for development and deployment. Adjust as you see fit.
• .air.toml: Customize the Air configuration for Go live reloading. Refer to the Air Configuration Reference for details.
• components.json: The components for shadcn-vue.
• .j2 env files: Customize the environment variables and then run the gen-env command in the Makefile.
• .prettierrc.json: Customize the Prettier configuration. Refer to the Prettier Configuration Reference for details.
• eslint.config.ts: Customize the ESLint configuration. Refer to the ESLint Configuration Reference for details.

Contributing

Contributions are welcome! To contribute:

1. Fork the repository.
2. Create a new branch (git checkout -b feature/your-feature).
3. Make your changes and commit (git commit -m "Add your feature").
4. Push to your branch (git push origin feature/your-feature).
5. Open a pull request.

Please ensure your code follows the project's linting rules and includes appropriate tests.

License

This project is licensed under the MIT License. See the LICENSE file for details.

Contact

For questions, issues, or suggestions, please open an issue on the GitHub repository.

---

© 2025 Timothy McMasters. Built with Gooo^("goo").