Zouein.com • Step by step hosting a Laravel "Decoupled Architecture" Frontend/Backend on Windows

Page 1 of 1

Step by step hosting a Laravel "Decoupled Architecture" Frontend/Backend on Windows

Posted: Sat Jun 20, 2026 10:19 am

by admin

This installation presumes that you have 3 main things:

The frontend folder

The backend folder

The sql file for database

Installing IIS on Windows 11:
Click the Start button, type Control Panel, and select the Control Panel app from the results.
In Control Panel, click Programs, then select Turn Windows features on or off.
Scroll through the list and locate Internet Information Services.
Check the box next to Internet Information Services to enable it.

Expand the IIS tree of (Internet Information Services) to select additional components:
Web Management Tools:
IIS Management Console

World Wide Web Services:
Application Development Features
All except: Application Initialization & WebSocket Protocol

Common HTTP Features:
All

Health and Diagnostics:
HTTP Logging

Performance and Features:
Static Content Compression

Security:
Basic Authentication
IP Security
Request Filtering

Click OK to apply changes and wait while Windows installs the necessary files.
===================================================================
Download and install URL Rewrite Module 2.1:
https://download.microsoft.com/download ... _en-US.msi
(rewrite_amd64_en-US.msi)
===================================================================
Download and install the Visual C++ Redistributable for Visual Studio 2015-2022 (now often referred to as Visual C++ v14):
https://aka.ms/vc14/vc_redist.x64.exe
(VC_redist.x64.exe)
===============================================================
Download php 8.2.3 and unzip it to C:\php\php8.2.3
Edit the php.ini and enable necessary extensions. (i will upload a copy of my php.ini here for ref.)
==================================================================
Install phpmanager for iis:
https://github.com/phpmanager/phpmanage ... IS_x64.msi
(PHPManagerForIIS_x64.msi)
After installation, close and reopen IIS,
Create new website with your domain name pointing to C:\inetpub\wwwroot\public\
Select your website,
Click PHP Manager, Register New PHP version (select C:\php\php8.2.3\php-cgi.exe)
Open Handler Mappings, Find your PHP handler in the list, right click and edit php-8.2.30
Click the Request Restrictions... button at the bottom.
in Mappings TAB uncheck "Invoke Handler..."
Go to the Verbs TAB.
If it says "One of the following verbs", make sure GET,HEAD,POST,PUT,DELETE,PATCH,OPTIONS are all in the box, separated by commas.

Click OK, OK, and then Yes if it asks to create a FastCGI application.

Run

Code: Select all

iisreset

in PowerShell as admin.
========================================================================================================
Download and install Notepad++ x64
https://notepad-plus-plus.org/downloads/v8.9.6.2/
============================================================================================================
Create a info.php file in www root folder with this inside:

Code: Select all

<?php
phpinfo();
?>

go to http://localhost/info.php to check if your setup is ok so far.
===========================================================================
Download and install MariaDB: from https://mariadb.org/
(mariadb-12.3.2-winx64.msi)
set your root password
=============================================================================
Download and install the prebuilt Node.js® for Windows:
https://nodejs.org/en/download/
https://nodejs.org/dist/v24.17.0/node-v24.17.0-x64.msi

to check installation, open powershell and run:

Code: Select all

node -v

then run:

Code: Select all

npm -v

,
if you get error like: cannot be loaded because running scripts is disabled on this system
to fix this : Change the Execution Policy by Running this command in your current PowerShell window:

Code: Select all

Set-ExecutionPolicy RemoteSigned -Scope CurrentUser

Code: Select all

Yes

then run:

Code: Select all

npm -v

you should get the version number now.
=====================================================================
Download and install Composer for windows:
https://getcomposer.org/download/
https://getcomposer.org/Composer-Setup.exe (Composer-Setup.exe)

when asked in settings check: make sure command-line php points to your folder: C:\php\php8.2.3\php.exe
Add this php to your path?

Code: Select all

yes

to check installation, open powershell and run:

Code: Select all

composer -V

===================================================================
Download and install HeidiSQL to import sql file into MariaDB
https://www.heidisql.com/download.php
https://github.com/HeidiSQL/HeidiSQL/re ... _Setup.exe
--------------------------------

Open HeidiSQL, connect to your local host with the previously set password.
Create new database, enter name, collation: utf8mb4_unicode_ci
Highlight the newly created database then File > Load SQL file then run. (selecting the xxx.sql file you want to import).
After sql importing is successful,
Click user manager, Add User, (fill user and pass), Add Object (select your database), select all options and save.
===================================================================
Setting up your Laravel project (you should have 2 zipped files, frontend and backend)
Unzip frontend into your www root directory
*If your website is in C:\inetpub\wwwroot\, give IIS_IUSRS and USERS "Full Control" permission to:
C:\inetpub\wwwroot\storage
C:\inetpub\wwwroot\bootstrap\cache
and point your iis to C:\inetpub\wwwroot\public\
Edit the ".env" or ".env.development" file: (enter database credentials and other stuff "i uploaded mine here for ref: frontend.env)

-----------------------
Create a new folder in root naming it: vue
Unzip "backend" into vue
Edit the ".env" or ".env.development" file: ( "i uploaded mine here for ref: backend.env)
Sample of .env file contents of backend:

Code: Select all

VITE_API_BASE_URL=http://abc.com
VITE_API_VERSION=/api/
VITE_ALLOWED_DOMAINS=http://abc.com,localhost,127.0.0.1

==========================================================
Open your terminal in the root folder (where your composer.json is) and run:
PowerShell

Code: Select all

composer install

you should now see a "vendor" folder appear in root.
=========================================================
Open your terminal powershell in the "vue" folder and run:

Code: Select all

npm install

if unzipping hangs, run instead:

Code: Select all

$env:CYPRESS_INSTALL_BINARY=0; npm install

if everything ok so far
then run:

Code: Select all

npm run build

if it gives error, then run:

Code: Select all

npm install --include=dev

-----------
After it finishes, check if the "engine" is actually there. Run:
PowerShell

Code: Select all

ls node_modules/.bin/vite

-------------------
*You should now see a folder named "dist" appear inside folder vue.
Copy the contents of that "dist" folder.
Paste them into C:\inetpub\wwwroot\public
=============================================================
If you edited .env in the Root (\inetpub\wwwroot\.env)
Open your terminal in the root folder and run:

PowerShell

Code: Select all

php artisan config:clear

------------------------------
The Re-Build (is Required) anytime you edit the .env file in vue folder, Run:

Code: Select all

npm run build

Then copy everything from the new dist folder.
Paste into C:\inetpub\wwwroot\public\
===========================================================
When adding your domain to iis, make sure to point C:\inetpub\wwwroot\public\
===========================================================
edit the web.config in public folder to the following:

Code: Select all

<?xml version="1.0" encoding="UTF-8"?>
<configuration>
  <system.webServer>
    <rewrite>
      <rules>
        <rule name="Vue Routes" stopProcessing="true">
          <match url=".*" />
          <conditions logicalGrouping="MatchAll">
            <add input="{REQUEST_FILENAME}" matchType="IsFile" negate="true" />
            <add input="{REQUEST_FILENAME}" matchType="IsDirectory" negate="true" />
          </conditions>
          <action type="Rewrite" url="/" />
        </rule>
      </rules>
    </rewrite>
	<modules>
      <remove name="WebDAVModule" />
    </modules>
        <handlers>
		<remove name="WebDAV" />
            <remove name="php-8.2.30" />
            <add name="php-8.2.30" path="*.php" verb="GET,HEAD,POST,PUT,DELETE,PATCH,OPTIONS" modules="FastCgiModule" scriptProcessor="C:\php\php8.2.3\php-cgi.exe" resourceType="Unspecified" requireAccess="Script" />
        </handlers>
  </system.webServer>
</configuration>

==========================================================================================