このアーキテクチャでは、Astro が 静的サイトの生成とアセットの最適化を担当し、事前にレンダリングされた HTML、CSS、JavaScript ファイルを作成します。高性能で効率的な配信を実現します。 Go Fiber は、動的データ処理、API 統合、静的ファイルの提供 を処理し、リアルタイムのデータ更新と効率的なサーバー側ルーティングとミドルウェア管理を提供します。この組み合わせにより、両方のテクノロジーの長所が活用され、パフォーマンスが高くスケーラブルな Web アプリケーションが作成されます。
これは、Astro と Go Fiber を使用したハイブリッド レンダリング アーキテクチャを使用して Web アプリケーションを作成するためのステップバイステップのガイドです。
npm create astro@latest cd my-astro-site
src/pages/index.astro を作成します:
--- export const prerender = true; --- <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>{Astro.props.title}</title> <link rel="stylesheet" href="/assets/style.css"> </head> <body> <h1>{Astro.props.title}</h1> <p>{Astro.props.message}</p> <script src="/assets/script.js"></script> </body> </html>
src/assets/style.css を作成します:
body { font-family: Arial, sans-serif; background-color: #f0f0f0; margin: 0; padding: 20px; }
src/assets/script.js を作成します:
document.addEventListener('DOMContentLoaded', () => { console.log('Astro and Go Fiber working together!'); });
npm run build
go mod init mysite go get github.com/gofiber/fiber/v2
main.go を作成します:
package main import ( "log" "github.com/gofiber/fiber/v2" "path/filepath" "encoding/json" "io/ioutil" "bytes" "os/exec" "net/http" ) // Function to render Astro template func renderAstroTemplate(templatePath string, data map[string]interface{}) (string, error) { cmd := exec.Command("astro", "build", "--input", templatePath) // Pass data to template via stdin jsonData, err := json.Marshal(data) if err != nil { return "", err } cmd.Stdin = bytes.NewBuffer(jsonData) output, err := cmd.CombinedOutput() if err != nil { return "", fmt.Errorf("failed to execute astro build: %s", string(output)) } // Read generated file outputPath := filepath.Join("dist", "index.html") content, err := ioutil.ReadFile(outputPath) if err != nil { return "", err } return string(content), nil } func main() { app := fiber.New() // Serve static files from the dist directory app.Static("/", "./my-astro-site/dist") app.Get("/", func(c *fiber.Ctx) error { data := map[string]interface{}{ "title": "My Astro Site", "message": "Welcome to my site built with Astro and Go Fiber!", } htmlContent, err := renderAstroTemplate("./my-astro-site/src/pages/index.astro", data) if err != nil { return c.Status(http.StatusInternalServerError).SendString(err.Error()) } return c.Type("html").SendString(htmlContent) }) log.Fatal(app.Listen(":3000")) }
go run main.go
ブラウザを開いて http://localhost:3000 に移動します。
この例では、Astro が静的サイトの生成を処理し、最適化された HTML、CSS、および JavaScript ファイルを作成します。 Go Fiber はこれらの静的ファイルを提供し、データをテンプレートに動的に挿入して、リアルタイムのデータ更新を可能にします。このハイブリッド レンダリング アーキテクチャは、両方のテクノロジーの長所を活用して、パフォーマンスとスケーラブルな Web アプリケーションを作成します。
以上がAstro と Go Fiber を使用したハイブリッド レンダリング アーキテクチャの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。