diff --git a/.editorconfig b/.editorconfig
new file mode 100755
index 0000000..383dbae
--- /dev/null
+++ b/.editorconfig
@@ -0,0 +1,13 @@
+root = true
+
+[*]
+charset = utf-8
+end_of_line = lf
+indent_style = space
+indent_size = 2
+insert_final_newline = true
+trim_trailing_whitespace = true
+
+[*.php]
+indent_style = space
+indent_size = 4
diff --git a/.gitignore b/.gitignore
new file mode 100644
index 0000000..3a9875b
--- /dev/null
+++ b/.gitignore
@@ -0,0 +1,2 @@
+/vendor/
+composer.lock
diff --git a/README.md b/README.md
new file mode 100644
index 0000000..46e6a85
--- /dev/null
+++ b/README.md
@@ -0,0 +1,71 @@
+Custom Element
+==============
+
+This library allows you to define custom elements for usage in (Twig) templates.
+
+Think of it as light-weight SSR (Server Side Rendererd) Web Components.
+
+For example, you can create a new element such as `
' . htmlspecialchars($html) . ''; + } + + // Create array of all custom element names used in the doc + $elementNames = []; + foreach($doc->getElementsByTagName('*') as $element ){ // Find all elements + $name = $element->nodeName; + // Only include element names starting with uppercase character + if (ctype_upper($name[0])) { + $elementNames[$name] = $name; + } + } + // print_r($elementNames);exit(); + + foreach ($elementNames as $elementName) { + $elements = $doc->getElementsByTagName($elementName); + while (count($elements) > 0) { + foreach ($elements as $element) { + $data = [ + 'ElementName' => $element->nodeName, + ]; + foreach ($element->attributes as $a) { + $data[$a->nodeName] = $a->nodeValue; + } + + $templateName = 'elements/' . $elementName . '.html.twig'; + try { + $html = $this->twig->render($templateName, $data); + } catch (\Exception $e) { + $html = '