The Complete TALL Stack Tutorial - FROM NOTHING TO PROD (Tailwind, Alpine, Laravel, Livewire & More)

Рет қаралды 53,175

Күн бұрын

I put a lot of time and effort into crafting a video that shows off some of the fantastic developer experience that comes with building in the TALL stack. I hope you find value in it. :)
**WITH THE UPDATED WIREUI PACKAGE, YOU WILL HAVE TO UPDATE COMPONENTS FOR MODAL AS WELL AS DROPDOWN TO WUI-DROPDOWN/WUI-MODAL. FOLLOWING INSTRUCTIONS FROM THE WIREUI DOCUMENTATION SHOULD WORK GREAT FOR INSTALL.**
Help me choose my next video:
cir.re/suggest
Links:
Github Repo: github.com/joshcirre/sendnotes
Deployed Site: sendnotes.fly.dev
Laravel: laravel.com
Livewire: livewire.laravel.com/
TailwindCSS: tailwindcss.com/
AlpineJS: alpinejs.dev/
WireUI: v1.wireui.dev/
Fly.io: fly.io/
Postmark: postmark.com/
Chapters:
00:00:00 - Introduction and Stack Setup
00:07:53 - Setting up the Development Environment
00:16:46 - Setting up the Application
00:25:49 - Creating an Application Structure
00:34:29 - Creating the Notes Table
00:44:00 - Modifying the Database
00:52:45 - Implementing Live Wire in Laravel
01:02:17 - Creating a Landing Page with Improved Design and Button
01:12:14 - Running PHP Code in Laravel
01:23:04 - Setting up the UI
01:33:07 - Adding a recipient to the notes table
01:42:02 - Wiring up the front end
01:50:54 - Creating a note
02:00:43 - Deleting a Note
02:10:03 - Creating Policies for User Actions
02:19:01 - Mounting the Note and Initializing the Note
02:28:31 - Building the Form
02:38:17 - Using Laravel Breeze's Action Component
02:48:08 - Fixing Date Format and Creating a Public View of a Note
02:58:12 - Generating the Note Interface and Functionality
03:07:34 - Setting up Scheduled Notes Emails
03:16:58 - Setting up Scheduled Notes in Production
03:26:28 - Limiting Edit Accessibility Based on Date
03:36:15 - Comment, Like, and Subscribe to Support
for the algo:
laravel, laravel livewire tutorials, laravel and livewire project,laravel and livewire tutorial,laravel livewire, alpine laravel, learn laravel framework ,laravel how to, learn laravel 10, livewire tutorial, laravel application development, tall stack, tailwind stack, livewire events, flydotio, laravel sending emails, laravel full tutorial, laravel basic tutorial, laravel crud tutorial, laravel crud, livewire stack, laravel tutorial for beginners step by step, laravel volt, livewire volt

Пікірлер: 204

@TheMontbra 7 ай бұрын

SQLite is the best option in 99% of cases of small and medium project. This little bastard deserve more love.

@joshcirre 7 ай бұрын

Totally agree! And Fly.io provides a way to do multi-region SQLite streaming with LitesFS which is definitely something to look into if you're wanting to scale a serverless app!

@TheMontbra 7 ай бұрын

@@joshcirre I will dig deeper here. Thanks for the tip!

@GianGamingMLBB 2 ай бұрын

why little bastard?

@imdtap1448 7 ай бұрын

Yeah boiiiiiii! Dude.. PHP is dope.. I don't give a shit what the haters say.. I enjoy learning it.

@mahdinaderian4053 3 ай бұрын

The only reason I found about the haters of PHP is just jealousy. Being stupid can be another one.

@hfrdmnk Күн бұрын

Hey Josh, I don't usually comment on KZfaq videos, but I just wanted to chime in and say thank you for your time and effort in creating this awesome tutorial! I already worked with Laravel before, so this was mainly a primer for me to learn Livewire, but I still took away a ton (also about how to use Fly, I struggled with that in the past). Apart from Laravel just being a great framework, the community around it (especially creators like you or Aaron) is just something I have never experienced before in other ecosystems (I also have a JS background). It's just good vibes all around and a very constructive and pragmatic mindset towards building things and supporting others. Cheers ✌

@joshcirre 17 сағат бұрын

Wow. This means a lot. Thank you for taking the time to comment / chime in. It means more than you know! :)

@SydneyWingender 7 ай бұрын

Yessss! I've been waiting for this! You're awesome!

@mongi244 6 ай бұрын

Thx for the effort sir...May you get blessed by the algorithm

@kevinkabeya2459 7 ай бұрын

