Build a Simple HTMX Project | HTMX Explained with Examples
Вставка
- Опубліковано 5 чер 2024
- Web Dev Roadmap for Beginners (Free!): bit.ly/DaveGrayWebDevRoadmap
Build a simple HTMX Project in this tutorial. HTMX explained with examples is the fastest way to learn how it works. We will look at a simple CRUD app and review how HTMX works.
💖 Support me on Patreon ➜ / davegray
⭐ Become a full-stack web dev with Zero To Mastery Courses:
- The Complete Web Developer: bit.ly/WebDevMaster
- The Complete Web Designer: bit.ly/CompWebDesign
- Junior to Senior Dev Roadmap: bit.ly/WebDevRoadmap-JrtoSr
🚩 Subscribe ➜ bit.ly/3nGHmNn
📬 Course Updates ➜ courses.davegray.codes/
🚀 Discord ➜ / discord
☕ Buy Me A Coffee ➜ www.buymeacoffee.com/davegray
👇 Follow Me On Social Media:
GitHub: github.com/gitdagray
X: / yesdavidgray
LinkedIn: / davidagray
Blog: www.davegray.codes/
🔗 Source Code: github.com/gitdagray/simple-h...
Build a Simple HTMX Project | HTMX Explained with Examples
(00:00) Intro
(00:05) Welcome
(00:27) HTMX is not HTML
(01:05) Installing HTMX
(01:31) Reviewing the HTMX web page
(05:38) Server Delivering HTML to HTMX
(08:01) Hono Server
(08:44) My Thoughts on HTMX
(09:29) Running the Project
📚 Tutorial References:
🔗 HTMX: htmx.org/
🔗 Hono: hono.dev/
👀 Visual Studio Code: code.visualstudio.com/
Was this Simple HTMX Project tutorial helpful? If so, please share. Let me know your thoughts in the comments.
#htmx #project #simple
I've been waiting to learn HTMX from you. Great content, as always, with clear explanations and examples😊
the timing is just right. thank you so much dave.
Hey! Tuesday Dave! 🤘
Forgot to mention, Yes! absolutely do a Hono tutorial.
Again one of the awesome tutorial. Thanks Dave 😊
That's good. Looks like a great feature.Thank you Dave
Thanks Dave. Hono sounds interesting and a vid on it would be great.
I completed your React and Node.js tutorials and I have no words for thanks to you.
I was struggling with node.js but you make it very simple , again , thanks a lot 😊.
Very much needed ❤
finally, an htmx tut from you. thanks!
Nice, thx Dave 👌
Thank you Dave this is a great first video on HTMX. I just find out a little bug in the backend part. PR added to your project :)
Welcome back Dave!
Thank you so much
More video on htmx
You are great at what you do. I apprecaite you!
Hi, it was interesting Dave!
I like the colors and design you've used on your website and your vedios on UA-cam and anything related to design, it doesn't bother eyes. 👍
Thanks!
5:50 Yes please that would be great.
A very useful explanation of the HTMX concept. As my weapon of choice is PHP (mainly Laravel framework) it is still useful, as I may use HTMX on my next project. Thanks - cheers
Thanks for the tutorial. For others, if you get the error "'tsx' is not recognized as an internal or external command, operable program or batch file.", update npm and/or node.
Just the kinda guy I was waiting to learn HTMX from!!! LFG sir.
Sitting here learning Elysia as you posted this. Perrrrfect!
Hey i liked some of your videos of advance topics in javascript, keep doing more videos like those please :D
Glad you like them!
I'm somewhat excited about that htmx stuff and might explore it. but don't have any experience on that "backend-stuff". I thought I could do it with php or something. I'll see how it goes. x)
I haven't touched htmx yet but man this looks super easy to implement with Firebase functions in a nodejs environment.
Nice tutorial. How would I set the todo items to browser storage?
Great video teacher
It would be good to mention the upsides of generating some of the HTML on the server. Those include moving all the state management to the server so it is in one place. Also, the endpoints no longer need to be versioned since they are specific to the app, not shared like many JSON API’s are.
I love your videos, thanks for making this tutorial. I have a request, can you make a tutorial of (GoLang+HTMX) simple full stack project.
I haven't covered GoLang yet. Good suggestion!
It would be great if u make video hono . Btw Awesome video as always Dave
The great content.
Is Hono a backend framework?
Please, please, please create some project-based tutorials with HTMX.
it's great .
hono video please, AND DAMM THANK YOU FOR THIS HTMX TODO
Dave is a real JS ninja :)
My question is: do you have any experience with .NET and C#? And what do you think about this technology. I think if you could explain this - it would be super popular.
I have limited experience with it. My oldest son prefers C#. It has a lot of similarities to TypeScript because they share the same creator.
Did you do the hone tutorial ....?
I will learn it 🎉
Would love to see Hono tutorial
please do hono and maybe how to deploy it on a server with htmx? thanks in advance..
Have you grown your hair long? I like them
🎉Tnks
It sounds great but it feels like it is reinventing somehow php by depending on a server. Edit: I love your videos. thanks a lot
is htmx sufficient to not use axios anymore?
You will not be using axios with HTMX.
Great
Do you write your code this clear the first time or you redo it at the end?
Yes for the hono video
This was the first time. However, it is always good to go back and clean up code.
Thanks for your tutorial.
I think Astro is better choice than HTMx. Please correct me if I’m wrong.
They can be used together. You don't have to choose one or the other.
Hello, I know this has nothing to do with this video but youve helped me alot wiht videos and im lost so I want to shoot my shot :)... I have coded something in python which I was able to extract to an .exe but I want to send to an user for hhim to use. Which I cant becasue windows deffender detects it as malware and always blocks the download at the user end. I dont want him to download python or put off all anti viruses..
This could be a good discussion for my Discord that is linked in the video description. Other Python users will also be able to comment.
My only question is, how can I run tests on HTMX ?
GO + HTMX is the best
Oh my lord... I did this type of thing decades ago using jQuery Ajax where I'd hackishly return HTML content and inject to html. Then the industry moved to JSON paylods and having some UI framework render the data. Now we are going back to spitting back HTML content? I hope you're not planning on making APIs to some of your data as it seems like you might be doing double work (one end point to get /orders and return JSON... another for /orders to get order list for your front end).
Wait why is it a "monorepo" when there are 2 things, a backend and a fontend, I thought mono means 1 of something...
Lol that's legit question. There is one repo. That's the mono part. If using TypeScript it can share types between the two separate projects within.
bun bun bun
One bun will get it done lol... But yes, you could use it instead of node.
I am the first😅
Thank you for the tutorial. First time hearing about it and I have to say…it feels yucky to me 🤢
I don’t like it lol
It does seem to have a polarizing effect. Either devs really like it or they really don't lol.
@@DaveGrayTeachesCode all love over here. If you like it more power to you. I don’t judge. Let them choose the right tool for them ✊🏾
Thanks again!
unsubbed i dont care about another stupid framework these influencers try to push when they run out of content
You might consider I've had a lot of requests for it. And I'm not an influencer. I'm an educator who loves code and learning new things. I don't push anything.
@@DaveGrayTeachesCode htmx is not a standard, it doenst solve anything and was made by a nobody. your shiny framework will die just like the rest of them, but hey you got your views 🤷this is why I stick to backend only, because stupid shit like this