Struggling with Laravel + Vite

[@polojuninho]

I dont even use Laravel, but the way you make the video was awesome!

[@MatteoPresot]

Love this contents and how much important is writing clean and readable code. This is also one case when moving logic to a job does not make really sense. So great job!!!

[@Alpha0YZ]

Maybe you should print the public URL in your terminal to make it easier to browse or share 😊. Great tip and excellent inspiration for my current project 🙂. I had the same problem with Laravel Herd; everything was working except the Vite server.

[@julianfbeck]

you can also use cloudlflare tunnels and you can even specify a subdomain so i doesnt rotate as ngrok does. nice work 😊

[@julianfbeck]

cloudflared tunnel create

[@chinmayp00]

I'm using it to expose my RPi server to the web. Running 2-3 apps

[@guillermocava3568]

Any time I hear someone say "beware of infinite loops", I always respond "unless you're Aaron Francis" - Dude this is sick! glad you got it working I feel like through some vite conf related to `server.host` you could also set the public domain, but the idea of not even touching the vite config file directly is also pretty dope

[@umairsaeed5925]

my whole life I was pronounce ngrok wrong. I pronounce it as NG ROK 😭

[@Serizon_]

wait samee...

[@Voltra_]

Spot the angular dev

[@rckstrbhushan]

🤏

[@tomaszgora4353]

I was wondering, is it really optimal to stash hotcontent and put new one in the file INSIDE of the loop? I mean maybe writing is, i.e. in case we restarted dev servers or vite died or something (to just have artisan command restore it back by constantly overwriting), but then I think it would be better to store and write ahead of loop and tidy up after breaking from it. Inside of loop maybe monitor if dev server is running and if it stops then kill the loop as well and exit.... Thoughts? I am redoing this as it saves my life now. Only instead of ngrok I tunnel via self hosted instance of bore. Works like charm. You saved my life when I found this vid after 2 days of banging my head on the wall.... Thank you!

[@kingstalker]

gotta love ryan reynolds doing laravel 😃

[@hectorcenteno7315]

Man ! I learned a lot with this video! And I’m a 10+ years experience developer. 😂

[@haidubogdan8712]

good ol ngrok, good for paypal development notifications also

[@esdev]

What's font used here

[@mahmoudmousa2405]

Hey Aaron, I really like the camera setup you have. What camera and lights do you use?

[@aarondfrancis]

It's a Canon R6 running through an Elgato camlink!

[@kyngcytro]

Who else was waiting for him to add the ngrok URL to the output? 😆

[@sajjadhossainshohag3459]

You are awesome Aaron, Thanks.

[@richeriswertres]

Hey! I used vite in past few months in Windows, I also encountered that issue. I thought that was okay and normal not to render frontend in my phone after "npm run dev" because there was no nodejs installed in my phone, so i "npm run build" it and it works (atleast i will saw the changes) in the phone but only working if "npm run dev" server is stop. Does Ngrok supported in windows? I will try it, if it is.

[@wilsenhc]

I think you can also change the Vite server url using a env variable, no need to manually update the public/hot file

[@aarondfrancis]

But then I'd have to change the vite config anytime I want to share

[@AnthonyBullard]

You could have your command start vite as well and supply the ENV var that way

[@SimonHamp]

Great vid as always man! Would love to see all of this running from a single command Then you can have my kingdom

[@Pekz00r]

Great work and great watch! Will you publish the code somewhere? Maybe even make a package?

[@aarondfrancis]

Yeah! If the Herd and/or Laravel team doesn't fix it I totally will

@@aarondfrancis I would suggest you doing it anyway, because the 'Expose' herd uses always gives you a different URL in the free version, which is sad when you might need a static one, and in addition it only works for an hour then you need a restart.

[@stefan48391]

Why not using expose?

[@andriimaksymchuk8773]