Thanks so much for the content. I am learning livewire and was finding hard to envision the difference between full page components and integrating components into blade templates this really helped me understand the nuance. Keep up the good work!🎉

@joshcirre 7 ай бұрын

Thanks Kevin! There’s so many different ways of doing it which is why I wanted to show a full page Volt component as well! Typically though I’ll start with a Blade file and only make it a full page component if it’s absolutely necessary. :)

@bholmesdev 7 ай бұрын

JS junkie exploring Laravel for the first time. This is awesome! Learning some cool patterns from Livewire I'd love to pull into Astro :)

@joshcirre 7 ай бұрын

Absolutely love your content (and Astro) Ben! Thanks so much for watching. :) I’m hoping to do a Laravel and Astro video soon!

@mahmoud-bakheet 6 ай бұрын

What a pattern man 👌👌

@mahasiswago 5 ай бұрын

I'm from Indonesia and I just wanted to say a big thank you for your tutorial video! It's really awesome, I love it! Your explanation is clear and easy to understand, and your style is really cool. I like how you can explain complicated things in a way that's easy to grasp. I'm sure this video will be really helpful for people who want to learn more about Livewire. Thanks a lot for making it! :)

@joshcirre 5 ай бұрын

This comment means a lot to me. Thank you so much for the kind words! Hopefully I can continue to make content that helps you and others in the same way! ☺️

@BERTDELASPEED 7 ай бұрын

I just watched the whole thing like I told you previously I would. I knew I was gonna learn great things here. Thanks for this amazing tutorial I just didn't see exactly what was that Alpine but lemme tell you this, YOU keep this up, this channel is blowing in NO TIME 💯

@joshcirre 7 ай бұрын

Thank you so much for the support! Admittedly, we didn’t really touch Alpine at all in this course. But it is intermingled in WireUI and Livewire pieces. I do have a video coming out soon of when to use Alpine and when to use Livewire that I’m excited for! Crazy that someone like you watched the whole thing! 🤯

@aman4069 7 ай бұрын

Thank you for making this video, this is what I have been looking for the last 2 months.

@joshcirre 7 ай бұрын

That means a lot. Thank you! 😊

@arori112 7 ай бұрын

I was shock when I saw your tutorial in first place. It's awesome man. I really really appreciate it. HUGE THANK ❤

@joshcirre 7 ай бұрын

Thanks so much for the support! Let me know if there's other things you'd like to learn about. :)

@juann268 4 ай бұрын

My god, 20 minutes of setting up tooling and third party services before even writing any code. Modern web development is soul crushing. Thank you for creating such a comprehensive video, by the way.

@joshcirre 4 ай бұрын

Well, I think the 20 minutes is a little bit of a smoking gun the next time you work in the TALL stack. I wanted to just show that if you have never worked in the TALL stack or Laravel before, how can you get up and running. That being said, I’ll add a note in the description for when to start writing THIS PROJECT specific code. ☺️

@pedroluzio Ай бұрын

I already know laravel, but I just love your calm way of explaning things. Thanks for the tutorial. Dont stop please.

@joshcirre Ай бұрын

Thank you so much. This means a lot. ☺️

@londelidess Ай бұрын

This guys is the only person who makes good thumbnails for Laravel

@joshcirre Ай бұрын

Wow. Thanks. ☺️

@user-ys6fw8xf4p 7 ай бұрын

man you deserve much more subscribers, I love your channel

@joshcirre 7 ай бұрын

I appreciate that! I'm gonna keep working hard to get there. :)

@user-yv7pb2nc9j 5 ай бұрын

I love your channel is like watch asmr but learning and evangelizing with laravel

@joshcirre 5 ай бұрын

Best comment. 🥰

@vinayakhegde3068 6 ай бұрын

The only reason I've chosen to study Laravel is that there is a need for PHP/Laravel developers, but there aren't many of them. Another benefit of using Laravel is that it comes with everything you need, eliminating the need for any third-party tools, unlike what you might need for a JavaScript backend.

@joshcirre 6 ай бұрын

Especially Laravel specific developers are harder to find from a Wordpress dev, for example. And yes, I agree!

@rodantegutierrez4027 3 ай бұрын

do you have a discord? i want to add you. I also study laravel.

@MarcelloPato 4 ай бұрын

Awesome job man, have learned a lot!

@joshcirre 4 ай бұрын

So glad to hear that! Thank you!

@imanol4468 2 ай бұрын

Thank you, Josh! ♥

@joshcirre 2 ай бұрын

Thank YOU!

@cgbrayt1701 21 күн бұрын

