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