so do you bought a doman name? because on free mode it can`t works i guels. Becouse in my case Vite and Websockets runs on diferents ports...

[@andriimaksymchuk8773]

Only Personal, Pro, Enterprise, or Pay-as-you-go accounts can reserve domains. Your account can't reserve domains.

[@phefochis6149]

Thanks Aaron, great content 🎉

[@lahirulhr]

Great video Aaron. learned many new things

[@ivanjelenic5627]

Thanks, learnt signalable commands!

[@heyimamaker]

I noticed that your auto complete seems to be scoped to the file contents and isn't suggesting everything under the moon. Do you have any special configuration?

[@aarondfrancis]

I... have no clue 🙈

[@heyimamaker]

@@aarondfrancis I wish they had a settings diff 🤣 I noticed some scope configs for search and the file structure, but your suggestions look so clean. I'll just have to try it out!

[@Michielofzo]

Can you share the code? This could be a great plugin 😀 Or atleast something i include in my composer.json dev in every project.

[@aarondfrancis]

Yes! Let me work on it

[@MatthewPoulterVCSW]

Did you manage to get WebSockets proxied as well to support auto-reloading?

[@aarondfrancis]

Yup!

[@MatthewPoulterVCSW]

@@aarondfrancis Hmm, I must have missed something then. I'm getting `WebSocket connection to 'wss://site.test/' failed` errors.

[@MatthewPoulterVCSW]

Found it! Turn off HTTPS in Herd :)

[@dabijavictor6069]

why don't using docker sail ?

[@aarondfrancis]

I don't need it. Herd does everything I need.

[@techietoons]

Editing glitch at 1:50... hehe

[@aarondfrancis]

haha oh well

[@mikeziri]

iOS Simulator should also help because you can hit local hosts.

[@khanra17]

Any reason for using ngrok over built-in expose?

[@aarondfrancis]

The config file so I can route vite and Laravel

[@ahmad-murery]

Interesting. Now how does Laravel handle infinite loops? Thanks Aaron!

[@aarondfrancis]

Sorry I don't understand the question

[@ahmad-murery]

@@aarondfrancis I mean @ 11:15 the while(true) loop. as I know php uses set_time_limit() / max_execution_time configuration to limits the maximum execution time, and setting that to 0 (no limit) may affect the server load and it may be better to run such script in the background. anyway, I replayed that part again and I think you mentioned that the process facade will put it in the background. Thanks once again.

[@aarondfrancis]

Ah this is a CLI, so there should be no such limit

[@ahmad-murery]

@@aarondfrancis I see 👍

[@amalebu]

watch this many time but when i tried it out, i add request_header - host: local.test ngrok auto redirect to local.test with status 301 Moved Permanently can you help pls :(

[@aarondfrancis]

Does it load in the browser when you just hit local.test? Before you do any ngrok stuff?

[@amalebu]

@@aarondfrancis thank you for reply. but after do that ngrok stuff like on this video at 03:52 , then access ngrok link, browser automatically redirect to local.test again.

[@aarondfrancis]

@@amalebu Right, I'm trying to help you debug. Start with the easy steps. 1) does it work without ngrok? 2) does any other site work with ngrok? 3) can you spin up a brand new app to see if it works there? maybe it's your app? I'd go down that road. good luck!

[@amalebu]

@aarondfrancis thank you very much for always replying and give solutions.. cant wait for more videos from you. Big thanks

[@setkyarwalar]

I use Tailscale funnel for tunnel.

[@InSaneRoGer112003]

or just use vscode port forwarding ??

[@aarondfrancis]

Perhaps you didn't notice that I do not use VS Code

[@InSaneRoGer112003]

@@aarondfrancis 😓

[@i_Amazin_]

This man runs ublock origin AND adblock plus. Impenetrable :'D

[@aarondfrancis]

Try to show me an ad, I dare you!

[@pedropinho2575]

master class

[@maheshrao7425]

This custom domain no longer works now, seems like after this video, ngrok blocke it.

[@thejonte]

why not just use your lan?

[@aarondfrancis]

Cause I also need to share with my coworker who lives in a different state!

[@GTCrais]

Awesome video. I need an AI service that's gonna pull all the code from this video into file(s) :D

[@kirayamato6128]

i loveyou Aaron

[@aarondfrancis]

🫶 thank you

[@eat_things]

❤

[@Vichion]

Since you have to configure apache/nginx if you wanna host bare-metal or via VPS, learning how to config access via your own network is a really good lesson. all these 3rd party ways just make you less capable of handling stuff on your own.

[@aarondfrancis]

I got exactly the outcome I was looking for... what do you mean I'm not capable of doing it on my own? What do you want from me!

[@Vichion]

@aarondfrancis I have no intention of causing any harm or conflict. I simply wanted to share my perspective on using third-party "do it for you" tools in software development. I understand that for solo developers or small teams handling multiple aspects of a project, taking shortcuts may seem appealing. However, I believe that this approach can hinder your learning and understanding of the actual deployment process. Once a project is in production, it cannot rely solely on local development environments and temporary solutions like ngrok. By avoiding shortcuts, you can acquire and retain the skills necessary to properly maintain your project in the long run. Of course, if you are solely responsible for the Laravel development and others handle other aspects, then using these tools can be beneficial. I apologize if my previous comment came across as snarky or disrespectful. That was not my intention.

[@aarondfrancis]

Sure, no problem. This is just a way to share a local only project. Ngrok is the easiest way to expose my local machine to the public internet. It's completely separate from the deployment process or even anything related to production. Ngrok (or their friends) is the best tool for the job. I don't even know how I'd route a domain to my local machine without them.

[@Vichion]

@aarondfrancis To launch an Apache or Nginx server and point a domain to it, install the web server on your machine, configure the server settings, ensure the server is running, then update your domain's DNS A-record to point to your server's IP address. I'd say that it's easier than what this video takes you through if the server configuration is omitted 😅 I set up my own dev server for free on oracle using this method. There is no need to use my local machine anymore when I dev, which feels so good 😎

[@aarondfrancis]

But I want to use my local machine. That's what you're missing. I know how to use a server. I know how to deploy! I know how to set up nginx. I want to serve it from my Macbook so I can debug things locally with my business partner who lives far away.