Golang 関数を使用してレスポンシブ Web アプリケーションを構築する-Golang-php.cn

Golang 関数を使用してレスポンシブ Web アプリケーションを構築する

PHPz

リリース： 2024-05-02 12:12:01

オリジナル

1027 人が閲覧しました

回答: Golang 関数を使用して、動的なコンテンツと対話型インターフェイスを提供する応答性の高い Web アプリケーションを構築できます。詳細な説明: リクエストに応答する HTTP ハンドラーを定義する Go 関数を作成します。アプリケーションを実行して HTTP サーバーを起動します。 html/template パッケージを使用して、デバイスに基づいてサイズが変更されるレスポンシブコンテンツを追加します。実際のケースを作成し、動的なリストを表示します。アプリケーションを実行し、ブラウザウィンドウの幅に合わせてページが自動的に調整されるのを確認します。

Golang 関数を使用してレスポンシブ Web アプリケーションを構築する

Golang 関数を使用したレスポンシブ Web アプリケーションの構築

Golang 関数を使用したレスポンシブ Web アプリケーションの構築は、迅速かつ効率的に作成できます。コンテンツとインタラクティブなインターフェイス。このチュートリアルでは、簡単なアプリケーションの構築を段階的に説明します。

1. Go 関数を作成します。

main.go という名前のファイルを作成し、次のコードを追加します:

package main

import (
    "fmt"
    "net/http"
)

func main() {
    // 定义一个 HTTP 请求处理函数
    http.HandleFunc("/", func(w http.ResponseWriter, r *http.Request) {
        fmt.Fprintf(w, "Hello, World!")
    })

    // 监听端口 8080
    http.ListenAndServe(":8080", nil)
}

ログイン後にコピー

2. アプリケーションを実行します

#次のコマンドを実行してアプリケーションを開始します:

go run main.go

ログイン後にコピー

3. アプリケーションをテストします#ブラウザで

http://localhost:8080

を開きます。「Hello, World!」というメッセージが表示されるはずです。

4. 応答性の高いコンテンツを追加する

アプリケーションをデバイスサイズの変更に応答させるには、

html/template

パッケージを使用します。次のコードを main.go に追加します。 <div class="code" style="position:relative; padding:0px; margin:0px;"><pre class='brush:go;toolbar:false;'>import "html/template" var tpl *template.Template func init() { tpl = template.Must(template.ParseFiles("index.html")) } func main() { // ...同上。 // 渲染 index.html 模板 tpl.Execute(w, nil) }</pre><div class="contentsignin">ログイン後にコピー</div></div>

templates

ディレクトリに index.html という名前のファイルを作成し、次のコードを追加します。 : <div class="code" style="position:relative; padding:0px; margin:0px;"><pre class='brush:html;toolbar:false;'><!DOCTYPE html> <html> <head> <title>Responsive Web App</title> <meta name="viewport" content="width=device-width, initial-scale=1"> </head> <body> <h1>Hello, World!</h1> </body> </html></pre><div class="contentsignin">ログイン後にコピー</div></div>

5. 応答性の高いコンテンツをテストします

アプリケーションを再実行します。ページのサイズがブラウザウィンドウの幅に合わせて自動的に変更されることがわかります。

実際のケース: 動的リスト

次に、より複雑な実際のケース、つまり動的リストを表示するアプリケーションを構築しましょう。

main.go

を次のように変更します: <div class="code" style="position:relative; padding:0px; margin:0px;"><pre class='brush:go;toolbar:false;'>func main() { // ...同上。 // 创建一个列表 list := []string{"Item 1", "Item 2", "Item 3"} // 将列表传递给模板 tpl.Execute(w, list) }</pre><div class="contentsignin">ログイン後にコピー</div></div>次のコードを

index.html

に追加してリストを表示します:

<ul>
  {{ range $index, $item := . }}
    <li>{{ $index + 1 }}. {{ $item }}</li>
  {{ end }}
</ul>

ログイン後にコピー

 結論これは、Golang 関数を使用してレスポンシブ Web アプリケーションを構築する方法です。このチュートリアルに従うことで、強力な対話型アプリケーションを構築するために必要なツールとスキルを習得できました。 
以上がGolang 関数を使用してレスポンシブ Web アプリケーションを構築するの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。