Decorative Line

INDONESIA

2:54 AM, Cileungsi - Bogor

ARDHIDHANI

DEV

#2

Project

See All Projects

Build Simple File Web App with GARAGE, Fiber, AlpineJS, Flowbite & TailwindCSS

Simple File Web

A lightweight file management web application built with Go Fiber and Alpine.js, using Templ for type-safe HTML templating. The app is designed to work with any S3-compatible storage service and supports login with two-factor authentication (2FA) for a single user.

thumbnail

Link to the repository: simple-file-web repository

Live Demo Simple File Web

Features

  • Secure Login: Protects login with TOTP-based 2FA, compatible with authenticator apps (e.g., Google Authenticator).
  • File Upload: Enables uploading files to S3-compatible storage with real-time feedback.
  • File Listing: Displays a responsive list of uploaded files.
  • Delete Files: Seamlessly removes files from storage without page reloads.
  • Dynamic S3 Configuration: Configure S3 settings (endpoint, access key, secret key, bucket name) through the web interface.
  • Type-Safe Templating with Templ: Uses Templ for rendering HTML templates, providing improved code reliability and readability.

Technologies Used

Backend

  • Go Fiber: Fast, flexible web server framework in Go.
  • Templ: Type-safe HTML templating for Go.
  • TOTP for 2FA: Implements time-based one-time passwords (TOTP) for secure login.

Frontend

  • Alpine.js: Lightweight JavaScript library for interactivity.

Storage

  • S3-Compatible Storage: Works with any S3-compatible storage provider.

Setup Instructions

Prerequisites

  1. Go: Install Go.
  2. S3-Compatible Storage: Ensure access to an S3-compatible storage provider.
  3. Authenticator App: Use an authenticator app (e.g., Google Authenticator) to set up TOTP for the login.

Environment Variables

In the root directory, set up a .env file (or export variables in your shell) with the following configurations:

For PowerShell (Windows):

$env:APP_ENV="development"
$env:PORT="3000"
$env:Alloworigin="*"  # Allowed origins, set to "*" for any origin
$env:DOWNLOAD_URL_EXPIRATION="3600"  # URL expiration time in seconds

For Bash (Linux/Mac):

export APP_ENV="development"
export PORT=3000
export Alloworigin=*
export DOWNLOAD_URL_EXPIRATION=3600

Running Locally

go mod tidy             # Install dependencies
go run main.go          # Start the application

The server will start on http://localhost:3000.

Running with Docker

To quickly build and run the application in a Docker container:

  1. Build the Docker Image

    docker build -t simple-file-web .
  2. Run the Docker Container

    docker run -p 3000:3000 --env-file .env simple-file-web

Note: This project is ideal for learning how to integrate Go Fiber with reactive front-end technologies and Garage S3 for building a simple file management system.


Decorative Line