Thanks for bringing up to youtube a tutorial over TALL stack, pretty useful and not too much known knowledge. I can address some points about the video that maybe can make more tutorials in the future even better (from a viewer perspective): - Focus of the video: i noticed along the tutorial that actually you haven't defined totally if this video was for people totally beginner in laravel, for people with some experience in laravel or for people that comes from javascript to php world. Fortunately the third option is my case, but it's not perhaps for most of the people: not everyone has ever used javascript and a lot of times you explain stuff like everyone would understand, like in 1:24:00, when you compare a resource from livewire with react and any person that doesn't have any knowledge on react would never get. I guess that focusing on intermediary to advanced level would be the way to go due to the intention of livewire and the other frameworks itself: make the life of people that knows their 'base' easier, and that implies not being a beginner. So perhaps explaining what a migration is is not necessary deeply. - Deploy part: i personally liked this part and it fits well for tutorials with this purpose of introducing new technologies use with a well-known framework as laravel, but again the issue of the focus: people that don't even know what 'deploy' means, which can be possible to have seen this part (you've said in the start that beginners could also see the video totally fine), perhaps have struggled to process this. Anyway the tutorial was good in general, but these points have damaged the intention and well, you also can be less fast sometimes: you have oscillated with fast (which made me pause the video to understand the code and write it too) and slow speed, but reaching a middle level is the way to go i think... Thanks!

@joshcirre 19 күн бұрын

Thanks for the feedback. I’m consistently trying to improve and even 7 months later, I would have done this video differently. Maybe I’ll post an updated version soon, but the goal of upcoming free and paid content (at least on this channel) is specifically for developers looking to try out Laravel unless otherwise stated. I’ll be releasing a video on the official channel for Laravel for brand new developers. Anyways. Thanks for the feedback. Continuing to work to get better as a creator and teacher. :)

@user-sr8ch8tp4b 7 ай бұрын

Thank you so much for this video. Therefore I become the 1000th subscriber !

@joshcirre 7 ай бұрын

Thank you! :)

@rodantegutierrez4027 3 ай бұрын

I wish there is another TALL Stack video. I learn so many stuff. Although is not purely MVC but i learn something new and it introduce me WIREUI. I want to learn from this guy. Keep it up bro.

@joshcirre 3 ай бұрын

Well thank you so much for the love! More TALL stack specific tutorials coming. :)

@rodantegutierrez4027 3 ай бұрын

Wow im excited 😊🎉🎉. I rewatch your video when im idle just to be sure i absorb it very well.

@user-db1he6vt2f 7 ай бұрын

Man I appreciate your work a lot, very useful video, it helped me a lot. Could you do a video regarding how to implement a 'comment-on-note' functionality, kinda like in a social media way? Keep up with the videos man, im already a huge fan!

@joshcirre 7 ай бұрын

Thank you so much! This means a lot to hear and that idea is a perfect one to implement. It will be a great "part two" for this tutorial. Have a wonderful holiday season. :)

@harshwebdev 7 ай бұрын

This project was tooo helpful. Please make more projects like real time chat system with file sharing using Tall Stack

@joshcirre 7 ай бұрын

Thanks for the support! I can definitely take a look at it. You can have "Almost" real time chat with LIvewire out of the box with Polling. But with things like Mercure becoming more and more popular, there are other options that are just as easy for real time connections.

@hanymax 7 ай бұрын

another great tut and saved in my fav playlist

@mahmoud-bakheet 6 ай бұрын

Thank you, that way we could actually learn

@muhammad_abir 7 ай бұрын

best channel for laravel developers.....

@joshcirre 7 ай бұрын

Thank you so much for the incredibly kind words!

@sefaiyi 7 ай бұрын

awesomeee josh thank 🎉

@joshcirre 7 ай бұрын

Glad you liked it! :)

@anilaeus 6 ай бұрын

What a wonderful video, i learnt a lot and all thanks to you mate! Would you mind doing more TALL stack stuff? i am hungry for that!

@joshcirre 6 ай бұрын

Thanks for the support! I do have a video coming out on my Laravel Toolkit, TALL Stack for JS devs, and Livewire Security video!

@JoeSmith-kn5wo 10 күн бұрын

great course to get going on Livewire!

@joshcirre 10 күн бұрын

Thanks! I have a brand new one building an app from start to finish with Livewire coming out on Laracasts soon!

@JoeSmith-kn5wo 10 күн бұрын

Looking forward to it

@ijasdeen3809 20 күн бұрын

your voice is soothing

@joshcirre 19 күн бұрын

Thank you! ☺️

@robertbednarowicz6235 6 ай бұрын

4:16 I'm on Linux, thanks buddy, I felt like a genius or something :D

