How to create project folder in xampp?

XAMPP is providing easy interface to execute various task easily. One of them is creating project folder(Directory). Lots of new learners are unable to figure out how to create project folder in xampp.

Create Project Folder (Directory) in XAMPP

Creating project folder in xampp is slightly different in windows and Mac os x.

If you are not aware of how to start xampp, then read following article:
How to start xampp in windows and mac os x?

Create Project Folder (Directory) in XAMPP in windows

  • First Launch XAMPP

xampp launch in windows operating system

  • Then look through extreme right button column and find ‘Explorer’.

project in xampp windows

  • Then locate ‘htdocs’ folder and create project directory inside it.

htdocs xampp windows

Create Project Folder (Directory) in XAMPP in MAC OS X

  • Launch xampp in MAC OS X

start xampp in mac os x step 8

  • Then navigate to Volumes. And click on mount.

xampp create project mac os x

xampp create project mac os x

Then click on Explore.

  • List of xampp directory is going to appear. Locate ‘htdocs’ folder and create root project folder inside it.

xampp create project mac os x

xampp create project folder mac os x


I have created a project root directory ‘demo’ inside htdocs directory (Folder). At this point, my project root directory is empty. You can set any name for your project directory inside htdocs directory but the condition is no space and special characters are allowed in the name.

Lets Test Our Project Directory is working fine?

If your xampp server is not running, then start it.

  • Open a new file in any text editor. (Notepad++, Sublime, Notepad, TextEdit)
  • Copy following exact text in to the file. (Type into the file)



<title>This is a sample webpage</title>

<meta name=”content” description=”this is a sample webpage for practice purpose.”/>



This is a sample webpage. This webpage is for practice purpose. I have successfully developed the webpage.



  • Save this file as “index.html”.

Open Any browser and visit following link.

  • For windows: http://localhost/demo/
  • For Mac: http://localhost:8080/demo/

xampp project in mac os x

What is index.html?

When a user visits a website, by default browser looks for index file in the root project folder to load. Index file is the root file which loads into the clients browser. Thats why, when you create a root file for your project you have to name it as index file with its respective extension. Here in this example, we have created html file. Thats why, we have saved the root file as index.html

If you are new to html and want to learn more, then visit following link

HTML For Absolute Beginners