Struggling with Laravel + Vite

No video

Struggling with Laravel + Vite

Рет қаралды 9,030

Күн бұрын

Laravel Herd has a nice `share` feature built in, but it doesn't handle Vite very well. Watch me fix that issue!
• Laravel Herd's share: herd.laravel.c...
• Ngrok: ngrok.io/

Пікірлер: 77

@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.

@polojuninho Ай бұрын

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

@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

@codingscience0 Ай бұрын

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 Ай бұрын

🤏

@kingstalker Ай бұрын

gotta love ryan reynolds doing laravel 😃

@hectorcenteno7315 Ай бұрын

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

@kyngcytro Ай бұрын

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

@haidubogdan8712 Ай бұрын

good ol ngrok, good for paypal development notifications also

@MatteoPresot 26 күн бұрын

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!!!

@sebastianhilger6083 Ай бұрын

Wow I learned soooo much. And so useful right away! Thank you! Would Laravel Context maybe be a replacement for the sharefile solution? This might be a package idea - are thinking of making it into one?

@SimonHamp Ай бұрын

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

@sajjadhossainshohag3459 Ай бұрын

You are awesome Aaron, Thanks.

@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!

@ivanjelenic5627 Ай бұрын

Thanks, learnt signalable commands!

@phefochis6149 Ай бұрын

Thanks Aaron, great content 🎉

@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 :)

@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.

@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!

@stefan48391 13 күн бұрын

Why not using expose?

@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.

@vzlamrbeastfan Ай бұрын

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

@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

@i_Amazin_ Ай бұрын

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

@aarondfrancis Ай бұрын

Try to show me an ad, I dare you!

@dabijavictor6069 Ай бұрын

why don't using docker sail ?

@aarondfrancis Ай бұрын

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

@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 👍

@khanra17 Ай бұрын

Any reason for using ngrok over built-in expose?

@aarondfrancis Ай бұрын

The config file so I can route vite and Laravel

@pedropinho2575 Ай бұрын

master class

@mikeziri Ай бұрын

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

@techietoons Ай бұрын

Editing glitch at 1:50... hehe

@aarondfrancis Ай бұрын

haha oh well

@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

@eat_things Ай бұрын

❤

@InSaneRoGer112003 Ай бұрын

or just use vscode port forwarding ??

@aarondfrancis Ай бұрын

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

@InSaneRoGer112003 Ай бұрын

@@aarondfrancis 😓

@thejonte Ай бұрын

why not just use your lan?

@aarondfrancis Ай бұрын

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

@kirayamato6128 Ай бұрын

i loveyou Aaron

@aarondfrancis Ай бұрын

🫶 thank you

@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.