XAMPP 与 HBuilder X 搭建 PHP 开发环境：从零到 Hello World

PHP简介PHP 是一款开源的服务器端脚本语言专为 Web 开发而生可嵌入 HTML 快速实现动态网页功能。 当前全球超七成网站仍由 PHP 驱动凭借 WordPress 等 CMS 系统占据庞大存量市场是中小建站、电商场景的主流选择CSDN。 随着 PHP 8 版本的性能升级与 Laravel 等现代框架发展它依然活跃在 Web 开发的主流生态中。准备工作:1.下载软件xampp或者是phpstudy:Windows版phpstudy下载 - 小皮面板(phpstudy)2.下载编译软件PhpsStorm或这是Visual Studio Code或者是HBuilder X3.Google Chrome下载地址:Google Chrome 网络浏览器VSCode插件(可选):VS code常用插件推荐最新版_vscode 标签提示插件-CSDN博客一、软件下载与安装1.下载xampp先进入xampp的官网选择其中一个版本进行下载建议使用谷歌浏览器下载Download XAMPPhttps://www.apachefriends.org/zh_cn/download.htmlhttps://www.apachefriends.org/zh_cn/download.htmlhttps://www.apachefriends.org/zh_cn/download.htmlhttps://www.apachefriends.org/zh_cn/download.html2.安装xampp双击下载下来的安装程序根据向导完成软件的安装警告直接确认等待安装安装完成补充:使用的是phpstudy如果启动不起来请更改他的端口报错在重新运行连接数据库用的是phpstudy中的MySQL是有密码(密码是root)才能进行连接xampp是空字符串端口如果有更改连接的时候端口也要更改密码是root如何查看phpstudy中的MySQL的密码单机左侧的数据库把鼠标往密码一放就显示MySQL的密码了记住密码使用Navicat连接phpstudy中的MySQL3.下载HBuilder X这里以HBuilder X为演示提供下载网址:HBuilder X:HBuilderX-高效极客技巧PhpsStorm(需要在设置中配置一下php.exe):Download PhpStorm: The PHP IDEVisual Studio Code(需要安装PHP的插件):Download Visual Studio Code - Free AI Code Editor for Mac, Linux, Windows步骤4.安装HBuilder X双击HBuliderX.exe创建桌面快捷方式二、环境配置在xmapp的安装目录下查找php文件夹复制地址栏中的地址Wini打开设置→系统→系统信息→高级系统设置→环境变量 “或者是” 在搜索中输入输入path回车 “或者是“ WinR 输入sysdm.cpl→回车 →高级→环境变量双击系统变量中的PATH→单机新建把刚才php的文件夹的地址粘贴到这里边然后连续三次单机确定1.验证是否配置成功Winr 输入cmd回车在控制台中输入php -v出现版本号就证明成功了如果是出现php不在内部命令就需要重新配置三、给管理员权限1.xampp需要给管理员权限xampp安装完成后不会在桌面上直接显示需要在所有中查找在安装目录中找到XAMPP Control Panel找到后右击选择属性在属性对话框中单机兼容性选项卡勾选以管理员身份运行此程序单机更改所有用户的设置→勾选以管理员身份运行此程序,单机应用单机确定2.创建快捷方式四、测试1.启动xampp2.启动Apache服务3.Apache启动成功如果启动不起来在下面的控制台报错则需要去更改服务端口一般的情况就是端口报错如果不是端口问题则需要去详细阅读错误信息并寻找解决方法4.启动MySQL5.MySQL启动成功连接Navicat6.验证Apache的主页面是否能访问成功单机Apache后面的Admin自动跳转到浏览器上会出现dashboard页面就证明可以启动成功如果不能启动成功请检查输出的日志7.验证PHPMyAdmin的主页面是否能访问成功8.项目测试打开HBuilder X→打开目录一定要选择xampp文件夹下的htdocs在左侧的文件夹中右击选择新建→选择0.自定义文件名字为xxxx.php,位置不要改单机创建输入这段代码CtrlS保存不要点这个图标因为不是html所以运行方式也不一样?php echo(Hello World); ?打开浏览器访问http://localhost:8080/demo.php就能出现结果9.配置调试调试可以看见代码是怎么运行的可以一步一步找出错误的原因HBuilder X配置(可以不配置推荐使用谷歌浏览器访问http://localhost/项目名)如果不想在浏览器中输入localhost\项目名就需要配置HBuilder X中的Web服务器运行→运行到浏览器→配置web服务器→外部web服务器调用url输入:http://127.0.0.1 或者是 http://localhost/,端口不要更改localhost默认解析对应127.0.0.11.本质不同localhost 是域名127.0.0.1 是IPv4 回环 IP 地址。系统通过 hosts 文件默认把 localhost 解析到 127.0.0.1这是配置出来的映射不是天然相等。2.可以修改你可以在 hosts 文件里把 localhost 指向任意 IP也可以给 127.0.0.1 绑定多个不同的域名。3.范围不同localhost 同时还会解析到 IPv6 的回环地址 ::1并不只对应 127.0.0.1。PHPStrom配置文件→设置→选择PHP→CLI解析器配置为php.exe的完整路径如果配置了环境变量这个地方会自动识别如果没有配置请在编译器中进行配置单机应用和确定配置文件php.ini先断点在左侧的序号列上单机在最上面把开始侦听PHP调试连接打开单机调试选择带php图标的不要选择带js图标的在红色框的这个地方第一次运行会报错误点击一下错误编译器会告诉你需要安装XDebug插件直接安装会在编译器中打开php.ini的文件直接关闭这个就行然后在进行调试就可以了激活如果低版本需要激活PHPStrom这款软件需要以管理员身份运行打开powershell输入下面这条命令进行激活等待按三次回车就可以了等待激活即可激活成功后会打开一个网页直接关闭就行因为网页中是激活码用不到目前JetBrains最新2026版的软件免费使用不需要激活即可使用irm ckey.run | iexVSCode配置插件市场→搜索PHP→选择PHP IntelliSense和PHPDebug进行安装(PHPDebug是专门调试代码用的)安装成功后我们写一个代码进行测试一下效果:PHP Debug调试模式调试模式需要断点鼠标往行序号前面一放就会有红色的点点一下就打上断点了断完点后单机上面的三角形▶→选择Debug PHP File然后就会出现一个托盘根据托盘的图标控制代码的下一步运行最后的结果显示在调试控制台中五、端口修改1.Apache端口修改Apache默认占用的端口号是80端口MySQL认占用的端口号是3306端口先关闭Apache的服务选择Service and Port Settings在Apache选项卡中把Main Port的端口改为8080单机Save在xampp的控制面板中单机Config→选择Apache(httpd.conf)→把Listen 80改为8080更改完后CtrlS保存并重新启动服务重新启动服务打开admin只要显示dashboard页面就证明Apache服务启动成功如果要查看是哪个程序占用了80端口可以使用这个命令在cmd中运行netstat -ano | findstr 8080这个命令根据端口号和PID去寻找。或者是单机Netstat查看2.MySQL端口修改MySQL默认是3306但是有可能有MySQL的单独服务占用3306的端口运行在MySQL选项卡的Main Port将3306改为3307更改完后CtrlS保存并重新启动服务然后在MySQL相对应的config中修改my.ini的配置文件将这两个端口换成3307CtrlS保存重新启动服务查看phpmyadmin页面是否能加载成功只要显示phpmyadmin页面就证明Apache服务启动成功出现这个问题就:需要修改Apache中的设置1.先停掉Apache和MySQL的服务单机后面对应的Stop单机Apache后面的Config中的PHP(php.ini)CtrlF打开搜索输入3306有两个3306将这两个3306改为3307更改后CtrlS保存重新启动服务出现这个页面就证明修改成功了六、注意运行PHP项目的时候一定放在xampp文件夹中的htdocs文件中Apache默认端口为80端口有很大的几率会冲突因为Nginx、Watt Toolkit等一些软件占用的端口也是80这时可以将80换成8080或8081或8082访问项目的时候如果端口更改了则需要在localhost:端口号/项目名(项目名是完整的名字例如:demo.php)例如:http://localhost:8080/demo.php或者访问http://127.0.0.1/demo.php如果是更改了端口不管是访问那个网址后面都要加端口号localhost和127.0.0.1是默认解析对应关系1.localhost 是域名127.0.0.1 是IPv4回环IP地址。系统通过 hosts 文件默认把 localhost 解析到 127.0.0.1这是配置出来的映射。2.你可以在 hosts 文件里把 localhost 指向任意 IP也可以给 127.0.0.1 绑定多个不同的域名。3.ocalhost 同时还会解析到 IPv6 的回环地址 ::1并不只对应 127.0.0.1。日常开发里可以粗略理解成“都代表本地服务”但技术层面二者完全是两个概念。我的端口为80端口访问的时候网址是http://localhost/demo.php如果是文件夹则需要localhost:端口号/项目名就是有文件夹文件夹中有php文件(例如:E:/xampp/htdocs/120/index.php)http://localhost/120/index.phpMySQL默认端口为3306端口如果电脑上之前安装过MySQL的软件肯定会与xampp中的MySQL有冲突这时可以将3306换成3307或3308红色框中的所有内容为日志如果有服务启动不起来看日志都会有相应的报错信息然后根据报错信息去寻找相应的方法这个服务可以打开/关闭也可以不打开在开启前需要关闭服务在打开这就是打开自启动然后在开启服务Shell:是xampp中的控制台Explorer:是xampp安装目录项目就是放在htdocs文件夹下Quit:退出在xampp中启动MySQL单机xampp控制面板中的Shell输入mysql -uroot -p回车在这里声明一下xampp中自带的MySQL数据库是叫MariaDB就是mysql的一个版本他的连接密码是空字符串就是什么都不用输入直接敲两次回车就行服务必须启动这三个一般情况下用不到如果浏览器中已经访问了这个项目修改后保存保存完成后在网页上按F5刷新或者是按刷新按钮就可以看到效果