HOT Reloading The Browser With Templ, Tailwind, And Golang

  Рет қаралды 11,426

Anthony GG

Anthony GG

3 ай бұрын

► Join my Discord community for free education 👉 / discord
► Exclusive Lessons, Mentorship, And Videos 👉 / anthonygg_
► 33% OFF on my Go + HTMX + Templ Course PRESALE 👉bit.ly/3UFruxO
► Enjoy a 60% Black Friday Discount on My Golang Course 👉 fulltimegodev.com
► Learn how I became a self-taught software engineer 👉fulltimegodev.com/#mystory
► Follow me on Twitter 👉 / anthdm
► Follow me on GitHub 👉 github.com/anthdm
Grab yourself a 33% OFF on the PRESALE event of my building production ready applications with GO + HTMX + Templ + Tailwindcss + JQuery course here: bit.ly/3UFruxO
Templ command:
templ generate -watch -proxy=localhost:3000
Tailwind command;
tailwindcss -i view/css/input.css -o public/styles.css --watch
SUBSCRIBE OR NO MARGARITAS
╔═╦╗╔╦╗╔═╦═╦╦╦╦╗╔═╗
║╚╣║║║╚╣╚╣╔╣╔╣║╚╣═╣
╠╗║╚╝║║╠╗║╚╣║║║║║═╣
╚═╩══╩═╩═╩═╩╝╚╩═╩═╝

