1# Konstrui [![Go Report Card](https://goreportcard.com/badge/github.com/arnaucode/konstrui)](https://goreportcard.com/report/github.com/arnaucode/konstrui)
  2
  3web templating engine for static websites, written in Go lang
  4
  5
  6![konstrui](https://raw.githubusercontent.com/arnaucode/konstrui/master/media/konstrui.png "konstrui")
  7
  8
  9## Example
 10
 11#### See the full example on https://github.com/arnaucode/konstrui/tree/master/example
 12
 13
 14- Simple project structure example:
 15
 16```
 17webInput/
 18    konstruiConfig.json
 19    index.html
 20    templates/
 21        userTemplate.html
 22        userTemplate.json
 23```
 24
 25- Set the html file:
 26
 27```html
 28<!DOCTYPE html>
 29<html>
 30<body>
 31
 32<h1>My First Heading</h1>
 33
 34<p>My first paragraph.</p>
 35
 36<konstrui-template html="templates/userTemplate.html" data="templates/userTemplate.json"></konstrui-template>
 37
 38</body>
 39</html>
 40
 41```
 42
 43
 44- Set the template file:
 45
 46```html
 47<div class="class1" id="user[[i]]">
 48    <div id="username[[i]]" class="class2">{{username}}</div>
 49    <div id="description[[i]]" class="class2">{{description}}</div>
 50    <div class="class2">{{phone}}</div>
 51</div>
 52```
 53
 54- Set the template data file:
 55
 56```json
 57[{
 58        "username": "Michaela Doe",
 59        "description": "Hi, I'm here to code",
 60        "phone": "456456456"
 61    },
 62    {
 63        "username": "John Doe",
 64        "description": "Hi, I'm here",
 65        "phone": "123456789"
 66    },
 67    {
 68        "username": "Myself",
 69        "description": "How are you",
 70        "phone": "no phone"
 71    }
 72]
 73```
 74
 75- Set the configuration file konstruiConfig.json in the webInput directory:
 76
 77```json
 78{
 79    "title": "Web example",
 80    "author": "arnaucode",
 81    "github": "github.com/arnaucode",
 82    "website": "arnaucode.com",
 83    "files": [
 84        "index.html",
 85        "projects.html",
 86        "app.css"
 87    ]
 88}
 89```
 90
 91
 92- Execute konstrui
 93
 94```
 95./konstrui
 96```
 97
 98- Output:
 99
100```html
101<!DOCTYPE html>
102<html>
103
104<body>
105    <h1>Heading</h1>
106    <p>Paragraph.</p>
107    <div class="class1" id="user0">
108        <div id="username0" class="class2">Michaela Doe</div>
109        <div id="description0" class="class2">Hi, I'm here to code</div>
110        <div class="class2">456456456</div>
111    </div>
112    <div class="class1" id="user1">
113        <div id="username1" class="class2">John Doe</div>
114        <div id="description1" class="class2">Hi, I'm here</div>
115        <div class="class2">123456789</div>
116    </div>
117    <div class="class1" id="user2">
118        <div id="username2" class="class2">Myself</div>
119        <div id="description2" class="class2">How are you</div>
120        <div class="class2">no phone</div>
121    </div>
122</body>
123
124</html>
125```