Laravel Local Development Setup Guide

/ Coding, IT / By

This guide will walk you through setting up a robust development environment using VSCode, Laragon, Node.js, PHP, and PostgreSQL.

I. Pre-Installation Downloads

Before we begin the installations, let’s gather all the necessary files. It’s recommended to create a temporary “Downloads” folder to keep everything organized.

  1. Visual Studio Code (VSCode):
    • Go to the official VSCode website: https://code.visualstudio.com/
    • Click on the “Download” button for your operating system (Windows, macOS, or Linux).
  2. Laragon (v6):
    • Visit the Laragon download page: https://laragon.org/download/
    • Crucially, locate and download Laragon version 6. Avoid version 7 and above as they may require a license. Look for a link like “Laragon Full (v6.0.0)” or similar.
  3. Node.js (v22.10.0):
    • Go to the official Node.js website: https://nodejs.org/en/download/releases
    • Navigate to the “Previous Releases” section.
    • Find and download the Windows Binary (.zip) for Node.js version 22.10.0 (e.g., node-v22.10.0-win-x64.zip). Make sure to download the 64-bit version.
  4. PHP (v8.3.*): Replace the * with the downloaded version
    • Go to the PHP for Windows downloads page: https://windows.php.net/downloads/releases/
    • Search for php-8.3.*-Win32-vs16-x64.zip. If that exact version is unavailable, look for the closest php-8.3.*-Win32-vs16-x64.zip version.
    • Ensure you download the Thread Safe, 64-bit, VS16 version.
  5. PostgreSQL 15.10 or PGAdmin:
    • Option A (PostgreSQL Installer):
      • Go to the PostgreSQL download page: https://www.postgresql.org/download/
      • Select “Windows” and then “Download the installer”.
      • Choose PostgreSQL version 15.10 (or the closest available stable 15.x version) for your operating system.
    • Option B (PGAdmin Only – if you prefer a separate GUI for an existing PGSQL instance or plan to use Laragon’s quick-add feature later):

II. Installation and Extraction

Now that you have all the necessary files, let’s proceed with the installations.

  1. Install Visual Studio Code (VSCode):
    • Run the downloaded VSCode installer (VSCodeUserSetup-x.xx.x.exe).
    • Follow the on-screen prompts. It’s generally safe to accept the default settings.
    • Highly Recommended: During installation, ensure you check the options for “Add ‘Open with Code’ action to Windows Explorer file context menu” and “Add ‘Open with Code’ action to Windows Explorer directory context menu.” This will make it easier to open projects in VSCode.
  2. Install Laragon:
    • Run the downloaded Laragon installer (laragon-wamp.exe or similar).
    • Follow the on-screen instructions. Choose your desired installation directory (the default C:\laragon is usually fine).
    • Do NOT start Laragon yet after installation is complete. Uncheck any “Launch Laragon” options if prompted.
  3. Extract Node.js:
    • Locate the downloaded node-v22.10.0-win-x64.zip file.
    • Right-click on the zip file and select “Extract All…” or use your preferred unzipping tool (e.g., 7-Zip, WinRAR).
    • Extract the contents to a temporary location (e.g., your “Downloads” folder). You should get a folder named node-v22.10.0-win-x64.
  4. Extract PHP:
    • Locate the downloaded php-8.3.*-Win32-vs16-x64.zip file.
    • Right-click on the zip file and select “Extract All…” or use your preferred unzipping tool.
    • Extract the contents to a temporary location (e.g., your “Downloads” folder). You should get a folder named php-8.3.*.
  5. Place Extracted Files into Laragon Directories:
    • Open your Laragon installation directory (by default, C:\laragon).
    • For Node.js:
      • Navigate to C:\laragon\bin\nodejs\
      • Move the extracted node-v22.10.0-win-x64 folder (the one containing node.exe) from your temporary location into C:\laragon\bin\nodejs\.
    • For PHP:
      • Navigate to C:\laragon\bin\php\
      • Move the extracted php-8.3.* folder (the one containing php.exe) from your temporary location into C:\laragon\bin\php\.
  6. Install PostgreSQL (if you chose the installer option):
    • Run the downloaded PostgreSQL installer (postgresql-15.10-x-windows-x64.exe).
    • Follow the prompts. You’ll be asked to set a password for the postgres superuser. Remember this password!
    • You can usually accept the default installation components.
    • If prompted to install Stack Builder, you can uncheck it as we will manage extensions manually or through Laragon.

III. Laragon Configuration and Verification

