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

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

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 に追加します。 <pre class='brush:go;toolbar:false;'>import &quot;html/template&quot; var tpl *template.Template func init() { tpl = template.Must(template.ParseFiles(&quot;index.html&quot;)) } func main() { // ...同上。 // 渲染 index.html 模板 tpl.Execute(w, nil) }</pre>

templates

ディレクトリに index.html という名前のファイルを作成し、次のコードを追加します。 : <pre class='brush:html;toolbar:false;'>&lt;!DOCTYPE html&gt; &lt;html&gt; &lt;head&gt; &lt;title&gt;Responsive Web App&lt;/title&gt; &lt;meta name=&quot;viewport&quot; content=&quot;width=device-width, initial-scale=1&quot;&gt; &lt;/head&gt; &lt;body&gt; &lt;h1&gt;Hello, World!&lt;/h1&gt; &lt;/body&gt; &lt;/html&gt;</pre>

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

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

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

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

main.go

を次のように変更します: <pre class='brush:go;toolbar:false;'>func main() { // ...同上。 // 创建一个列表 list := []string{&quot;Item 1&quot;, &quot;Item 2&quot;, &quot;Item 3&quot;} // 将列表传递给模板 tpl.Execute(w, list) }</pre>次のコードを

index.html

に追加してリストを表示します: <pre class='brush:html;toolbar:false;'>&lt;ul&gt; {{ range $index, $item := . }} &lt;li&gt;{{ $index + 1 }}. {{ $item }}&lt;/li&gt; {{ end }} &lt;/ul&gt;</pre>

結論

これは、Golang 関数を使用してレスポンシブ Web アプリケーションを構築する方法です。このチュートリアルに従うことで、強力な対話型アプリケーションを構築するために必要なツールとスキルを習得できました。

以上がGolang 関数を使用してレスポンシブ Web アプリケーションを構築するの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。