@karanahlawat9106 7 ай бұрын

LESGOOOOOOO DUDE

@lnplum Ай бұрын

Thanks for making this video. I think the length is justified by the topic and I appreciate the livestream format and not cutting corners to trim the video down to size. However some nits made it difficult for me to learn much from this video: - you spend a lot of time on fly, which is tangential to the meat of the video and makes the stack overly specific - I'd have preferred if you handwaved those parts more instead of spending time to explain how to configure that service unless you were literally sponsored by them; same with Postmark although to a much smaller extent obviously - your tone is very hushed - you mention elsewhere that you were recording this while your daughter was asleep but tbh watching this video at night made me sleepy af - when tabbing away from code to show and explain what it does it helps to then show the code again after the explanation - I had to backtrack to figure out what code you were talking about at times because I wasn't constantly paying close attention and eventually just gave up on doing that unless it sounded super interesting - the level of explanations sometimes oscillates between assuming the viewer is a complete novice or that they already know all the technologies involved - it might help to outline features you want to cover and then check them off as you go so you don't skip over important concepts or overexplain ideas you've already shown I think the video was a mix of a "let's play" for building a demo app with Laravel and a tutorial for how to do it. Both of those things sound interesting to me but I think it was a bit too disorganized for a tutorial and a bit too much explaining for a "let's play" style demo video. Given laracasts already exists, I think a "let's play" style video where you demonstrate building an app without going into too much detail with the explanations and focus on the TALL stack specific aspects would be more interesting to see in the future.

@joshcirre 19 күн бұрын

Thanks for the feedback. I’m definitely looking to consistently improve even for free content like this. :)

@arjaymarigondon1485 4 ай бұрын

moooooreee tall episode

@joshcirre 4 ай бұрын

I'm glad you like it. 😊

@arjaymarigondon1485 4 ай бұрын

@@joshcirre extension name for terminal suggestions like ai

@mrdarknezz 7 ай бұрын

Man you are pushing some quality videos on the TALL stack, fantastic

@joshcirre 7 ай бұрын

Thank you so much for the kind words. I'm going to continue improving and pushing out as much content as I can. Thanks for the support! :)

@cdrz23 Ай бұрын

Thank you for this tutorial, I really love it! I also wanna know how you get/setup your warp terminal. Many thanks!

@joshcirre Ай бұрын

I'll have to put a quick short together to show this. It changed a bit from this video, but I'm currently using the "Catppuccin Frappe" theme. :)

@cdrz23 Ай бұрын

@@joshcirre nice! I look forward on it. Thanks bro.

@Jalil_Abdullayev 4 күн бұрын

Thanks a lot for this tutorial. I read documentation and wrote simple tasks in Livewire but after this tutorial I think I can independently work on TALL stack projects. It's really good to know there's Livewire components (Volt) like React. It reduces code a lot. Everything was great but we didn't see any Alpine JS, did we? How we use Alpine? How we used that in this project if we did?

@joshcirre 2 күн бұрын

You're right! I wish I touched on this a little bit more in the tutorial but a lot of what Alpine is doing in Livewire is obfuscated by the component library (WireUI) we are using and by Livewire itself. I have some other videos about Alpine and am working on a Livewire crash course soon that will have a section all about Alpine. ☺️

@JonBrookes 5 ай бұрын

I liked this video, thanks for the hard work that has gone into creating the content. I'm off to try more out like it and deploy to my own servers now. I guess as I only saw in your video your changing client side rendering things like tailwind but not so much alpine. Is it just being used by livewire ? I was quite prepared to get busy with Alpine but seemingly not necessary at this point at any rate. Nice.

@joshcirre 5 ай бұрын

Looking back, I wished I touched on Alpine more than I did (which was never!) The WireUI components we installed are using Alpine under the hood, but we don’t see what they are doing. I guess the tutorial goes to show that for the majority of projects, I lean towards server side rendering first and then adding Alpine when I need it (for toggles, UI niceties, etc.) I actually have a video I’m recording about when to reach for Livewire vs. Alpine in components!

@JonBrookes 5 ай бұрын

@@joshcirre that will be great to see. I'm looking at laravel websockets from beyond with a view longer term to use socket connections and real time messaging / updates in livewire but for the moment long polling is just fine. I'm guessing there are edge cases like these using javascript on the client will begin to make sense. mean time i am astonished how much can be done in pretty much blade templates and php to have this teleported to the client with components that feel like vue and dare I say react even

@nizz4m 6 ай бұрын

Hi Josh, thank you so much for your content. I am curious on how you do the indexing using uuid as id in the table ? Is it the best approach using uuid instead of incremental ?

