Princess22Pants's avatar

API development environment

HI, I'm quite new to development in laravel (about 2 weeks) so please forgive that there's a stupid question in here.

I'm developing a few projects that are linked and have decided to go down the route of using an API to link them. My first version of the API project (built in laravel) is done. I'm working on the second project and of course I need the API project running at the same time. So I shifted the API to a different port - and this works - sometimes.

I open the API project, grab a couple of VSCode terminals and run "composer run dev" in one and "php artisan serve --port=8001" in the other

however at this point I'm already seeing before the artisan serve that composer is saying I can go to localhost:8000 and view the project (and it's right it works - that's a problem!)

after the serve the API (and it's dashboard) are available on both 8000 and 8001

if I blinding push on and open up the second project run the commands using port=8000 on the serve everything completes and it's happy but still only the API project actually browsable.

So questions, firstly what's the real difference between running npm run dev and composer run dev - they 'seem' to do the same thing (I'm sure they don't) but searching just tells me if I'm using composer then use composer.

secondly any suggestions to what I need to change in my process to make this work properly every time it feels like sometimes it all works how I expect, other it seems that something gets changed somewhere and what is available on port 8000 changes.

any advice appreciated

0 likes
9 replies
Glukinho's avatar
Glukinho
9 months ago
Best Answer
Level 31

what's the real difference between running npm run dev and composer run dev

see what these commands really do in composer.json and package.json respectively. For example, in my current environment:

// composer.json
"scripts": {
        ... "dev": [
            ... "npx concurrently -c \"#93c5fd,#c4b5fd,#fb7185,#fdba74\" \"php artisan serve\" \"php artisan queue:listen --tries=1\" \"php artisan pail --timeout=0\" \"npm run dev\" --names=server,queue,logs,vite"
        ],

// package.json
"scripts": {
		...
        "dev": "vite"

So composer run dev starts npm run dev, you don't have to start it again.

I'd say you need to start only php artisan serve --port=8001 on first project so it replies on API requests from second project while you're developing the second one. Port 8001 to not mess with second project.

1 like
Princess22Pants's avatar

Thanks weirdly despite so much searching I just stumbled across the answer through many googling sessions and now understand. Your answer has reassured me I have got the right answer now too, thank you! Stable environment here I come!

FeatureCreepKing's avatar

Maybe something like Herd can help host local versions so you can multiple sites at the same time?

1 like
Princess22Pants's avatar

@AndrewCade thanks I'll take a look at that, I'm only working on two at a time right now, but soon it'll be 3 so anything that makes that easier will help!

martinbean's avatar

@princess22pants npm run dev will just run the Vite server. This will build your front-end assets (CSS and JavaScript) and enable hot-reloading, but it won’t ru your Laravel application. You’d need to run a PHP server for that.

If you‘re developing a project that’s going to have multiple different services (i.e. an API and then separate applications consuming that API) then I’d be looking at something like Docker Compose to run the project, so that you can run docker compose up and it boots up all the applications you need.

Please or to participate in this conversation.