PHP on the frontend! No more Javascript!

Laravel Livewire allows you to write PHP on the frontend (kind of!) so you don't have to futz about with Javascript anymore (mostly!)
Looking for PHP jobs or looking to hire PHP devs? Check out Larajobs: larajobs.com/?partner=108.
Check out the docs at laravel-livewire.com
01:44 Installing Livewire
02:26 Updating our default views
03:28 Making a Livewire component
04:37 Adding state
05:08 Binding state
06:45 Inspecting the network tab
09:35 Calling methods
11:28 Events, nested components, file uploads
12:16 Alpine.js
13:30 Livewire V3

[@teej_dv]

aaron makes me love php

[@aarondfrancis]

Pinned it

[@orenders]

Laravel is NOT php.

[@dputra]

​@@orenders you can't run laravel on c#

[@mihajlocolic01]

@@dputra goteem

[@omegaman7377]

Aaron is an incompetent. JavaScript support Unicode (think foreign language). PHP no not support. Unless you want to limit yourself to the anglophone market. PHP is a waste of your time.

[@dmdboi]

"Have you ever had a thought..". None, I have a zero thought policy. Even thought I don't use PHP, your videos are entertaining!

[@aarondfrancis]

Zero thoughts, zero suffering. You may be onto something here

[@Icodestuff]

Fellow Laravel content creator here, absolutely love your style of video. You have really nice personality & charisma in this video, keep it up man!

[@aarondfrancis]

That means a lot to me, thank you so much!

[@isurujn]

I've been a mobile developer for the past 10 years but PHP has a soft spot in my heart, no matter how much hate it gets. I built a little backend for a mobile app I developed for a software competition way back in 2012 (and won 3rd place!). All vanilla PHP, no frameworks. I wasn't aware of Laravel back then. I tried it here and there but my career took me elsewhere. Your videos on PHP makes me wanna learn Laravel again.

[@ryanlak1234]

What tech stack do you use for your career now?

[@isurujn]

@@ryanlak1234 I'm in mobile development now. Mostly iOS development with Swift.

[@carloslfu]

I started watching PHP content again after 6 years of working with other languages, all because of your videos. I was surprised to see PHP added types! Also, Laravel and all of the PHP ecosystem have advanced a ton! Great content Aaron!

[@V3LOXy]

For anyone using Symfony, Symfony UX works similarly and has support for vue/svelt/react components too

[@patricknelson]

Also worth a look for backend lovers: HTMX. Its functions very similarly, but is not tightly coupled to any particular backend language.

[@elementxyz]

That was the first thing that came in my mind. Is it similar to htmx. 😊

[@JeremyAndersonBoise]

@patricknelson Laravel + htmx is my next experiment, full-on!

[@khanalpride]

been waiting for Livewire v3.0 so long... Your videos are the best. :)

[@David-ng9qh]

Another great video! Livewire is honestly so cool and magical. Keep up the great PHP/Laravel content!

After each video that I watch from you, I have a big smile on my face. ❤

[@siyabdev]

Your style of explanation makes the topic more interesting. Great !!!

[@aarondfrancis]

That's nice of you to say, thank you!

[@holonaut]

Great video! One thing worth explaining in the counter example: Every time you click the increment button, you not only send to the server that the "increment" function should be called, but also send the entire previous state of the component in the "memo" field. First the component gets hydrated, e.g. $counter gets set to 22 or whatever the "memo" says, and then the function is applied. The backend then increments it to 23 and sends the new view out, but also the new memo which is then stored by the frontend. Took me a day or two to figure this out. Before that, I thought some cache or db sorcery is going on.

[@MrNichuya]

I've been using Livewire since version 1 and have never thought to use anything else since then, even started my first open source package for the TALL stack called tall-kit components

[@_alexlazar_]

Been watching your videos for the past week. It's this weekend that I'm building something with Laravel. I've been skimming through the docs a lot, and I'm hopeful

[@aarondfrancis]

I too am hopeful! Best of luck

[@raident29]

i just found your channel and subbed to it. ive been using php for the past 9 years. ive known live wire for the past year but havent dared to try it. i will try this now.

[@aarondfrancis]

Enjoy!

[@janedawg09]

cool. just watched two of your vids. contents' both entertaining and educative. your explanation's very easy to follow too

[@DanteMishima]

Thank you so much for this. I would love more tutorials of maybe building a project from start to finish

[@throbicon]

I just fell in love with PHP. Thank you Aaron!

[@Rikco.337]

Life changing :D Great video .. thanks a lot ! *Loving PHP for 20 years now.