Now that all components are in place, let’s configure Laragon and verify the installations.

  1. Run Laragon:
    • Double-click the Laragon icon on your desktop or in your Start Menu to open it.
  2. Select PHP and Node.js Versions in Laragon:
    • In the Laragon window, right-click anywhere in the main window.
    • Go to PHP and select 8.3.* (or the version you extracted).
    • Right-click again, go to Node.js, and select 22.10.0 (or the version you extracted).
  3. Apache Fix for “Start All” Error (Crucial Step):
    • After selecting the versions, click the “Start All” button in Laragon. You might encounter an error related to Apache, often a port conflict or a missing module.
    • If you encounter an error (e.g., “Apache: httpd.exe – unable to start the program because MSVCR110.dll is missing”):
      • Solution 1 (Missing DLLs): Download and install the Microsoft Visual C++ Redistributable Package.
      • Solution 2 (Port Conflict – if Apache fails to start without specific DLL errors):
        • Right-click in Laragon -> Apache -> httpd-conf. This will open the Apache configuration file.
        • Look for Listen 80. If you have other software using port 80 (e.g., Skype, IIS), you might need to change this to a different port (e.g., Listen 8080).
        • If you change the port, also look for ServerName localhost:80 and change it to ServerName localhost:8080.
        • Save the file and try “Start All” again.
      • For more in-depth troubleshooting and community solutions, refer to the Laragon GitHub discussions, for example: https://github.com/leokhoa/laragon/issues (You can search for specific error messages here).
  4. Verify Installations via Command Line:
    • Once Laragon’s “Start All” is successful, open your Command Prompt (CMD) or PowerShell.
    • Type the following commands one by one and press Enter after each. You should see the version numbers displayed, indicating correct installation and PATH configuration by Laragon.
    Bashphp -v node -v composer -v npm -v git -v
    • Expected Output Example:
      • php -v should show PHP 8.3.*...
      • node -v should show v22.10.0
      • composer -v should show Composer version details (Composer is automatically included with Laragon and correctly configured if PHP is working).
      • npm -v should show an npm version (npm is bundled with Node.js).
      • git -v should show a Git version (Git is usually bundled with Laragon or installed separately, Laragon tries to set its path).

IV. VSCode Extensions

Enhance your VSCode experience with these useful extensions.

  1. Open VSCode.
  2. Go to the Extensions view by clicking the square icon on the sidebar or pressing Ctrl+Shift+X.
  3. Search for and install the following extensions:
    • Peacock by John Papa
      • Purpose: Allows you to subtly change the color of your VS Code workspace. Useful when you have multiple VS Code instances open and want to quickly identify them.
    • Restore Terminals by Ethan Sarif-Kattan
      • Purpose: Automatically restores your integrated terminals when you reopen a VS Code workspace, saving you time.
    • DBCode by DBCode
      • Purpose: Provides a powerful way to connect to and manage various databases (including PostgreSQL) directly within VS Code.

V. Project Setup and GitHub Integration

  1. Create Your Project Directory:
    • Navigate to C:\laragon\www\
    • This is the root directory where Laragon serves your web projects. Create a new folder here for your project (e.g., my-awesome-project).
    • Example: C:\laragon\www\my-awesome-project
  2. VSCode and GitHub Integration (Highly Recommended):
    • Sign up for a GitHub account: If you don’t have one, go to https://github.com/join and create an account.
    • Log in to GitHub in VSCode:
      • Open VSCode.
      • Go to File -> Preferences -> Settings (or Ctrl+,).
      • Search for “GitHub” and look for “GitHub Authentication”. Ensure it’s enabled.
      • Alternatively, open the “Source Control” view (Ctrl+Shift+G), and you’ll often see a prompt to “Sign in to GitHub” or “Clone Repository”. Click on this and follow the prompts to authorize VSCode with your GitHub account.
      • Benefit: This allows for seamless Git integration, push/pull operations, and synchronization of settings and extensions across your development machines.

VI. Adding PostgreSQL to Laragon

While you might have installed PostgreSQL separately, Laragon provides a quick way to integrate it and manage its services.

  1. Open Laragon.
  2. Right-click anywhere in the main Laragon window.
  3. Go to Tools -> Quick add.
  4. From the list, select postgresql-14 (or the nearest available stable version if 14 isn’t listed or you need a specific older version).
  5. Laragon will download and install the PostgreSQL binaries into its own bin directory. Wait for the installation to finish.
  6. Stop and Restart Laragon Services:
    • Click the “Stop All” button in Laragon.
    • Click the “Start All” button in Laragon. This will ensure Laragon recognizes and starts the newly added PostgreSQL service.
    • You should now see PostgreSQL listed under Database when you right-click in Laragon, and you can start/stop it from there.

VII. Troubleshooting NPM Policy Execution Error

If you encounter a Policy_Execution error when running npm commands, especially in PowerShell, it’s usually due to PowerShell’s execution policy preventing script execution.

  1. Open PowerShell as Administrator:
    • Search for “PowerShell” in the Start Menu.
    • Right-click on “Windows PowerShell” and select “Run as administrator”.
  2. Change Execution Policy:
    • In the Administrator PowerShell window, type the following command and press Enter:PowerShellSet-ExecutionPolicy RemoteSigned -Scope CurrentUser
    • When prompted, type Y and press Enter to confirm.
  3. Close and Reopen your regular Command Prompt/PowerShell (not as administrator) and try your npm command again. This should resolve the issue.

VIII. Next Steps (Docker Setup)

  • Docker Setup: Docker is a powerful tool for creating isolated development environments. Setting it up involves downloading Docker Desktop, configuring it, and then learning to build and run containers. This is a more advanced topic and warrants its own dedicated guide.

You are now well-equipped with a robust development environment! Happy coding!

Scroll to Top