Тёмный

Alpine JS Tutorial | Build a Todo App 

The Code Creative
Подписаться 13 тыс.
Просмотров 18 тыс.
50% 1

A tutorial on Alpine JS, a lightweight but powerful JavaScript framework. In this Alpine.js tutorial, we learn the basics of AlpineJS and build a todo app using the framework.
Created by Gregg Fine.
#javascript #alpinejs #webdevelopment
Download my FREE "Google Search Secrets for Developers" Cheat Sheet:
store.thecodec...
Join The Code Creative Community on Facebook:
/ thecodecreative
🔴Subscribe for more free Code Creative videos: : / @thecodecreative
🌐 The Code Creative Official Website
www.thecodecre...
🎓 The Code Creative Courses
www.thecodecre...
▬About The Code Creative ▬▬▬▬▬▬▬▬▬▬▬▬
The Code Creative helps web developers learn the fundamentals of programming, algorithms, as well as the latest frameworks and libraries. You can expect web development content that is fun, clear and concise, and keeps you engaged with visuals and a touch of humor.
▬Social Media ▬▬▬▬▬▬▬▬▬▬
▸ Twitter - @GreggFine
▸ Instagram - /greggfinedev
▸ Facebook - / thecodecreative
✅ Recommended related videos:
Debouncing Explained
• Debouncing Explained |...
Memoization Explained
• JavaScript Memoization...
Sorting in JavaScript Explained
• JavaScript Comparator ...
✅ For business inquiries contact me at gregg@greggfinedev.com

Опубликовано:

 

29 сен 2024

Поделиться:

Ссылка:

Скачать:

Готовим ссылку...

Добавить в:

Мой плейлист
Посмотреть позже
Комментарии : 79   
@TheCodeCreative
@TheCodeCreative 2 года назад
Download my FREE "Google Search Secrets for Developers" Cheat Sheet: store.thecodecreative.com/google-secrets-cheat-sheet
@silasbispo01
@silasbispo01 2 года назад
This is powerful!! Jquery should work like this...
@Mozescodes
@Mozescodes 2 года назад
It's basically just copy paste of VueJS only difference it's lightweight as it doesn't have a CLI
@raheescodenex1707
@raheescodenex1707 2 года назад
cool and easy , please make more video on alpineJs, ( a video x-for with key id)
@TheCodeCreative
@TheCodeCreative 2 года назад
Thanks for watching and for the suggestion!
@ramsundararaman6615
@ramsundararaman6615 Год назад
This is really a cool and crisp tutorial on Alpine. Thanks for doing this. What is the intellisense plugin you had used for VSCode?
@TheCodeCreative
@TheCodeCreative Год назад
Thanks! I believe it's just the built-in Intellisense from VSCode
@ramsundararaman6615
@ramsundararaman6615 Год назад
@@TheCodeCreative I did post a reply to this but seems to be disappearing!
@TheCodeCreative
@TheCodeCreative Год назад
@@ramsundararaman6615 not sure why
@ramsundararaman6615
@ramsundararaman6615 Год назад
@@TheCodeCreative i posted a link to GitHub page where I posted an update. Does this prevent links?
@pamungkasandono
@pamungkasandono 8 месяцев назад
I cant imagine alphine js + tailwind how long the div is 😂😂😂
@TheCodeCreative
@TheCodeCreative 8 месяцев назад
😮
@emausdetiquicia6636
@emausdetiquicia6636 Месяц назад
This is great. Not only learned about Alpine but saw a real life application of the knowledge acquired.
@TheCodeCreative
@TheCodeCreative Месяц назад
Awesome!
@paulfx5019
@paulfx5019 4 месяца назад
Great tutorial! Would be cool to combine HTMX & Alpine.js together don't you think?
@TheCodeCreative
@TheCodeCreative 4 месяца назад
That would be cool!
@dmitryzhuravlev-nevsky1388
@dmitryzhuravlev-nevsky1388 2 месяца назад
Thank you for the detailed explanation. You helped me a bunch in my work on the current project!
@TheCodeCreative
@TheCodeCreative 2 месяца назад
Great to hear!
@HeyNoah
@HeyNoah 2 года назад
Super cool video Gregg! Thanks so much! Really valuable!
@TheCodeCreative
@TheCodeCreative 2 года назад
Hey Noah, glad to hear!
@mohamedmidou3494
@mohamedmidou3494 Месяц назад
can you make a crud application with alpine js ?
@TheCodeCreative
@TheCodeCreative 2 года назад
🎓 Course Available!: "DOM Events and JavaScript": store.thecodecreative.com/dom-events-and-javascript
@TheCodeCreative
@TheCodeCreative 2 года назад
🎓 New Course Available! "Scrollytelling 101": store.thecodecreative.com/scrollytelling
@th3ja
@th3ja Год назад
Short, sweet and straight to the point! Thank you! Alpine's amazing!
@TheCodeCreative
@TheCodeCreative Год назад
Yes, it is! Thanks for watching!
@JaimitoAleman
@JaimitoAleman 2 года назад
Greatly enjoyed this simple walk-through. Thanks for taking it slow & easy for us Newbs :)
@TheCodeCreative
@TheCodeCreative 2 года назад
Glad you enjoyed it, thanks!
@PraveenKumarThakur-h3x
@PraveenKumarThakur-h3x 3 месяца назад
Excellent 👌
@TheCodeCreative
@TheCodeCreative 3 месяца назад
Thank you! Cheers!
@TheCodeCreative
@TheCodeCreative 2 года назад
Join "The Code Creative Community" group on Facebook: facebook.com/groups/thecodecreative
@리진-s3m
@리진-s3m Год назад
Thank you so much.🥰
@TheCodeCreative
@TheCodeCreative Год назад
Thanks for checking it out!
@VVesson
@VVesson 2 года назад
Sure I'd love to watch more videos about Alpine. I like small framework like this. Make any videos you feel right to make 👍
@TheCodeCreative
@TheCodeCreative 2 года назад
Great! Thanks for the feedback 👍🏻
@kasiparimal7768
@kasiparimal7768 2 года назад
This is a good resource to learn alpine. How would you go about adding an edit button to an already created todo task? While editing the task how if you want to cancel the edit how could you implement a cancel button?
@jaybah
@jaybah 2 года назад
Very short and simple video! Keep it up man. You got yourself a subscriber :)
@TheCodeCreative
@TheCodeCreative 2 года назад
Thanks for the sub Jeffrey!
@asghariarash
@asghariarash 2 года назад
thank you so much
@TheCodeCreative
@TheCodeCreative 2 года назад
Thanks for checking it out!
@abdelrazeksayedmohmmed2891
@abdelrazeksayedmohmmed2891 Год назад
very awesome
@TheCodeCreative
@TheCodeCreative Год назад
👍🏻👍🏻👍🏻
@AMDesignAndDev
@AMDesignAndDev 2 года назад
This is a great video my friend! Keep up the great work
@TheCodeCreative
@TheCodeCreative 2 года назад
Thanks for watching, I appreciate it!
@AnuradhaPathirana
@AnuradhaPathirana 6 месяцев назад
straight to the point! Thank you! ♥
@TheCodeCreative
@TheCodeCreative 6 месяцев назад
Glad to hear, thanks for watching!
@ademineshat
@ademineshat 2 года назад
very nice tutorial, very well explained, also interesting voice. This deserves more likes and subscribers
@TheCodeCreative
@TheCodeCreative 2 года назад
Thanks! I appreciate it!
@jugibur2117
@jugibur2117 Год назад
Great stuff, thank you for your effort! I'm only wondering why this works: :class="{'completed' : todo.completed}" An objects property name with a 'true' value is assigned to a css class So there seems to be some magic under to hood...
@matchflixCH
@matchflixCH Год назад
This was very useful for me. I would love to see to go further with AlpineJS and even add some JS modules to it.
@TheCodeCreative
@TheCodeCreative Год назад
Glad to hear, thanks Simon!
@Way_Of_The_Light
@Way_Of_The_Light 2 года назад
Very cool man! Please keep making cool tutorials like this. Subscribed 🙏
@TheCodeCreative
@TheCodeCreative 2 года назад
Thanks! Will do!
@Snowboardbound
@Snowboardbound Год назад
Absolutely amazing tutorial! Thanks!
@TheCodeCreative
@TheCodeCreative Год назад
Glad it was helpful!
@DejanAleksic007
@DejanAleksic007 2 года назад
Great tutorial. I've really enjoyed ;)
@TheCodeCreative
@TheCodeCreative 2 года назад
Thanks Dejan, glad you enjoyed it!
@jeno427
@jeno427 2 года назад
Cool tutorial! How would you sync it with a form rendered on the server side? Can't find any examples of that, yet Alpine is used with SSR sites.
@kidbrave_7673
@kidbrave_7673 2 года назад
Thank you The Code Creative for creating such an amazing tutorial teaching us how to use alpine js from a beginner level! 😁🙏
@TheCodeCreative
@TheCodeCreative 2 года назад
Thank you for watching!
@kidbrave_7673
@kidbrave_7673 2 года назад
@@TheCodeCreative Absolutely! I did want to ask, since I'm new to learning alpine.js. Do you know if you could build a front-end game using this framework like you would with OOP in vanilla js?
@rafaeldiasmartins4369
@rafaeldiasmartins4369 8 месяцев назад
THE BEST TUTORIAL VIDEO ABOUT ALPINE JS
@TheCodeCreative
@TheCodeCreative 8 месяцев назад
Glad to hear, thanks for watching!
@Cenit16
@Cenit16 2 года назад
Great tutorial, straigth to the point and clear explanation, thanks!!!
@TheCodeCreative
@TheCodeCreative 2 года назад
Glad you enjoyed it!
@BobbyBundlez
@BobbyBundlez Год назад
This basically turns html into a programming language. So cool.
@BobbyBundlez
@BobbyBundlez Год назад
This with tailwind is a fucking beast. Literally everything compact and written snugly in your html. Unreal
@TheCodeCreative
@TheCodeCreative Год назад
✊🏻 💯
@juguetestoys1137
@juguetestoys1137 2 года назад
great !! could you implement local storage in this project ?
@gaetano222
@gaetano222 2 года назад
Just excellent! Thank you!
@TheCodeCreative
@TheCodeCreative 2 года назад
Thanks Gaetano!
@rickybarabba7866
@rickybarabba7866 2 года назад
Another gem. Thanks.
@TheCodeCreative
@TheCodeCreative 2 года назад
Glad you enjoyed it
@jeremiahhasudungansihombin1882
@jeremiahhasudungansihombin1882 2 года назад
Thank Youuu🙌🙌
@TheCodeCreative
@TheCodeCreative 2 года назад
Welcome!!
@ahmedserag7072
@ahmedserag7072 2 года назад
good job
@TheCodeCreative
@TheCodeCreative 2 года назад
thanks 👍🏻
@Anonymous-op7yy
@Anonymous-op7yy 2 года назад
Great video
@TheCodeCreative
@TheCodeCreative 2 года назад
Thanks Fardeen!
Далее
Say No To Complexity With AlpineJS - Caleb Porzio
32:04
Alpine.js Crash Course
42:02
Просмотров 125 тыс.
Катаю тележки  🛒
08:48
Просмотров 498 тыс.
CORTE DE CABELO RADICAL
00:59
Просмотров 2,2 млн
The Return of jQuery (Not really, just Alpine.js)
23:40
PHP on the frontend! No more Javascript!
14:47
Просмотров 123 тыс.
Django and Alpine.js - Introduction to Alpine.js
20:26
Катаю тележки  🛒
08:48
Просмотров 498 тыс.