[@amponsahhubert4884]

You speak with so much conviction😃. I would like to see an overview of PHP for backends/APIs

[@ernestharuna]

I've been on this path for a long time. I used Blade previously, but now, I'd use Livewire instead, it has some interesting features found in other Javascript frameworks

[@tannercampbell]

i been using Laravel + Vue for several years and its been great! The one off time I need some SSR or related thing I just use Blade. I haven’t really found the need for Livewire (because my experience with Vue has been so good) but this makes me want to give it a shot and mess around

[@miguelcaf]

I'll re-watch this video many times because I just searching this, a way to use php on front-end. I don't know if is the best pratice but I'll exercise my code this way! Thaks a lot!

[@joaolima3780]

Great!!! I wanna start to learn php and your videos helps a lot! tks man =D

[@jamesrosemary2932]

I remember in the early days of the web that you could install a DLL or a plugin in your browser which made it possible to interpret any language you wanted (as long as that language was designed for the web, of course). So there were websites that were made with VB or Java or JS. Or you could write the plugin yourself and interpret your own favorite programming language (not an easy job, but the possibility was there). All thanks to a property of the tab script: type. All that is over. I miss those times.

[@_akuma06]

You can still kind of do that with wasm. Like PyScript does to execute python in the front end instead of javascript.

[@MrShaheer]

you could also use JS on the server side in the early days of web programming (IIS supported it. ). You could also write STYLESHEETS with JS. Those were called JSS instead of CSS (Javascript Style Sheet).

[@folkrav]

Those often came with the very "fun" caveats that security was abysmal and compatibility with different OSes/browsers was crap. From a developer perspective, they may have been fun, but from a user perspective, I can safely say I don't miss this _at all_.

[@jamesrosemary2932]

@@folkrav Well, although what you say is true for the general public, there are specific cases where it has practical application and is even desirable, for example in a backend application for a company's intranet.

[@folkrav]

@@jamesrosemary2932 Then you end up with situations like at some Fortune 100 place I did consulting at, where most developers outside those working on said internal tools used Linux. Pretty much all had to keep a Windows VM around just to run IE cause that intranet software relied on Silverlight 🤷

[@timebroua]

I love PHP! Thanks for loving even more!

[@imqqmi]

Wow, looks like such an elegant way of reducing js frameworks! In my next php project I'll be sure to check it out. I've been ripping out react and angular from projects and replacing it with vanilla javascript and server side code as much as possible. Made a tremendous improvement in speed and maintenance and readibility. Haters of php haven't used php 7.4 onwards and all the new features it provides. And lets be honest, many who use async, dependency injection and inheritance in C# or java make an absolute mess of things, including myself.

[@orenders]

very strange comment, we allready as several years use php 8

[@heyalejandro175]

That was awesome! Thanks Aaron!

[@baadrqaaba9529]

I have done in a project last year and i was quiet surprised how good that was , still have some improvements buts its great .

[@str2254]

This is actually mindblowing. I cant believe i'm hyped to learn php

[@johnforeverrules]

great stuff. livewire is fun. now, more devs can have fun with livewire. keep it up

[@chriscjjones8182]

Very interesting. Might have to finally check out laravel properly now

[@aarondfrancis]

Ladies and gentlemen... we got him! ❤️

[@donald5297]

This is the first time i feel like hitting the like button more than once on a KZbin video 😊

[@SiteStudio]

HTMX was the first thing that popped into my head when you mentioned Livewire. Love seeing Hypermedia-driven technologies pushing back on the React stuff.

[@igorskyflyer]

Oh, wow, this is like PHP and JavaScript had a child, love it 😙

[@fernandoboueres]

Laravel Blade has this for some time, great to see expanded in livewire!

[@ronaldbarcat]

I think this is good for quick prototyping or showing quick mvp and for relatively smallish projects. Since I started with API driven development with Laravel, I never wanted to go back to tightly coupled monolithic web development. As fullstack web dev, embrace the new tech stack, frontend frameworks are there for a reason and it's inevitable if you want your skillset to be marketable.

[@carlosviniciusmonteirodeso5060]

I still haven't got around to programming with PHP, but after watching this video, I was curious about this 'Livewire'. I'm going to send this video to my friend who loves PHP and Laravel

[@austinedeclan10]

I am an "anything but JavaScript" type of guy. I welcome this.

[@christianlembke3410]

Omg that's amazing, thanks for sharing 😊

[@hamzahakoun1072]

what is the advantage of making multiple http requests to change an input value instead of using javascript to do that ?

