Skip to main content

Single Page Application (SPA)

Github StackBlitz

This project demonstrates how to set up a Single Page Application (SPA) using React for the frontend and Go with the Fiber framework for the backend.

Prerequisites​

Ensure you have the following installed:

  • Golang
  • Node.js
  • npm

Setup​

  1. Clone the repository:

    git clone https://github.com/gofiber/recipes.git
    cd recipes/spa

  2. Install frontend dependencies:

    cd frontend
    npm install

  3. Install backend dependencies:

    cd ../backend
    go get

Usage​

Building Frontend Assets​

  1. Build the frontend assets:

    cd frontend
    npm run build

  2. Watch frontend assets for changes:

    npm run dev

Running the Application​

  1. Start the Fiber backend application: 
    cd backend
    go run main.go

Example​

Here is an example of how to set up a basic route in the Fiber backend to serve the React frontend:

package main

import (
    "github.com/gofiber/fiber/v2"
    "github.com/gofiber/fiber/v2/middleware/logger"
)

func main() {
    app := fiber.New()

    // Middleware
    app.Use(logger.New())

    // Serve static files
    app.Static("/", "./frontend/dist")

    // API routes
    app.Get("/api/hello", func(c *fiber.Ctx) error {
        return c.JSON(fiber.Map{"message": "Hello, World!"})
    })

    // Start server
    app.Listen(":3000")
}

References​