@joshcirre 6 ай бұрын

Hey there! In this particular use-case we opted for UUIDs instead of incremental because if you send a note you would prefer that note to be private (accessible only via link). Incremental is really easy to guess and therefore access notes that aren't meant for you. UUIDs are much more difficult to do so. Nearly impossible. Indexing is done through Laravel when we made the UUID a primary key. :)

@benbowers3613 7 ай бұрын

Great stuff! I've also been wondering if htmx would be a good addition to this stack. I think it may remove the need for livewire

@joshcirre 7 ай бұрын

Yep! I would say that HTMX probably solves the same set of issues that Livewire is solving, but I think if you aren't in Laravel than HTMX is a SOLID alternative. Also, take a look at Alpine Ajax which is an HTMX alternative with AlpineJS baked in (alpine-ajax.js.org/)

@kemal6039 2 ай бұрын

Ok great tutorial and all but I gotta say WHAT IS THIS OS!? From browser to terminal, from IDE to notepad everything looks so clean and awesome! Jeez I'm having a designgasm

@joshcirre 2 ай бұрын

Well thank you! This is actually just macOS with VSCode (with a lot of modifications). Terminal is "Warp" and the notepad is in the Arc browser. I try to keep things as distraction-free as possible!

@josesuarez9575 7 ай бұрын

love this video, only question is how you got your web browser to look the way it does?

@joshcirre 7 ай бұрын

Thanks Jose! It is the Arc browser for macOS!

@DwiKuntarto 3 ай бұрын

Hi Josh, it's really nice tutorial, thank you so much for your content, btw i already use natty theme, but its different colors, did you tweak it??? and what is the icon you use in vscode, i really like your vscode setup!

@joshcirre 3 ай бұрын

Hi there! I probably did tweak it a bit. I am using Catpuccin now so I can't remember exactly what I tweaked, but a lot of it stemmed from Caleb Porzio's "Make VS Code Awesome" course.

@arjaymarigondon1485 3 ай бұрын

can you help me? the result after running fly launch: : No security vulnerability advisories found. Using version ^1.0 for fly-apps/dockerfile-laravel Running: vendor/bin/dockerfile-laravel generate 'vendor' is not recognized as an internal or external command, operable program or batch file. Error: failed to generate Dockerfile: exit status 1

@joshcirre 2 ай бұрын

Hey! Sorry I can't help with that. My first guess is this after or before you have installed a new Laravel Application? Just make sure you're in your Laravel Application directory and then ensure that the Fly CLI was properly installed.

@abdiasj3692 6 ай бұрын

what kind of tooling do you use that implements a vhost right then and there from the CLI? is that a MacOS-Exclusive feature?

@joshcirre 6 ай бұрын

So that is done through Laravel Herd which is a tool to install all of the necessary components for local development. It is MacOS only, but there is ports of Laravel Valet on Linux and Laragon for Windows. Or if you prefer Docker, you can use Laravel Sail. :)

@abdiasj3692 6 ай бұрын

@@joshcirre What a beauty! thanks for all the info, I've been off from Laravel from a while but want to come back for a project

@cdrz23 Ай бұрын

Josh, can I ask what vs code theme you are using? I like to have the same exact theme on my vs code. Thank you.

@joshcirre Ай бұрын

For sure! In this video it was the "Natty" theme. Most of (if not all) of my setup in VSCode is taken from Caleb Porzio's "Make VS Code Awesome" course. Highly recommend.

@donthurtme1440 4 ай бұрын

Correct me if I'm wrong, but when using route('edit', $note) it's passing the Note Model, but Laravel simply uses the PrimaryKey (ID) to creates the URL ROUTE... when you mount(Note $note) it's using Dependency Injection and retrieving the Model from the Route Parameter to a Note Object... so it's really no different than just using the ID....

@joshcirre 4 ай бұрын

You’re correct that Laravel obfuscates that in a way to make the code much cleaner, but it doesn’t just have to be the ID. Additionally it performs checks that you would otherwise have to write out by hand if the ID didn’t exist. Here’s a great article about the inner workings: 100r0bh.medium.com/demistifying-route-model-binding-in-laravel-a6e27e5a458e

@QuintessentialDio 4 ай бұрын

i did get an error when i ran the command 'fly launch': > [internal] load build context: ------ Error: failed to fetch an image or build from source: error building: failed to solve: rpc error: code = Canceled desc = grpc: the client connection is closing what could be the issue Josh?

@joshcirre 4 ай бұрын

I haven’t come against this error, but a quick search seems like it might be related to WSL. Are you on Windows?