[@aarondfrancis]

All depends on the use case! You can defer or debounce the input like I mentioned. In reality, you'd be using it for things you would normally need ajax for.

[@tinpa1756]

Bro this guy talks to me like I'm a toddler and I'm here for it, love the vibes

[@grim.reaper]

Very interesting, I don’t know php but this is pretty neat concept

[@DevlogBill]

I actually like PHP, it was my very first backend technology which I dabbled with for about 2 months and afterwards jumped into Django with Python which is OK. There is so much you can learn with PHP as your first programming language. I only wish there were jobs for PHP developers in NYC, there are barely no jobs here.

[@aarondfrancis]

Yeah I wish there were more PHP jobs as well. You might check out larajobs.com if you're open to remote!

[@DevlogBill]

@@aarondfrancis Thank you I will check out the site.

[@TheJobCompany]

My only problem with the "HTML over the wire" pattern is that it makes it too easy to build applications that require too much server interactions for trivial state changes that can just as easily take place on the client entirely. This results in poor design, such as the way GitHub has to make a request just to render a markdown preview. That's why I prefer how React Server Components by design make it so you cannot, for instance, use state on a server component, forcing you to make it clientside.

[@aarondfrancis]

Servers are great though! Super powerful, very awesome. And I'm not sure using GitHub as the negative example is very compelling. I get it though, HTML over the wire isn't right for every situation. It is right for more situations than it gets credit for though!

[@Stopinvadingmyhardware]

That’s what WASM is for.

[@TheSaintsVEVO]

@@Stopinvadingmyhardware What does that mean? Are you saying use WASM for managing state?

[@Stopinvadingmyhardware]

@@TheSaintsVEVO Why are you managing state machines in browsers? That’s the opposite of secure

[@TheSaintsVEVO]

@@Stopinvadingmyhardware UI state

[@krtirtho]

As a svelte fanboy this thing burns my soul Just imagine storing state in server It breaks REST, frontend and abuses HTTP requests I thought Angular was the worst. This is beyond Angular 😂 Btw, nice video ❤

[@aarondfrancis]

Nah state is on the frontend it just gets sent to the backend to rehydrate the state on the backend. PHP builds and destroys the world on every request, so there's no stored state

[@RockyPrabowo]

Ah yes. This is a typical post-2020 frontend developer saying bullshit about a mature tech they never tried. PHP is stateless by design. It never stores states beyond a lifetime of a request.

[@thedailycutline278]

As a nextjs dev, Angular aint bad, php is on its own level of being bad

[@MrSandvich03]

@@thedailycutline278 It's still better than JS

[@liquidsnake6879]

You do realise most roundtrip applications are vastly outperforming "modern" SPA crap right? We deal with network latency, you deal with 30 megabytes of javascript bundles and tons of nonsense from libraries you don't even understand blocking your thread.

[@vinayghael3490]

Thanks Aaron for share useful content👍👏👏

[@ditzdee1]

been an fullstack and backend developer but, currently more interested in backend. PHP is my first language in this industry. while trying other language, I find it's simpler not to think how to manage garbage collector (PHP only keep it until the request is done), and to manipulate array and more of them. Only it's sytax take longer than other few languages. I love this language, but still the market job requrements in my country is rare for this language for backend.

[@Xcombo]

It seems like it works very well, but I am concerned about the excessive http requests. It may be fine for small sites, but if you scale to a couple thousands of users, you are going to want as little backend requests as possible in order to not crash your server.

[@yoskokleng3658]

laravel protect it.

[@loicknsenda673]

@@yoskokleng3658 How ? can you tell us more about that ?

[@yoskokleng3658]

@@loicknsenda673 go to larvae’s document and find it. In code we will found it in config of laravel project. Laravel project protect too many request from the same ip and we can set how many request that allow user request per minute in the same ip. Remember -> in the same ip Laravel can handle thousands request. Your service won’t crash at all.

[@dfrontierit2114]

I have been using pure PHP for the past 12 years. All modern frameworks seem so complicated and just reinventing the wheels, by the way these frame works just come and go with the trends. Also the frameworks seem to just cater to the capabilities of the moment whereas all the modern cool features yet work best and simple on pure codes. Also I am literally able to code out a project by the time a person tries to setup and configure frameworks. The long way worked well for me after all than the shortcuts and trends.

[@ThePandaGuitar]

Wow you're a really good teacher!

[@aarondfrancis]

Thank you. That means a lot

[@sidatsuarezgarcia5062]

