Cum să folosești Templ în Goravel
<h2 id=instaleaza-framework-ul-si-pluginuri>Instaleaza framework-ul si pluginuri</h2><p>Primul pas este să instalăm
<a href=https://goravel.dev/ target=_blank rel=noopener>Goravel</a>
. Este un framework complet cu foarte multe funcții scris în Go pentru programatorii familiari cu framework-ul Laravel.</p><p>Pașii din documentația
<a href=https://github.com/goravel/docs/blob/master/getting-started/installation.md target=_blank rel=noopener>Getting started</a>
:</p><div class=highlight><pre tabindex=0 style=color:#d0d0d0;background-color:#202020;-moz-tab-size:4;-o-tab-size:4;tab-size:4><code class=language-bash data-lang=bash><span style=display:flex><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:.4em;padding:0 .4em;color:#686868"> 1</span><span>// Descarcă framework-ul
</span></span><span style=display:flex><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:.4em;padding:0 .4em;color:#686868"> 2</span><span>git clone https://github.com/goravel/goravel.git
</span></span><span style=display:flex><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:.4em;padding:0 .4em;color:#686868"> 3</span><span>rm -rf goravel/.git*
</span></span><span style=display:flex><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:.4em;padding:0 .4em;color:#686868"> 4</span><span>
</span></span><span style=display:flex><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:.4em;padding:0 .4em;color:#686868"> 5</span><span>// Instalează dependențele
</span></span><span style=display:flex><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:.4em;padding:0 .4em;color:#686868"> 6</span><span><span style=color:#24909d>cd</span> goravel
</span></span><span style=display:flex><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:.4em;padding:0 .4em;color:#686868"> 7</span><span>go mod tidy
</span></span><span style=display:flex><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:.4em;padding:0 .4em;color:#686868"> 8</span><span>
</span></span><span style=display:flex><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:.4em;padding:0 .4em;color:#686868"> 9</span><span>// Crează fișierul .env
</span></span><span style=display:flex><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:.4em;padding:0 .4em;color:#686868">10</span><span>cp .env.example .env
</span></span><span style=display:flex><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:.4em;padding:0 .4em;color:#686868">11</span><span>
</span></span><span style=display:flex><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:.4em;padding:0 .4em;color:#686868">12</span><span>// Generează cheia aplicației
</span></span><span style=display:flex><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:.4em;padding:0 .4em;color:#686868">13</span><span>go run . artisan key:generate
</span></span></code></pre></div><p>Acum instalează
<a href=https://templ.guide/quick-start/installation target=_blank rel=noopener>templ</a>
pentru randare html și
<a href="https://github.com/cosmtrek/air?tab=readme-ov-file#installation" target=_blank rel=noopener>air</a>
pentru hot reloading:</p><div class=highlight><pre tabindex=0 style=color:#d0d0d0;background-color:#202020;-moz-tab-size:4;-o-tab-size:4;tab-size:4><code class=language-bash data-lang=bash><span style=display:flex><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:.4em;padding:0 .4em;color:#686868">1</span><span>go install github.com/a-h/templ/cmd/templ@latest
</span></span><span style=display:flex><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:.4em;padding:0 .4em;color:#686868">2</span><span>go install github.com/cosmtrek/air@latest
</span></span></code></pre></div><h2 id=configurare-structură-front-end>Configurare structură front-end</h2><p>(încă în lucru - voi actualiza tutorialul cu variabile globale și script push)</p><p>• În fișierul <code>/.gitignore</code> adaugă această linie: <code>*_templ.go</code></p><p>• Șterge fișierul <code>resources/views/welcome.tmpl</code></p><p>• Creează 2 foldere în <code>resources/views/</code> cu numele <code>home</code> și <code>parts</code></p><p>• În folderul <code>resources/views/parts/</code> creează 3 fișiere:</p><p> 1. <code>resources/views/parts/header.templ</code></p><div class=highlight><pre tabindex=0 style=color:#d0d0d0;background-color:#202020;-moz-tab-size:4;-o-tab-size:4;tab-size:4><code class=language-go data-lang=go><span style=display:flex><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:.4em;padding:0 .4em;color:#686868">1</span><span><span style=color:#6ab825;font-weight:700>package</span> parts
</span></span><span style=display:flex><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:.4em;padding:0 .4em;color:#686868">2</span><span>
</span></span><span style=display:flex><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:.4em;padding:0 .4em;color:#686868">3</span><span>templ <span style=color:#447fcf>Header</span>() {
</span></span><span style=display:flex><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:.4em;padding:0 .4em;color:#686868">4</span><span> <h1>Header</h1>
</span></span><span style=display:flex><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:.4em;padding:0 .4em;color:#686868">5</span><span>}
</span></span></code></pre></div><p> 2. <code>resources/views/parts/footer.templ</code></p><div class=highlight><pre tabindex=0 style=color:#d0d0d0;background-color:#202020;-moz-tab-size:4;-o-tab-size:4;tab-size:4><code class=language-go data-lang=go><span style=display:flex><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:.4em;padding:0 .4em;color:#686868">1</span><span><span style=color:#6ab825;font-weight:700>package</span> parts
</span></span><span style=display:flex><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:.4em;padding:0 .4em;color:#686868">2</span><span>
</span></span><span style=display:flex><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:.4em;padding:0 .4em;color:#686868">3</span><span>templ <span style=color:#447fcf>Footer</span>() {
</span></span><span style=display:flex><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:.4em;padding:0 .4em;color:#686868">4</span><span> <footer>
</span></span><span style=display:flex><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:.4em;padding:0 .4em;color:#686868">5</span><span> <p>&copy; <span style=color:#3677a9>2024</span> MyProject</p>
</span></span><span style=display:flex><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:.4em;padding:0 .4em;color:#686868">6</span><span> </footer>
</span></span><span style=display:flex><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:.4em;padding:0 .4em;color:#686868">7</span><span>}
</span></span></code></pre></div><p> 3. <code>resources/views/parts/template.templ</code></p><div class=highlight><pre tabindex=0 style=color:#d0d0d0;background-color:#202020;-moz-tab-size:4;-o-tab-size:4;tab-size:4><code class=language-go data-lang=go><span style=display:flex><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:.4em;padding:0 .4em;color:#686868"> 1</span><span><span style=color:#6ab825;font-weight:700>package</span> parts
</span></span><span style=display:flex><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:.4em;padding:0 .4em;color:#686868"> 2</span><span>
</span></span><span style=display:flex><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:.4em;padding:0 .4em;color:#686868"> 3</span><span>templ <span style=color:#447fcf>Template</span>() {
</span></span><span style=display:flex><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:.4em;padding:0 .4em;color:#686868"> 4</span><span> <!DOCTYPE html>
</span></span><span style=display:flex><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:.4em;padding:0 .4em;color:#686868"> 5</span><span> <html>
</span></span><span style=display:flex><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:.4em;padding:0 .4em;color:#686868"> 6</span><span> <head>
</span></span><span style=display:flex><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:.4em;padding:0 .4em;color:#686868"> 7</span><span> <title>My Page</title>
</span></span><span style=display:flex><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:.4em;padding:0 .4em;color:#686868"> 8</span><span> <meta charset=<span style=color:#ed9d13>"utf-8"</span>/>
</span></span><span style=display:flex><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:.4em;padding:0 .4em;color:#686868"> 9</span><span> <meta http-equiv=<span style=color:#ed9d13>"Content-Type"</span> content=<span style=color:#ed9d13>"text/html; charset=utf-8"</span>/>
</span></span><span style=display:flex><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:.4em;padding:0 .4em;color:#686868">10</span><span> <meta name=<span style=color:#ed9d13>"viewport"</span> content=<span style=color:#ed9d13>"width=device-width, initial-scale=1"</span>/>
</span></span><span style=display:flex><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:.4em;padding:0 .4em;color:#686868">11</span><span> <!-- Your styles <span style=color:#6ab825;font-weight:700>go</span> here -->
</span></span><span style=display:flex><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:.4em;padding:0 .4em;color:#686868">12</span><span> </head>
</span></span><span style=display:flex><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:.4em;padding:0 .4em;color:#686868">13</span><span> <body>
</span></span><span style=display:flex><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:.4em;padding:0 .4em;color:#686868">14</span><span> <span style=color:#a61717;background-color:#e3d2d2>@</span><span style=color:#447fcf>Header</span>()
</span></span><span style=display:flex><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:.4em;padding:0 .4em;color:#686868">15</span><span> { children... }
</span></span><span style=display:flex><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:.4em;padding:0 .4em;color:#686868">16</span><span> <span style=color:#a61717;background-color:#e3d2d2>@</span><span style=color:#447fcf>Footer</span>()
</span></span><span style=display:flex><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:.4em;padding:0 .4em;color:#686868">17</span><span> <!-- Your scripts <span style=color:#6ab825;font-weight:700>go</span> here -->
</span></span><span style=display:flex><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:.4em;padding:0 .4em;color:#686868">18</span><span> <script src=<span style=color:#ed9d13>"//unpkg.com/alpinejs"</span> <span style=color:#6ab825;font-weight:700>defer</span>></script>
</span></span><span style=display:flex><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:.4em;padding:0 .4em;color:#686868">19</span><span> </body>
</span></span><span style=display:flex><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:.4em;padding:0 .4em;color:#686868">20</span><span> </html>
</span></span><span style=display:flex><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:.4em;padding:0 .4em;color:#686868">21</span><span>}
</span></span></code></pre></div><p>• Creează componenta de pagină principală: <code>resources/views/home/index.templ</code></p><div class=highlight><pre tabindex=0 style=color:#d0d0d0;background-color:#202020;-moz-tab-size:4;-o-tab-size:4;tab-size:4><code class=language-go data-lang=go><span style=display:flex><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:.4em;padding:0 .4em;color:#686868"> 1</span><span><span style=color:#6ab825;font-weight:700>package</span> home
</span></span><span style=display:flex><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:.4em;padding:0 .4em;color:#686868"> 2</span><span>
</span></span><span style=display:flex><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:.4em;padding:0 .4em;color:#686868"> 3</span><span><span style=color:#6ab825;font-weight:700>import</span> <span style=color:#ed9d13>"goravel/resources/views/parts"</span>
</span></span><span style=display:flex><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:.4em;padding:0 .4em;color:#686868"> 4</span><span>
</span></span><span style=display:flex><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:.4em;padding:0 .4em;color:#686868"> 5</span><span>templ <span style=color:#447fcf>Index</span>() {
</span></span><span style=display:flex><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:.4em;padding:0 .4em;color:#686868"> 6</span><span> <span style=color:#a61717;background-color:#e3d2d2>@</span>parts.<span style=color:#447fcf>Template</span>() {
</span></span><span style=display:flex><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:.4em;padding:0 .4em;color:#686868"> 7</span><span> <h1>Homepage</h1>
</span></span><span style=display:flex><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:.4em;padding:0 .4em;color:#686868"> 8</span><span> <div>Templ is awesome</div>
</span></span><span style=display:flex><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:.4em;padding:0 .4em;color:#686868"> 9</span><span> }
</span></span><span style=display:flex><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:.4em;padding:0 .4em;color:#686868">10</span><span>}
</span></span></code></pre></div><p>Documentația templ pentru
<a href=https://templ.guide/syntax-and-usage/template-composition target=_blank rel=noopener>componente copii este aici</a>
. Există un exemplu pentru o structură layout dar mie îmi place mai mult metoda cu componentă copil.</p><h2 id=folosește-componenta-pagina-principală-în-controller>Folosește componenta pagina principală în controller</h2><p>Am facut un fișier <code>app/http/controllers/controller.go</code> unde pot salva cateva funcții ajutătoare care vor fii accesibile din orice controller.</p><div class=highlight><pre tabindex=0 style=color:#d0d0d0;background-color:#202020;-moz-tab-size:4;-o-tab-size:4;tab-size:4><code class=language-go data-lang=go><span style=display:flex><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:.4em;padding:0 .4em;color:#686868"> 1</span><span><span style=color:#6ab825;font-weight:700>package</span> controllers
</span></span><span style=display:flex><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:.4em;padding:0 .4em;color:#686868"> 2</span><span>
</span></span><span style=display:flex><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:.4em;padding:0 .4em;color:#686868"> 3</span><span><span style=color:#6ab825;font-weight:700>import</span> (
</span></span><span style=display:flex><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:.4em;padding:0 .4em;color:#686868"> 4</span><span> <span style=color:#ed9d13>"github.com/a-h/templ"</span>
</span></span><span style=display:flex><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:.4em;padding:0 .4em;color:#686868"> 5</span><span> <span style=color:#ed9d13>"github.com/goravel/framework/contracts/http"</span>
</span></span><span style=display:flex><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:.4em;padding:0 .4em;color:#686868"> 6</span><span>)
</span></span><span style=display:flex><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:.4em;padding:0 .4em;color:#686868"> 7</span><span>
</span></span><span style=display:flex><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:.4em;padding:0 .4em;color:#686868"> 8</span><span><span style=color:#6ab825;font-weight:700>func</span> <span style=color:#447fcf>RenderTempl</span>(c http.Context, comp templ.Component) http.Response {
</span></span><span style=display:flex><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:.4em;padding:0 .4em;color:#686868"> 9</span><span> c.<span style=color:#447fcf>Response</span>().<span style=color:#447fcf>Status</span>(<span style=color:#3677a9>200</span>)
</span></span><span style=display:flex><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:.4em;padding:0 .4em;color:#686868">10</span><span> c.<span style=color:#447fcf>Response</span>().<span style=color:#447fcf>Header</span>(<span style=color:#ed9d13>"Content-Type"</span>, <span style=color:#ed9d13>"text/html"</span>)
</span></span><span style=display:flex><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:.4em;padding:0 .4em;color:#686868">11</span><span> comp.<span style=color:#447fcf>Render</span>(c, c.<span style=color:#447fcf>Response</span>().<span style=color:#447fcf>Writer</span>())
</span></span><span style=display:flex><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:.4em;padding:0 .4em;color:#686868">12</span><span> <span style=color:#6ab825;font-weight:700>return</span> <span style=color:#6ab825;font-weight:700>nil</span>
</span></span><span style=display:flex><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:.4em;padding:0 .4em;color:#686868">13</span><span>}
</span></span></code></pre></div><p>Funcția asta randează componenta templ în response buffer cu status http 200 Ok.
Acum putem folosii funcția în <code>app/http/controllers/home_controller.go</code></p><div class=highlight><pre tabindex=0 style=color:#d0d0d0;background-color:#202020;-moz-tab-size:4;-o-tab-size:4;tab-size:4><code class=language-go data-lang=go><span style=display:flex><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:.4em;padding:0 .4em;color:#686868"> 1</span><span><span style=color:#6ab825;font-weight:700>package</span> controllers
</span></span><span style=display:flex><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:.4em;padding:0 .4em;color:#686868"> 2</span><span>
</span></span><span style=display:flex><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:.4em;padding:0 .4em;color:#686868"> 3</span><span><span style=color:#6ab825;font-weight:700>import</span> (
</span></span><span style=display:flex><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:.4em;padding:0 .4em;color:#686868"> 4</span><span> <span style=color:#ed9d13>"goravel/resources/views/home"</span>
</span></span><span style=display:flex><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:.4em;padding:0 .4em;color:#686868"> 5</span><span> <span style=color:#ed9d13>"github.com/goravel/framework/contracts/http"</span>
</span></span><span style=display:flex><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:.4em;padding:0 .4em;color:#686868"> 6</span><span>)
</span></span><span style=display:flex><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:.4em;padding:0 .4em;color:#686868"> 7</span><span>
</span></span><span style=display:flex><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:.4em;padding:0 .4em;color:#686868"> 8</span><span><span style=color:#6ab825;font-weight:700>type</span> HomeController <span style=color:#6ab825;font-weight:700>struct</span> {
</span></span><span style=display:flex><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:.4em;padding:0 .4em;color:#686868"> 9</span><span> <span style=color:#999;font-style:italic>//Dependent services
</span></span></span><span style=display:flex><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:.4em;padding:0 .4em;color:#686868">10</span><span><span style=color:#999;font-style:italic></span>}
</span></span><span style=display:flex><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:.4em;padding:0 .4em;color:#686868">11</span><span>
</span></span><span style=display:flex><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:.4em;padding:0 .4em;color:#686868">12</span><span><span style=color:#6ab825;font-weight:700>func</span> <span style=color:#447fcf>NewHomeController</span>() *HomeController {
</span></span><span style=display:flex><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:.4em;padding:0 .4em;color:#686868">13</span><span> <span style=color:#6ab825;font-weight:700>return</span> &HomeController{
</span></span><span style=display:flex><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:.4em;padding:0 .4em;color:#686868">14</span><span> <span style=color:#999;font-style:italic>//Inject services
</span></span></span><span style=display:flex><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:.4em;padding:0 .4em;color:#686868">15</span><span><span style=color:#999;font-style:italic></span> }
</span></span><span style=display:flex><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:.4em;padding:0 .4em;color:#686868">16</span><span>}
</span></span><span style=display:flex><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:.4em;padding:0 .4em;color:#686868">17</span><span>
</span></span><span style=display:flex><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:.4em;padding:0 .4em;color:#686868">18</span><span><span style=color:#6ab825;font-weight:700>func</span> (r *HomeController) <span style=color:#447fcf>Index</span>(ctx http.Context) http.Response {
</span></span><span style=display:flex><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:.4em;padding:0 .4em;color:#686868">19</span><span> <span style=color:#999;font-style:italic>// doing awesome stuff here
</span></span></span><span style=display:flex><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:.4em;padding:0 .4em;color:#686868">20</span><span><span style=color:#999;font-style:italic></span> <span style=color:#6ab825;font-weight:700>return</span> <span style=color:#447fcf>RenderTempl</span>(ctx, home.<span style=color:#447fcf>Index</span>())
</span></span><span style=display:flex><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:.4em;padding:0 .4em;color:#686868">21</span><span>}
</span></span></code></pre></div><p>Acum adaugăm o nouă rută:</p><div class=highlight><pre tabindex=0 style=color:#d0d0d0;background-color:#202020;-moz-tab-size:4;-o-tab-size:4;tab-size:4><code class=language-go data-lang=go><span style=display:flex><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:.4em;padding:0 .4em;color:#686868"> 1</span><span><span style=color:#6ab825;font-weight:700>package</span> routes
</span></span><span style=display:flex><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:.4em;padding:0 .4em;color:#686868"> 2</span><span>
</span></span><span style=display:flex><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:.4em;padding:0 .4em;color:#686868"> 3</span><span><span style=color:#6ab825;font-weight:700>import</span> (
</span></span><span style=display:flex><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:.4em;padding:0 .4em;color:#686868"> 4</span><span> <span style=color:#ed9d13>"goravel/app/http/controllers"</span>
</span></span><span style=display:flex><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:.4em;padding:0 .4em;color:#686868"> 5</span><span> <span style=color:#ed9d13>"github.com/goravel/framework/facades"</span>
</span></span><span style=display:flex><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:.4em;padding:0 .4em;color:#686868"> 6</span><span>)
</span></span><span style=display:flex><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:.4em;padding:0 .4em;color:#686868"> 7</span><span>
</span></span><span style=display:flex><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:.4em;padding:0 .4em;color:#686868"> 8</span><span><span style=color:#6ab825;font-weight:700>func</span> <span style=color:#447fcf>Web</span>() {
</span></span><span style=display:flex><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:.4em;padding:0 .4em;color:#686868"> 9</span><span> homeController := controllers.<span style=color:#447fcf>NewHomeController</span>()
</span></span><span style=display:flex><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:.4em;padding:0 .4em;color:#686868">10</span><span> facades.<span style=color:#447fcf>Route</span>().<span style=color:#447fcf>Get</span>(<span style=color:#ed9d13>"/"</span>, homeController.Index)
</span></span><span style=display:flex><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:.4em;padding:0 .4em;color:#686868">11</span><span>}
</span></span></code></pre></div><h2 id=configurare-hot-reloading-folosind-air>Configurare hot reloading folosind Air</h2><p>Goravel are deja configurația pentru Air în fișierul <code>.air.toml</code>, trebuie doar să adăugăm comanda <code>templ generate</code> în parametrul cmd, ca în exemplu:</p><div class=highlight><pre tabindex=0 style=color:#d0d0d0;background-color:#202020;-moz-tab-size:4;-o-tab-size:4;tab-size:4><code class=language-diff data-lang=diff><span style=display:flex><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:.4em;padding:0 .4em;color:#686868">1</span><span>[build]
</span></span><span style=display:flex><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:.4em;padding:0 .4em;color:#686868">2</span><span> bin = "./storage/temp/main"
</span></span><span style=display:flex><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:.4em;padding:0 .4em;color:#686868">3</span><span><span style=color:#d22323>- cmd = "go build -o ./storage/temp/main ."
</span></span></span><span style=display:flex><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:.4em;padding:0 .4em;color:#686868">4</span><span><span style=color:#d22323></span><span style=color:#589819>+ cmd = "templ generate && go build -o ./storage/temp/main ."
</span></span></span></code></pre></div><p>Dacă lucrezi pe Windows adaugă <code>.exe</code> dupa cuvantul <code>main</code> și pentru parametrul <code>bin</code> și <code>cmd</code>:</p><div class=highlight><pre tabindex=0 style=color:#d0d0d0;background-color:#202020;-moz-tab-size:4;-o-tab-size:4;tab-size:4><code class=language-toml data-lang=toml><span style=display:flex><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:.4em;padding:0 .4em;color:#686868">1</span><span>[build]
</span></span><span style=display:flex><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:.4em;padding:0 .4em;color:#686868">2</span><span> bin = <span style=color:#ed9d13>"./storage/temp/main.exe"</span>
</span></span><span style=display:flex><span style="white-space:pre;-webkit-user-select:none;user-select:none;margin-right:.4em;padding:0 .4em;color:#686868">3</span><span> cmd = <span style=color:#ed9d13>"templ generate && go build -o ./storage/temp/main.exe ."</span>
</span></span></code></pre></div><p>Gata ! Happy coding !</p><hr width=100% id=EOF><p style=color:#777>Ultima modificare la 2024-11-18</p>