テンプレートエンジンを使って簡単なindex.htmlを表示できるようにする

fruscianteee · Oct 19, 2023 · d605079 · d605079
1 parent 99b951a
commit d605079
Show file tree

Hide file tree

Showing 3 changed files with 26 additions and 2 deletions.
diff --git a/Cargo.toml b/Cargo.toml
@@ -7,3 +7,5 @@ edition = "2021"
 
 [dependencies]
 actix-web = "4"
+askama = "0.12.1"
+askama_actix = "0.14.0"
diff --git a/src/main.rs b/src/main.rs
@@ -1,8 +1,16 @@
 use actix_web::{get, post, web, App, HttpResponse, HttpServer, Responder};
+use askama::Template;
+#[derive(Template)]
+#[template(path = "index.html")]
+struct Index {
+    name: String,
+}
 
 #[get("/")]
 async fn hello() -> impl Responder {
-    HttpResponse::Ok().body("Hello world!")
+    Index {
+        name: "Actix".to_string(),
+    }
 }
 
 #[post("/echo")]
@@ -13,7 +21,6 @@ async fn echo(req_body: String) -> impl Responder {
 async fn manual_hello() -> impl Responder {
     HttpResponse::Ok().body("Hey there!")
 }
-
 #[actix_web::main]
 async fn main() -> std::io::Result<()> {
     HttpServer::new(|| {

diff --git a/templates/index.html b/templates/index.html
@@ -0,0 +1,15 @@
+<!DOCTYPE html>
+<html lang="jp">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <script src="https://unpkg.com/htmx.org@1.9.6"></script>
+    <title>Document</title>
+  </head>
+
+  <body>
+    <div>hello, {{ name }} !!!</div>
+    <button hx-get="/hey" hx-swap="innerHTML" hx-target="#target">Click Me</button>
+    <div id="target"></div>
+  </body>
+</html>