@QuintessentialDio 4 ай бұрын

@@joshcirre yes i am on windows, i setup wsl2 with ubuntu and docker.

@CVidalAguirreVargas 4 ай бұрын

Nice tutorial!, just one question, which font do you use in your vscode?

@joshcirre 4 ай бұрын

This is Dank Mono. One of my favorites! ☺️

@BraydenGirard 7 ай бұрын

Curious why Breeze instead of JetStream as a starting point? I thought the main difference was that JetStream includes Livewire and a profile page with 2FA.

@joshcirre 7 ай бұрын

Main difference is Breeze is a lot more lightweight but still scaffolds auth and a dashboard for you. I really only choose Jetstream if I need the majority of the features it provides (2FA, teams, API tokens, profile pictures, etc.) Usually in the apps I do choose Jetstream, there’s some changes I make to make it fit the application I’m building but Breeze just gets out of your way more. ☺️

@BraydenGirard 7 ай бұрын

@@joshcirrethanks, that makes sense!

@michimarz Ай бұрын

Great content. One Q: Why wouldn't you create your own CSS styles on top of Tailwind?

@joshcirre Ай бұрын

I am not sure I understand the question. Tailwind provides all of the styles you will ever need since it's just shorthand for CSS. So, there's no reason for me to create styles on top of it. :) If you mean use @apply or create my own components, that's why I chose the WireUI components. ☺️

@Digitezy 7 ай бұрын

Great Videos! Do you edit them by yourself?

@joshcirre 7 ай бұрын

Hey Digitezy! I do! I try to do as much "live editing" with OBS while recording, but there's a lot of times where I have to remove a bunch of stuff if things don't work like I want, so I do it all in Davinci Resolve. I'm actually making a video about my creativity process that I'm doing through Aaron Francis' Screencasting.com Creator Spotlight soon!

@Digitezy 7 ай бұрын

@@joshcirre That's Great man. Way to go! I'm an editor, I can help you with editing your videos so it can save your time as well. If there's anything, let me know, I'll be happy to help. Let's connect

@saulloalmeida2080 6 ай бұрын

🤩🤩🤩🤩🤩🤩

@TheJasonTorres Ай бұрын

can we just focus on the "stink stank STUNK" for a moment.

@tensei2023 3 ай бұрын

Nice vidéo ! What do you think about Filament ?

@joshcirre 3 ай бұрын

I love Filament. I'm planning on recording a few in-depth Filament tutorials since it's something I really enjoy using and one of my SaaS products is built entirely in Filament. :)

@vgurgov 6 ай бұрын

Which terminal app are you using in this video?

@joshcirre 6 ай бұрын

This is the “Warp” terminal app. ☺️

@riley.shannon 5 ай бұрын

Great video! What notes app are you using around the 27:00 mark?

@joshcirre 5 ай бұрын

This is actually just the Notes feature in the Arc browser. Great for quick notes like this. In my daily life, I do use the Reflect Notes App. :)

@riley.shannon 5 ай бұрын

@@joshcirre Thanks so much for the quick reply!

@rahulsharmaah 7 ай бұрын

great content need more like this next time please tell how to connect cms with laravel

@joshcirre 7 ай бұрын

Thanks for the encouragement Rahul! I have a video I'm looking to create using Filament as a CMS!

@rahulsharmaah 7 ай бұрын

That's amazing . would also love to know what coding tools and useful extension you use a video on that would be helpful

@clinton3332 Ай бұрын

Hey Josh. Wire ui doesn't work for some reason. The highlights red on my vs code and the buttons don't display on 1:12:29

@miguelguzman8217 Ай бұрын

Same here, I can't make it work :(

@joshcirre Ай бұрын

Hey there! I installed from scratch today to test this and wasn't having any issues. Is there a specific error it's giving when it highlights red? This is after running the composer require command? composer require wireui/wireui

@miguelguzman8217 Ай бұрын

@@joshcirre Thanks a lot for your help, it means a lot (at least to me :p) I haven't gone back to the project, but I will during the weekend, however, I don't see any specific errors on the editor, and will let you know in case someone else faces the same issue again

@clinton3332 Ай бұрын

@@joshcirre the red highlight was due to the blade template extension not being installed. But the wireui still isn't working properly. The buttons don't have color until I add color directly to the button class and the trash and eye buttons aren't circular

@aman4069 7 ай бұрын

i tried implement edit note using modal, and its so hard to make. i can't get the current edit note

@aman4069 7 ай бұрын

volt makes it hard to implement because each livewire file is separate.

@joshcirre 7 ай бұрын

