從零開始搭建網站環境（php-yaf nginx mariadb）第三章

上一章咱們已經搭建了一個基本的運行環境，今天來看看如何建立一個網站吧

咱們的網站分爲兩部分，前端頁面和後端服務

前端	VueJs
後端	php（Yaf框架）

網站的編寫直接在本地的電腦上，開發和調試方便，以後只要把開發好的項目傳到服務器就能夠了

搭建本地開發環境（Windows10）

這裏就簡單點，直接用現成的軟件就行了，好比我用的phpstudy

下載PhpStudy

https://www.xp.cn/
根據本身的系統，下個合適的版本就能夠了
安裝好phpstudy後運行軟件，只啓動Nginx就能夠，咱們的數據庫使用線上的，保證數據的統一

在D盤新建 www 目錄,而後進入並創建 apiServer 目錄，這就是咱們的後端服務目錄。
這裏提早說一下，Yaf的基礎目錄結構：

+ public
  |- index.php //入口文件
  |- .htaccess //重寫規則    
  |+ css
  |+ img
  |+ js
+ conf
  |- application.ini //配置文件   
+ application
  |+ controllers
     |- Index.php //默認控制器
  |+ views    
     |+ index    //控制器
        |- index.phtml //默認視圖
  |+ modules //其餘模塊
  |+ library //本地類庫
  |+ models  //model目錄
  |+ plugins //插件目錄

注：
來自 YAF框架入門教程

這裏爲了環境能正常運行，咱們先創建public文件夾，其他的講到後端的時候再說。

+ www
  |+ apiServer
      |+ public
          |- info.php

編輯info.php:

<?php
phpinfo();
?>

建立網站：

這樣網站就建立完了，打開瀏覽器確認一下吧：
訪問 http://api.server.com/info.php

若是訪問失敗，極可能是hosts文件沒有成功寫入 查看解決辦法

安裝Yaf擴展

windows10和CentOS7安裝方法不同，先去 http://pecl.php.net/package/yaf 下載 php_yaf.dll


根據電腦版本下載 x64 或者 x86
解壓 php_yaf-3.0.9-7.3-nts-vc15-x64.zip
複製 php_yaf.dll 到 phpstudy安裝目錄/Extensions/php/php7.3.4nts/ext/
打開php_yaf擴展

刷新瀏覽器，看到下圖就說明成功了

前端

安裝腳手架（Vue-cli）

關於舊版本
Vue CLI 的包名稱由 vue-cli 改爲了 @vue/cli。 若是你已經全局安裝了舊版本的 vue-cli (1.x 或 2.x)，你須要先經過 npm uninstall vue-cli -g 或 yarn global remove vue-cli 卸載它。

• 安裝NodeJS
  https://nodejs.org/zh-cn/
• 打開cmd控制檯

• 安裝Vue-cli

  npm install -g @vue/cli

建立項目

• 控制檯打開目錄 www

  vue create html

  如何安裝項目此處略過，百度有不少教程

• 運行項目

  npm run serve

• 瀏覽器訪問 http://localhost:8080 就能夠看到了

未完待續

目錄：
從零開始搭建網站環境（php-yaf nginx mariadb）第一章
從零開始搭建網站環境（php-yaf nginx mariadb）第二章