Пікірлер: 65
@anthonygg_
@anthonygg_ 3 ай бұрын
► 33% OFF on my Go + HTMX + Templ Course PRESALE 👉bit.ly/3UFruxO ► Join my Discord community for free education 👉 discord.com/invite/Ac7CWREe58 ► Exclusive Lessons, Mentorship, And Videos 👉 www.patreon.com/anthonygg_ ► 60% OFF on my Golang course 👉 fulltimegodev.com Thanks for watching
@NiltonOS
@NiltonOS 3 ай бұрын
Anthony nice Course !! -> Go + HTMX + Templ
@thomastthai
@thomastthai 3 ай бұрын
Hi Anthony! Thanks for sharing the video with the community. I wasn't able to find the air config in the description as you mentioned in the video at 03:39. People will find your `.air.toml` configuration file along with your `Makefile` helpful instead of pausing and retyping from the video.
@kal.leroux
@kal.leroux 3 ай бұрын
love you content you are the one who got me in golang 3 month ago when I was considering go or rust
@rochakgupta6116
@rochakgupta6116 3 ай бұрын
Anthony has been balling really hard and I, for one, am loving every minute of it.
@joelazaro461
@joelazaro461 3 ай бұрын
Nice tip. I'm looking forward to trying this.
@SebastianSativaLivemore
@SebastianSativaLivemore 3 ай бұрын
Amazing value as always! Thanks for sharing 🔥
@erikslorenz
@erikslorenz 3 ай бұрын
Yeah I made a middleware to refresh the browser when air restarts the server too. It was the first thing when I started doing a Go-htmx project where I was like what the heck? I need this!
@guhstanley
@guhstanley 3 ай бұрын
Hi man, can you share that with us? I could't make the example from anthony to work as I was getting some random errors. Thank you in advance!
@Kats0unam1
@Kats0unam1 3 ай бұрын
Great stuff as usual, thank you!
@seanknowles9985
@seanknowles9985 3 ай бұрын
If we are already Full time go dev customers do we get the HTMX course included or is an additional purchase my bro?
@user-pc7bv8vk4p
@user-pc7bv8vk4p 3 ай бұрын
Sir please uploaded completely backend tutorial in golang
@sighup124
@sighup124 3 ай бұрын
I also had tried this. Proper way to do it is have some websocket that gets triggered on rebuild and then does the reload. Of course only include it in templ when in dev mode.
@user-ew7vx9xs5u
@user-ew7vx9xs5u 3 ай бұрын
you came in just in the right time ♥♥♥
@SOMEONE-jg6jg
@SOMEONE-jg6jg 3 ай бұрын
I got really interested in golang because of you
@anonymouse1344
@anonymouse1344 3 ай бұрын
which api are you using to generate images or custom model?
@user-ge4uu1gw9r
@user-ge4uu1gw9r 3 ай бұрын
Do you ever plan on doing some with other frameworks or perhaps the standard library standalone? I feel like I inhibited my own learning process by using fiber and having to make a ton of utility functions for things that the standard net/http library does by itself quite easily.
@axMf3qTI
@axMf3qTI 3 ай бұрын
I don't think it's ready to use yet. At least I had a lot of problems. Right now it refuse to give me my latest css file so on the default port of my app I have a different looking page than on port 7331, I had more sync-issues. I switched back to air with template generate and hot-reloading for my css. Not ideal but less frustration. Thanks for the tip tho! Definitely will try again in the future.
@davidhendriksen
@davidhendriksen 3 ай бұрын
Amazing! How did you manage to include DaisyUI as Tailwind plugin?
@anthonygg_
@anthonygg_ 3 ай бұрын
Just add it as a pluging :shrug:
@javadahmadian7782
@javadahmadian7782 3 ай бұрын
Thanks
@guhstanley
@guhstanley 3 ай бұрын
I've tried but got invalid memory address error when executed, then it kept retrying to connect but receiving message "Server not ready". Do you know if any other thing is necessary? Thanks Anthony
@choleralul
@choleralul 3 ай бұрын
Lets go Tony! Free Acid!
@nurayatbeltaev9072
@nurayatbeltaev9072 3 ай бұрын
Can you make the tutor on how to get css files with templ?
@gungun974
@gungun974 3 ай бұрын
Nice, personally I use vite in my golang project so I just edit my Vite configuration to be capable of sending a curl request for manually refreshing the page and i execute this request in my Makefile when build is done. I know make vite work with go is not easy but I can guaranteed it can be great.
@anthonygg_
@anthonygg_ 3 ай бұрын
Can you share this to me?
@gungun974
@gungun974 3 ай бұрын
@@anthonygg_ Of course but I don't think KZbin comment are the best place to share this kink of thing so I join your Discord server. I would be happy to share this via PM first since it's work great for me but I'm currently building my personal utility to build golang projects the way I like it ^^
@gungun974
@gungun974 3 ай бұрын
@@anthonygg_ Forget what I was saying, I made an example Git repo and share it on your Discord for everyone.
@nexovec
@nexovec 2 ай бұрын
Hm, never got a race condition with templ. I've had several other bugs, and a-h has been extremely helpful, even proactive in fixing these. This bit of technology is a bit unique in that it transpiles to go and uses the go compiler to report its own errors, which also makes it hard to make robust. The dev tirelessly works on it and I think it has good future and that's why I currently choose it for all my webdev projects.
@gasanaelvis1777
@gasanaelvis1777 3 ай бұрын
The big Anthooonnn
@WirIez
@WirIez Ай бұрын
Is this HMR or is it live reload?
@smartjackasswisdom1467
@smartjackasswisdom1467 3 ай бұрын
What Api are you using to generate the AI images? I really want to buy it, I'm just really curious in case I need to also allocate some money for the API calls
@anthonygg_
@anthonygg_ 3 ай бұрын
Its a custom trained model. We release it for payed usage soon
@Metruzanca
@Metruzanca 3 ай бұрын
I've got air running all 3 commands using the pre_cmd option
@nexovec
@nexovec 3 ай бұрын
They asked for a hot refresh, they got a hottie refresh.
@danielmadeley2695
@danielmadeley2695 3 ай бұрын
Is this course included in FullTimeGoDev, looking at purchasing today.
@niquedegraaff
@niquedegraaff 3 ай бұрын
How does this work with Echo?
@marcosissler
@marcosissler 3 ай бұрын
I still in love with Svelte. I saw your video about changing to HTMX but still prefer Svelte. It’s soo good. Not sure if HTMX will rock 🚀 and yes. Air is amazing. Tks again for the content.
@puterich
@puterich 3 ай бұрын
I‘m still waiting on your validation thingy you you teased in the course
@zoop2174
@zoop2174 3 ай бұрын
I do something similar, but instead of opening 3 terminals I just have a script run those in a tmux session.
@user-yv5lc8on5x
@user-yv5lc8on5x 3 ай бұрын
anthony can you explain RABBIT MESSAGE QUEUE.... and can you understand with video, please
@Benozo17
@Benozo17 3 ай бұрын
I just use air, nodemon, browser-sync and all runs under npm start
@caiolaytynher5994
@caiolaytynher5994 3 ай бұрын
Sir, are you spying on me? I was literally trying to do this yesterday and couldn't find any good solution, this video is made for me sir
@lazyh0rse
@lazyh0rse 3 ай бұрын
templ & air hotreload are too slow to detect file changes. I have been using entr (Linux program), or fswatch from codeskyblue (native crossplatform go program). Both are extremely responsive. However, they don't have a proxy to hotreload the browser which is a shame.
@anthonygg_
@anthonygg_ 3 ай бұрын
Agree
@viniciusataidedealbuquerqu2837
@viniciusataidedealbuquerqu2837 3 ай бұрын
maybe they use a polling technique which is really unresponsive
@zyracelreyes3059
@zyracelreyes3059 3 ай бұрын
is it possible while using htmx to submit a response to the browser with the HX-Refresh header for hotreload?
@jogurtnaturalny
@jogurtnaturalny 16 күн бұрын
what is brown and sticky? A STICK!!!
@hexskull1
@hexskull1 3 ай бұрын
can you post the full air.toml file?
@hipertracker
@hipertracker 3 ай бұрын
I drop air because of not only race conditions but mainly for leaving zombie processes after I stopped the script. I switched to "wgo - watcher-go" . My command refresh *.go and recompile *.templ with: @wgo -file=.go -file=.templ -xfile=_templ.go templ generate :: go run .
@adamsribz
@adamsribz 3 ай бұрын
ya but this doesn't reload the browser page
@hipertracker
@hipertracker 3 ай бұрын
​@ibz yes, but it's still better than having to manually kill zombie processes after every terminal session ends
@mai-evan
@mai-evan 3 ай бұрын
I bet the zombie processes could be avoided if you caught the os signal and handled context closing. I had this exact same issue and gave up on it and after trying many things came back to air and said I gotta figure this out.
@naufaldbei4234
@naufaldbei4234 3 ай бұрын
hey was wondering if you know how to make nvim detects templ files? was stuck and switched out to vscode again because of this lol
@axMf3qTI
@axMf3qTI 3 ай бұрын
There is a templ lsp for nvim look in the templ docs under IDE support. It's explained there.
@naufaldbei4234
@naufaldbei4234 3 ай бұрын
@@axMf3qTI hey so i figutred it out but now im stuck on the formatting section, been trying to do what the docs said but somehow the `templ fmt` does not run when i write the buffer. Any idea how to do this? I use lazy nvim and i put the formatting code section from the docs on one of the plugins (example.lua). I put it inside a function on the config property
@NiltonOS
@NiltonOS 3 ай бұрын
Hi Anthony, I'm your student on the HTMX course, but the project link on github is no longer available, you can update with the correct link, thank you.
@anthonygg_
@anthonygg_ 3 ай бұрын
Download llink in last video
@jogurtnaturalny
@jogurtnaturalny 3 ай бұрын
I'm leaving some stuff in comment as requested
@byerikboltimur5375
@byerikboltimur5375 3 ай бұрын
Hello sir , i am hesitating moving from vue.js to golang htmx . Please write me ur opinion . Golang htmx is server side rendering right ?
@fikurimax
@fikurimax 3 ай бұрын
I should set playback speed to 0.75 everytime I watch your videos 😢. I should practice English more
@mehmetuysal163
@mehmetuysal163 3 ай бұрын
O_O
@hamm8934
@hamm8934 2 ай бұрын
you really need content policy headers...
This Golang + HTMX Trick Is Beyond Amazing
5:42
Anthony GG
Рет қаралды 8 М.
Introducing The GoTTH Stack - Go, Tailwind CSS, Templ & HTMX
28:29
New Gadgets! Bycycle 4.0 🚲 #shorts
00:14
BongBee Family
Рет қаралды 16 МЛН
2000000❤️⚽️#shorts #thankyou
00:20
あしざるFC
Рет қаралды 13 МЛН
He tried to save his parking spot, instant karma
00:28
Zach King
Рет қаралды 23 МЛН
The Truth About HTMX
12:27
Theo - t3․gg
Рет қаралды 166 М.
A Practical Example How To Use Interfaces In Golang
14:42
Anthony GG
Рет қаралды 18 М.
DJI Focus Pro: Game-Changing Lidar Autofocus!
9:34
NigelBarros
Рет қаралды 9 М.
How the PROS Use Tailwind
9:55
Frontend FYI
Рет қаралды 42 М.
HTMX & Go with ThePrimeagen | Preview
15:58
Frontend Masters
Рет қаралды 145 М.
Golang + HTMX Is The Most Productive Stack And This Is Why
15:07
Golang Channels Or Wait Groups? Let Me Explain.
18:32
Anthony GG
Рет қаралды 17 М.
The Ultimate Go Web Stack: A-H Templ, HTMX, Tailwind CSS, MariaDB
19:20
New Gadgets! Bycycle 4.0 🚲 #shorts
00:14
BongBee Family
Рет қаралды 16 МЛН