Please just make a course on PHP and Laravel, your way of explaining things it´s awesome man!!!!!

[@ariaieboy_ir]

TALL STACK for eveeeeeer

[@sibow]

Calm down fascist…😂 Just kidding TALL stack is pretty cool even though I’m a VILT stack kinda guy

[@agiliteach]

So gorgeous, I think I'll switch form Symfony to Laravel...

The advantage of PHP is that hosting is so cheap. With this technology it becomes even more interesting! Thank you

[@dinoskostas5728]

That was very intresting! But i have one question. The section that you showing that the input updates the ouput via http post request like the ngModel in angular. So my question is if this is secure or not. Because everyone has access to the dev tools and they can easily see those updates and i assume that can lead to an html injection or more am I right or am i missing something?

[@md6886]

Looks good for simple pages.

[@Dutep]

Your videos are awesome! Would love more Laravel+Livewire content :D

[@VictorBorah-Invincible]

I think, I am living in an era defined by "War of the Frameworks". You wake up every morning and find a new missile. Anyway, being from PHP background, I believe, we engineers love to make things fancy and complicated when it can actually be achieved in a much simpler way.

[@lagcisco]

So much happier our team got rid of NextJS/React/GraphQL/MaterialUI for regular boring vanilla Rails+HotWire+Tailwind+AlpineJS. So much code was deleted and accumulated cruft to support the graphql api and the entire massive React app. We can put out features a lot faster now and even performance improved, less complex deployments as well, wins all around.

[@aarondfrancis]

The vibes are shifting. We're so back!

[@mikopiko]

Turbo frame are something incredible!

[@mikopiko]

@@americanhero3881 What is it you don't enjoy with Rails?

[@mikopiko]

@@americanhero3881 Oh okey, their design regarding the "convention over configuration" can be hard to work with if you don't fully grasp it.

[@behrad9712]

Thank you very much!🙏

[@imdtap1448]

It's a sign from the heavens..Dary and Gio had me thinking about learning PHP...Now A-A-Ron...Been thinking about this for at least 3 years (im JS loser wannabe)... Imagined if I would have listened to myself and committed? I would be well on my dream of working from home in my pj bottoms and tshirt...

[@celebritydev1]

I use livewire but when performance matters, I use react. Between, great content.

[@mackynyxz]

I love this livewire thing!

[@JasonJA88]

I'm really loving what HTMX's doing...

[@aarondfrancis]

Same!

[@harshwebdev]

Really i liked your video 💖💖

[@MrShaheer]

You could also use JS on the SERVER SIDE in the early days of web programming in 1999! long before NODE.JS was a thing (IIS supported it. ). You could also write STYLESHEETS with JS. Those were called JSS instead of CSS (Javascript Style Sheet).

[@Eloii_Xia]

JSS is a bad thing !

[@jefestar]

an all frontend and backend in vanilla javascript would be 🔥

[@MrShaheer]

@@jefestar oh yeah. It could have been that, but the support wasnt good enough, only Microsoft supported it and their version wasnt as powerful as Node.

[@eugrus]

​@@jefestarif that emoji stands for hell 😂

[@jefestar]

@@eugrus 😂

[@useruser12363]

We are about to start several new projects. I was going to use laravel+Reactjs. But this option is very interesting.

[@aarondfrancis]

If you're looking at Laravel + React, do look at Inertia.js for that too

[@useruser12363]

@@aarondfrancis thanks, I will do.

[@ladanski]

As a php developer who now does Angular, this looks so familiar.

[@aarondfrancis]

Yes! Very similar syntax

[@DCBlogdev]

I love Livewire it’s all a php dev needs!!

[@dsuess]

I love PHP!! Hands down, I'd prefer to do more of the code in PHP and less in React/Angular, especially if this is going to execute faster than JS. Great breakdown, thank you!

[@davidstephen7070]

this framework built on top JS. So it never execute faster than JS. This framework hides JS implementation. Like Blazor.

[@dputra]

@@davidstephen7070 blazor wasm is different if I understand correctly, they have their own "shadow DOM"

[@jasper2virtual]

I always don’t know should I implement spa backend (php page routing), or spa frontend (restful api + JavaScript routing)? Can anyone suggest a good article or book to guide me the designs decision. Thanks

[@user-ks2ic5nk2y]

i just love PHP , i never understand why it doesn't get the glory it deserves,

[@aarondfrancis]

That's why I'm here! 🫡🫡🫡 We'll return PHP to its rightful place at the top

[@user-ks2ic5nk2y]

@@aarondfrancis with you all the way sir,