Modals are tricky within Livewire, but some packages (and some of Caleb Porzio's content) makes them a little bit easier. I would take a look at wire-elements/modal for a great package which would work in Volt. You can then just pass the $note into the nested Livewire component.

@konskript123 26 күн бұрын

what extension you use that it auto suggest a vode snippets?

@joshcirre 24 күн бұрын

This should be the "PHP Intelephense" plugin! :)

@joshcirre 24 күн бұрын

But it's possible you're also just seeing Github Copilot, as well!

@muhammadalifdanielbinmohdh3188 21 күн бұрын

hey a question im from nextjs land and wanted to learnd tall stack are there a way to install shadcn?

@joshcirre 19 күн бұрын

In the TALL stack, there is no way to install ShadCN, but it’s possible with Laravel and React with Inertia. There are a couple options for ShadCN style components with TALL stack, however.

@muhammadalifdanielbinmohdh3188 19 күн бұрын

@@joshcirreCan you suggest some of it for me

@shayantriedcoding 5 ай бұрын

Which vs code theme are you using sir? Please tell us.

@joshcirre 5 ай бұрын

This is the "Natty" VS Code Theme. :)

@shayantriedcoding 5 ай бұрын

@@joshcirre Thanks sir. Can you share your vs code settings with us?

@markurionn9004 6 ай бұрын

Jezz oh God.... you're my savior ! Not God you Josh ! Thanks for detailed tutorial !

@joshcirre 6 ай бұрын

So glad you find it useful. Thank you so much! :)

@SivaramKonanki 18 күн бұрын

what’s that note app you were using

@joshcirre 16 күн бұрын

This is actually the "notes" section built into the Arc browser. :)

@emmanuelezeagwula7436 7 ай бұрын

Love the video. What’s the font on your IDE

@joshcirre 7 ай бұрын

This is Dank Mono! Paid, but worth it (to me).

@seaia5in1ali67 6 ай бұрын

@@joshcirrewhat about theme?

@elrenzo 7 ай бұрын

Thanks for the tutorial, one question, I have read in several places that Laravel is not so scalable, is this true? I have doubts about building a saas with Laravel and not being able to scale it as much as necessary.

@joshcirre 7 ай бұрын

100% yes absolutely. There are people running Laravel applications with millions of users. Totally doable on traditional architecture, but Laravel has Laravel Vapor which can scale on AWS effortlessly, as well.

@yoanestradablanco1608 Күн бұрын

Brother, how could I share a state with Laravel Volt? For example, a shopping cart

@joshcirre 17 сағат бұрын

There's a couple of different ways. The easiest way is to store it in the Cache. Might not be the best way but could be an option. Technically you would probably have the Shopping Cart be it's own Livewire component. THEN you would use Livewire Events to dispatch and receive changes to the cart from child components. This events page is a good start: livewire.laravel.com/docs/events#dispatching-events

@yoanestradablanco1608 17 сағат бұрын

@@joshcirre I always had the idea of using those listeners to render the cart component but where to save the cart is where I have my doubts, I even taught in the localstorage but well that idea of the cache can

@phanethpho4477 3 ай бұрын

Laravel My favourite Framework

@joshcirre 3 ай бұрын

Really?! Mine too. 😇

@mohamedaminedammak2319 2 ай бұрын

what are the prerequisites for this course?

@joshcirre 2 ай бұрын

While you can definitely follow along with no knowledge, this assumes you understand basic programming concepts (functions, classes, etc.) and HTML and Tailwind. I try to explain everything as I’m going but we don’t take time to talk about how everything works from the ground up. ☺️

@mohamedaminedammak2319 2 ай бұрын

Thank you 🤝

@kanishkapasindu4895 15 күн бұрын

Can u tell me u r browser and how i customize like that

@joshcirre 14 күн бұрын

This is the Arc browser. :)

@MrAtomUniverse 6 ай бұрын

How do you rate limit Laravel live wire calls ?

@joshcirre 6 ай бұрын

So Laravel has it's own rate limiter that you can then use in Livewire methods. laravel.com/docs/10.x/rate-limiting

@MrAtomUniverse 6 ай бұрын

@@joshcirre Thank you!

@ojiepermana 4 ай бұрын

How make clean browser ?

@joshcirre 4 ай бұрын

This is the Arc browser. I love it, especially for screencasts. :)

@Stoney_Eagle 7 ай бұрын

I wish livewire's spa functionality wasn't utterly broken 🥺 im sticking with Vue

@joshcirre 7 ай бұрын

Interesting! Would love to hear how it's broken for you? This video talks about a cool snippet where all actions completed by Livewire are given a "SPA" feel: kzfaq.info/get/bejne/jrKheMmCyNXLaGg.html

