diff --git a/src/main/java/de/hsel/itech/jsf/BookInfo.java b/src/main/java/de/hsel/itech/jsf/BookInfo.java
index d4231be..b29cf27 100644
--- a/src/main/java/de/hsel/itech/jsf/BookInfo.java
+++ b/src/main/java/de/hsel/itech/jsf/BookInfo.java
@@ -1,23 +1,48 @@
 package de.hsel.itech.jsf;
 
+import de.hsel.itech.db.Database;
+import de.hsel.itech.db.pojo.Author;
+import de.hsel.itech.db.pojo.Book;
+
 import javax.faces.bean.ManagedBean;
-import javax.faces.bean.SessionScoped;
+import javax.faces.bean.ViewScoped;
+import java.util.ArrayList;
+import java.util.List;
 
 //JSF Bean for bookinfo
-@ManagedBean(name="bookInfo", eager=true)
-@SessionScoped
+@ManagedBean(name="bookInfo")
+@ViewScoped
 public class BookInfo {
+    private Book book;
 
-    private String test;
-
-    BookInfo(){
-        test = "test String";
+    public BookInfo(){
+        book = Database.getInstance().getBooks().get(2);
     }
 
-    public String getTest(){
-        return test;
+    public Book getBook(){
+        return book;
     }
-    public void setTest(String str){
-        test = str;
+
+    public void setBook(Book book){
+        this.book = book;
+    }
+
+    public String getPrice(){
+        String res = "";
+        res += book.getPrice() / 100;
+        res+= ",";
+        if(book.getPrice() % 100 < 10){
+            res += "0";
+        }
+        res += book.getPrice() % 100;
+        return res;
+    }
+
+    public String getAuthors(){
+        List<String> authors = new ArrayList<>();
+        for (Author author : book.getAuthors()) {
+            authors.add(author.getName());
+        }
+        return String.join(", ",authors);
     }
 }
diff --git a/src/main/webapp/bookinfo.xhtml b/src/main/webapp/bookinfo.xhtml
index e9c8d22..66a7e18 100644
--- a/src/main/webapp/bookinfo.xhtml
+++ b/src/main/webapp/bookinfo.xhtml
@@ -11,10 +11,39 @@
 
         <ui:define name="content">
 
-            <h:outputLabel value="Hello, world"/>
-            <h:outputLabel value="test: #{bookInfo.test}"/>
+            <div class="m-row">
+
+                <div class="m-col-l-4">
+                    <img class="m-image" src="https://source.unsplash.com/#{bookInfo.book.image}/900x900" alt="Buchcover"/>
+                </div>
+                <div class="m-col-l-4">
+                    <h1>#{bookInfo.book.title}</h1>
+                    <br/>
+                    <h2>
+                        #{bookInfo.authors}
+                        </h2>
+                    <br/>
+                    <span>
+                        #{bookInfo.book.description}
+                </span>
+                </div>
+                <div class="m-col-l-4">
+                    <div class="m-block">
+                        <h3>#{bookInfo.price} &#8364;</h3>
+                        <br/>
+                        gewöhnlich versandfertig in <span class="m-text m-success">2-3 Tagen</span>
+                        <br/>
+                        <br/>
+                        <div class="m-button m-success">
+                            <a href="#">
+                                <i class="fas fa-cart-plus"/>
+                                in den Warenkorb
+                            </a>
+                        </div>
+                    </div>
+                </div>
+            </div>
 
-            <h:messages />
 
         </ui:define>