[@imdanielmartinez]

The fact that livewire is made with tailwind too is the bomb

[@FelonyKNviction]

Not a php dev but I still think this is pretty awesome

[@BartoloIlliano]

PHP is the best language for Web !!! You can build frontend and backend easy, more fast respect React

[@pemrograman-cepat3393]

my first website run php. It just worked

[@adolfomoram]

I tried for one year, maybe more, I think SPAs are a bit complicated to implement with livewire I also found it hard to work with JavaScript libraries like tagify or file pond, when it reloads it overwrites the state messed up the library. I then changed to Inertiajs and Vue and I am loving it so far...

[@aarondfrancis]

Inertia is great! I'm a big Inertia fan

[@victorpinasarnault9135]

Did you saw PHP in a sandbox enviroment with WebAssembly? They did that a few weeks ago.

[@aadamishmael8549]

Awesome! Way overdue.

[@brokeartisan]

Very similar to HTMX but with that laravel magic

[@aarondfrancis]

Totally!

[@neelkamal7837]

it's really a nice information

[@viragjacint]

No way!!!! I just finished your mysql course! It was epic! Really happy that I found your personal channel! Can't wait to see more videos from you!

[@aarondfrancis]

You made it! I'm here! Glad you enjoyed the course 🤗

Livewire is what I need to do almost everything Give me more capabilities to create complex and light aplication Its amazing!

[@KangJangkrik]

I don't think it would be any faster than svelte, but thanks for the insight. Nice to try

[@kewltune4683]

Totally love the “hit the dislike button twice” part! Thank you for the great video on this topic!

[@windyhen2567]

and the poker face while saying it - niceeee

[@kamalkamals]

Finally php team weak up , but i guess it still limited and the data binding already exist on other language programming like c# with reactivity value of each variables like in your video, hope in the future php team make more changes :) good video keep up.

[@mjerez6029]

Love it .. I would rather go full circle with php that react.

[@BoolFalse]

I haven't used php (laravel and stuff) for almost 4 years now, apparently i switched to react and node.. but man, vite replacing CRA and webpack, next.js replacing react, deno and bun replacing node, even during my typing may something had replaced already.. my motivation to learn some stable tech-steck was a lightning talk about JS by Gary Bernhardt from CodeMash on 2012

[@Dfeneck]

God its so nice to hear someone talk good about PHP. I work with Java developers who only ever talk shit about PHP and I'm so over it.

[@aarondfrancis]

Honestly I got tired of people talking trash all the time so I decided to start a counter-influence campaign

[@gearboxworks]

⁠@@aarondfrancis I was wondering if you were being serious or sarcastic when you said “never hearing anyone say anything bad about PHP.” Lol! Personally, after 10 years of working with PHP and a few years on the PHP Internals mailing list seeing how the sausage gets made I then discovered GoLang and experienced how great it is to be able to re-factor knowing that type safety has your back. Also, with finding my new skills in high $$$ demand like they never were when working with PHP, I cannot imagine ever doing PHP work again. Not saying you are wrong to work with it or like it, just that I am enjoying coding again in a way I haven’t after my first few years with PHP. #fwiw P.S. I watched your video not to slag No PHP but instead because I wanted to see how it was possible to do PHP on the front end. My take away is that it is not! The PHP is still running on the server and not in the browser. But, it is an interesting approach even though the title was click-baity! 😄

[@negativerfan]

This is the first time that PHP makes me excited.

[@DharmikGohil-bw2ug]

Great Video

[@lpanebr]

This is awesome.

[@yousufameer]

Best Explanation

[@sbmiller3699]

wow. i'm checking it out.

[@devxperienceofficial]

Hey Aaron, thanks for sharing! But what is the big difference between Livewire component and normal blade component?

[@aarondfrancis]

A Livewire component has a bunch of magic that makes it "reactive" and a blade component does not

[@devxperienceofficial]

@@aarondfrancis Thanks :)

[@alaminjumamagoti5045]

Aoran what tool do you use to record both the screen and your face ?

[@aarondfrancis]

Screenflow!

[@lostcarpark]

I came to PHP for back end web development, but have since done a lot of shell scripting with. Now we can use it for web front end too! We just need PHP for desktop development...

[@aarondfrancis]

Boy do I have good news for you. Check out Native PHP

[@muhammadroushan8906]

Been using Livewire for an year now - its fantastic!

[@LanceBryantGrigg]

This could really catch on for the right app. I suspect people will prefer not to have the automagic for some cases; I am curious too see what happens.