@isaachatilima 2 ай бұрын

Maybe it's just me, why does the livewire website take long to load or navigate?

@joshcirre 2 ай бұрын

Interesting. All good on my end!

@incognito7840 7 ай бұрын

hello sir can u help me to learn how to give permissions to the users as per their roles in laravel livewire please

@joshcirre 7 ай бұрын

Hi there! You would do this with Laravel's Gate and Policies like we implemented, but if you wanted to give different roles to different users in an easier format than doing it all manually within the Policy, then Spatie's laravel-permissions is a fantastic package to help with this. In Livewire, nothing would change because you can still authorize like we do in the Policy section.

@incognito7840 7 ай бұрын

@@joshcirre thanks a lot 😇

@pratikbhujel 3 ай бұрын

Can you build a system like zoom or any SaaS products example. Thanks snd Regards The thing must be scratch I mean Teach me lil bit of tailwind Alpine.

@joshcirre 2 ай бұрын

Hey! I am working on a full application build through in Laravel and Livewire for a Laracasts course coming soon. Additionally, I have some smaller videos teaching some SaaS concepts, as well. Would love to have you input ideas into: cir.re/suggest

@birsingh5388 7 ай бұрын

Please if you can please create one with jetstream

@miguelguzman8217 Ай бұрын

Great video! Too bad I'm the second person that has problems with the inclusion of styles for livewire :( Even ChatGPT couldn't fix the issues!

@joshcirre Ай бұрын

Oh no! Let me take a look this week! It’s possible that something changed. ☺️

@joshcirre Ай бұрын

Hey Miguel! Sorry to hear that. I did a fresh install and everything seems to be working for me. Is there any errors that are being shown in VS Code?

@miguelguzman8217 Ай бұрын

@@joshcirre Man you are the best, as promised I just started following the tutorial. Since I was on Linux and rushed the installation of composer seems like I had some issues with it, anyways, did a fresh install of everything and this time it worked like a charm. I appreciate you looked into it though, keep the good work !

@abdalkhalekchamkha3622 7 ай бұрын

i hope if you can make your video 60Fps

@Spkntei 6 ай бұрын

MVC ??

@joshcirre 6 ай бұрын

Using Livewire Volt specifically, there isn't really a need for controllers anymore. All of that logic is instead moved to the Volt components. But MVC stands for Model, View, Controller. :)

@imajipictures9305 7 ай бұрын

Hi! Please re-upload. Just 360p option for resolution 😂

@aman4069 7 ай бұрын

I was happy the first time I saw the video until i see this comment 🤣🤣

@seranoxa 7 ай бұрын

i have 1080p resolution available

@joshcirre 7 ай бұрын

Looks like it just took KZfaq a bit to catch up! The downsides of being too early. 😂

@imajipictures9305 7 ай бұрын

It seems that when the video finishes uploading, KZfaq is still rendering FHD resolution 😜😅 Thank you bro @joshcirre 👍🏻

@dalelanto895 6 күн бұрын

I couldn't follow the fly setup, its not beginner friendly because of the card authorization, mine gets rejected.

@joshcirre 5 күн бұрын

Good to know. Hopefully there will be a better and easier way to host Laravel apps soon. :)

@Jalil_Abdullayev 4 күн бұрын

I spent a lot of time to setup successfully. You just need to research a little bit. If you have any issues you can write.

@Septumsempra8818 7 ай бұрын

HTMX?

@joshcirre 7 ай бұрын

I need to play around with HTMX more but within Laravel, I think Livewire fills that spot! :)

@FabriceTOHIONON 4 ай бұрын

Hello, I really enjoyed your tutorial. However, something that bothered me a bit throughout was the impression that you were whispering when speaking. It made it a bit difficult for me to follow along effectively.

@joshcirre 4 ай бұрын

Sorry about that! I recorded most of this while my daughters were asleep. I’ll make sure to adjust for future tutorials. ☺️

@samicasanova6720 Ай бұрын

bro u just stop of typing and delete and chat all the times you increase the time of the video with 2h , i increase the speed with 25% and you still talk normal

@joshcirre Ай бұрын

Mostly to show that it's possible. But largely because the notes are public. You don't want just anyone browsing a note that was meant for someone close to you.

@arystanbekjetisy7329 3 ай бұрын

What about VILT?

@joshcirre 2 ай бұрын

I am not a Vue master (yet), but I think that there is a lot of potential and power in using the VILT or LIRT stack. :) I would also check out Hybridly (hybridly.dev) if you are a Vue fan.