ShowProgramCode

2019年5月5日 星期日

laravel+bootstrap(composer install & npm install)

進入laravel之後,開始製作自己的頁面才發現Bootstrap Css沒有正確顯示,查了一下資料,雖然不是完全理解,不過我想大概是因為我沒有執行composer install和npm install,laravel需要外掛的一些元件沒有掛上去。

那麼開始執行程式吧!首先我沒有修改任何檔案,下面是cmd執行composer install的結果:

C:\AppServ\www\project\calibreBook
λ composer install
Loading composer repositories with package information
Installing dependencies (including require-dev) from lock file
Nothing to install or update
Package phpunit/phpunit-mock-objects is abandoned, you should avoid using it. No replacement was suggested.
Generating optimized autoload files
> Illuminate\Foundation\ComposerScripts::postAutoloadDump
> @php artisan package:discover
Discovered Package: fideloper/proxy
Discovered Package: laravel/tinker
Discovered Package: nesbot/carbon
Package manifest generated successfully.

到底安裝了什麼,其實我也搞不清楚,不過看到了php Unit,應該是和單元測試相關吧!其他東西就先不管了。

接著要執行npm install,這個時候cmd報錯了,npm不是內部或外部命令(我汗)。

查了一下,原來要執行npm前,還要先下Node.js,Node.js還有兩種版本LTS vs Current(狂汗),結論是LTS是長期維護版本,非前端專門的工程師,用這個就十分足夠了,Current裡面則會有新功能,專門的前端工程師可能會需要。

npm install執行時間非常長...(我汗),下面是執行完畢的結果(真的很長@@)
C:\AppServ\www\project\calibreBook
λ npm install
npm WARN deprecated browserslist@2.11.3: Browserslist 2 could fail on reading Browserslist >3.0 config used in other tools.
npm WARN deprecated browserslist@1.7.7: Browserslist 2 could fail on reading Browserslist >3.0 config used in other tools.
npm WARN deprecated gulp-util@3.0.8: gulp-util is deprecated - replace it, following the guidelines at https://medium.com/gulpjs/gulp-util-ca3b1f9f9ac5

> node-sass@4.12.0 install C:\AppServ\www\project\calibreBook\node_modules\node-sass
> node scripts/install.js

Downloading binary from https://github.com/sass/node-sass/releases/download/v4.12.0/win32-x64-64_binding.node
Download complete  ] - :
Binary saved to C:\AppServ\www\project\calibreBook\node_modules\node-sass\vendor\win32-x64-64\binding.node
Caching binary to C:\Users\Amy\AppData\Roaming\npm-cache\node-sass\4.12.0\win32-x64-64_binding.node

> uglifyjs-webpack-plugin@0.4.6 postinstall C:\AppServ\www\project\calibreBook\node_modules\webpack\node_modules\uglifyjs-webpack-plugin
> node lib/post_install.js


> node-sass@4.12.0 postinstall C:\AppServ\www\project\calibreBook\node_modules\node-sass
> node scripts/build.js

Binary found at C:\AppServ\www\project\calibreBook\node_modules\node-sass\vendor\win32-x64-64\binding.node
Testing binary
Binary is fine

> gifsicle@3.0.4 postinstall C:\AppServ\www\project\calibreBook\node_modules\gifsicle
> node lib/install.js

  √ gifsicle pre-build test passed successfully

> mozjpeg@5.0.0 postinstall C:\AppServ\www\project\calibreBook\node_modules\mozjpeg
> node lib/install.js

  √ mozjpeg pre-build test passed successfully

> optipng-bin@3.1.4 postinstall C:\AppServ\www\project\calibreBook\node_modules\optipng-bin
> node lib/install.js

  √ optipng pre-build test passed successfully

> pngquant-bin@4.0.0 postinstall C:\AppServ\www\project\calibreBook\node_modules\pngquant-bin
> node lib/install.js

  √ pngquant pre-build test passed successfully
npm notice created a lockfile as package-lock.json. You should commit this file.
npm WARN ajv-keywords@3.4.0 requires a peer of ajv@^6.9.1 but none is installed. You must install peer dependencies yourself.
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@1.2.8 (node_modules\fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@1.2.8: wanted {"os":"darwin","arch":"any"} (current: {"os":"win32","arch":"x64"})

added 1598 packages from 753 contributors and audited 21494 packages in 93.949s
found 34 vulnerabilities (18 low, 11 moderate, 5 high)
  run `npm audit fix` to fix them, or `npm audit` for details

那麼bootstrap到底掛上了沒呢?我看到了bootstrap-sass和jquery,後面還要再試試看才知道。

<link rel="stylesheet" href="/css/app.css">

我開了測試檔案,把上方的這個掛上去就可以看到bootstrap的style了,這個應該是公用的css。

<script src="/js/app.js"></script>

上方的這個應該是公用的js,目前應該包括bootstrap和jquery的js。

到此bootstrap和jquery應該已經掛上了。

2019年4月28日 星期日

laravel web路徑更改+sql連線

安裝了laravel之後,cmd 進入laravel資料夾,執行php artisan serve,就可以看到執行網址<http://127.0.0.1:8000>,在瀏覽器執行這個網址就可以看到laravel在web.php中設定的首頁。

接著就要更改資料庫連線了。

在laravel資料夾下有個.evn檔案,更改檔案中mysql連線,在此之前不要忘記先去資料庫建一個新的DB。

DB_CONNECTION=mysql
DB_HOST=127.0.0.1
DB_PORT=3306
DB_DATABASE=資料庫名稱
DB_USERNAME=資料庫帳號
DB_PASSWORD=資料庫密碼

接下來要繼續建立資料表了,記得使用php artisan指令。
php artisan make:model {資料表名稱} --migration
或者php artisan make:model {資料表名稱} -m
參考網址:https://ithelp.ithome.com.tw/articles/10202964

這樣會在兩個地方產生檔案,一是app中產生一個model檔;一是database\migrations中產生一個migrate檔案。

在migrate檔案中function up{},填寫增加的欄位,欄位的屬性設定請參考下方網址。

參考網址:https://laravel.tw/docs/5.2/migrations#creating-tables

完畢之後在cmd中繼續執行php artisan migrate就會自動生成資料表與欄位了。

這時錯誤訊息告知:
In Connector.php line 67:

  could not find driver

查詢資料後修改php.ini,extension=php_pdo_mysql.dll。

cmd中成功顯示如下方:
C:\AppServ\www\project\calibreBook
λ php artisan migrate
Migration table created successfully.
Migrating: 2019_04_28_061541_create_admins_table
Migrated:  2019_04_28_061541_create_admins_table

假設要給預設的假資料,可以使用seed。
在cmd下執行php artisan make:seed Admin
cmd中成功顯示如下方:
C:\AppServ\www\project\calibreBook
λ php artisan make:seed AdminSeeder
Seeder created successfully.

首先是在cmd下執行php artisan make:seed,在database\seeds\下會產生一個seed檔案。
把要產生的假資料寫在public function run()中,並在DatabaseSeeder.php中加上$this->call(AdminSeeder::class)。

這樣資料庫連線、model、seed就全部完成了。




win10+mysql workbench安裝

上次我沒有安裝mysql admin,不過想想還是需要mysql的工具,查了一下決定用Workbench這套軟體。

首先先下載Workbench:
https://dev.mysql.com/downloads/file/?id=485462

mysql-workbench-community-8.0.16-winx64.msi這是下載下來的檔案。

不過安裝的時候,要求有visual C++ 2015,所以繼續下載visual C++ 2015。

https://www.microsoft.com/zh-tw/download/confirmation.aspx?id=48145

先安裝visual C++ 2015在繼續安裝Workbench就成功了,接著連線本地local的連線就ok了。


2019年4月15日 星期一

win10+php7的laravel安裝

composer安裝好了之後,接著終於到了重頭戲,Framework Laravel的掛載了。

查了許多的網頁,目前得到的結論,composer會把laravel需要的環境建置好,所以只要你的php+apache有裝好,接下來只要把laravel設在對外的資料夾就可以了。舉例:我的電腦目前掛的是AppServ那麼對外的資料夾就是www,所以只要把laravel掛在這個資料夾下就可以了。

那麼該怎麼做呢?

以我的電腦的路徑應該是C:/AppServ/www/project,我在www資料夾下加了project資料夾,想把laravel的相關專案放在這裡,所以我只要進cmd輸入下面的命令就可以了。

進入專案資料夾
cd C:/AppServ/www/project

建立一個laravel專案
composer create-project laravel/laravel --prefer-dist "專案名稱"

基本上這樣就OK了,不過這樣處理後,要叫這個專案首頁的網址看起來很糟糕,後面會繼續處理,目前先把網址貼出來。

專案實際位置
C:/AppServ/www/project/calibreBook

首頁網址
http://localhost/project/calibreBook/public/index.php

如果打這個網址,會出現calibreBook的檔案總管
http://localhost/project/calibreBook/

如果打這個網址則會出現not found
http://localhost/project/calibreBook/index.php

目前還不確定是要處理laravel內設的路由還是要處理本機的域名,之後將繼續處理。

最後備註一下,安裝的時候出現了warry!!不確定會不會有狀況,先記錄下來。

phpunit/phpunit suggests installing phpunit/php-invoker (^1.1)
Package phpunit/phpunit-mock-objects is abandoned, you should avoid using it. No replacement was suggested.




2019年4月14日 星期日

win10+PHP7安裝composer

正式安裝laravel之前,幾乎所有參考資料都要求先安裝composer。

那麼composer到底是什麼呢?

就我自己看完各式各樣的說明和文件後,我是這麼理解的,開發專案的時候,PHP經常性要加掛許多套件,比方laravel這種framework,為了維持開發環境與線上環境的一致性,下載各種套件的時候,不再各自找資源,而是統一利用composer下指令或是設定檔。

在本機開發時跑得好好的程式,上傳到測試環境或是正式環境之後就掛了,然後大家就很命苦的開始查詢各種設定檔,伺服器開放的權限等等各種各樣的問題,我想這樣的經驗應該或多或少都有吧!

composer應該就是為了統一套件版本及來源所使用的方法之一。

在window上加掛composer似乎很簡單,只要下載執行檔後,照著下一步設定就OK了。

下載網址:https://getcomposer.org/Composer-Setup.exe

如果說有什麼狀況的話,因為我的傻瓜安裝程式有兩個PHP版本,所以安裝composer的時候我特意選了PHP7這個版本(預設是PHP5版本)。

最後進入cmd輸入composer --version,如果可以看到版本就代表安裝成功了。

win10+php7掛載xDebug

再加掛Framework和composer之前,先把單步除錯的xDebug掛起來。雖然聽說Framework有類似的除錯工具,不過畢竟是用習慣的比較方便。

所以接下來就是先把xDebug掛載到PHP和NetBean可以使用。

一、下載xDebug

下載網址:https://xdebug.org/download.php

這裡要注意的地方就是xDebug的版本和PHP版本一定要相同,像我一樣掛傻瓜版或不記得PHP版本該怎麼辦呢?最簡單的方法,在首頁加上一行PHP函式phpinfo()。接著進入頁面就可以看到PHP版本還有Compiler。照著這兩個顯示的版本下載xDebug應該就可以了。

這裡還有一個參考資料提供,如果是像我一樣使用Apache的話就下TS版本,使用IIS的話下NTS版本。

如果和我一樣搞不定的話到下列網址把phpinfo()的網頁資訊全部貼上,就可以分析出應該下載哪個檔案了。

https://xdebug.org/wizard.php

二、將檔案掛到PHP

xDebug下載下來應該是一個.dll檔案,把檔案貼到PHP資料夾下的ext資料夾內。

接下來去修改php.ini檔案。

開啟檔案後先查詢有沒有xDebug的設定,沒有的話把下面的設定貼到最下方即可。

;xdebug
zend_extension="php_xdebug-2.7.1-7.1-vc14.dll"
xdebug.remote_enable=on
xdebug.remote_host=127.0.0.1 
xdebug.remote_handler=dbgp
xdebug.remote_port=9000

zend_extension_ts:如果 PHP 安裝 TS 版本,則使用這個。

接著重啟Apache看看Xdebug是否正確加掛。

就我最後的經驗,直接把phpinfo()的資訊貼上去查,下載後貼到php\ext底下,修改php.ini檔案,如果沒有過就把zend_extension="php_xdebug-2.7.1-7.1-vc14.dll"改成zend_extension_ts="php_xdebug-2.7.1-7.1-vc14.dll"重開Apache再看一次。

另外為了防止外取定住畫面,最好使用無痕網頁看。Chome有這個功能。

三、掛載到NetBean

基本上我新增了一個專案試跑就直接成功了,不過提供一下我所查到的資料。

工具\選項\PHP\debugging,在這裡有和debug相關的設定。



2019年3月27日 星期三

win10的NetBean8.2版安裝

選擇開發工具的時候,phpstorm因為付費問題放棄後,就選了最熟悉的NetBean了,目前好像出到版本10,不過看到沒有安裝檔,加上之前一堆設定的問題,我就選了8,2版本了。

下載之後,安裝一定會出錯,因為這台電腦沒有java,所以要先安裝java。

查詢之後發現要安裝java SE,下載網址:https://www.oracle.com/technetwork/java/javase/overview/index.html。

最剛開始我先下了Java SE 12,不過安裝後NetBean依舊無法安裝,所以我想是版本問題,我又刪除後重新下載Java SE 8u201 / Java SE 8u202當中的IDK版本,安裝後這次NetBean就順利開始安裝了。

win10的AppServ 8.6.0安裝

基本上懶人包的安裝沒甚麼要說的,網路上也有一堆文章可以參考,基本上只要照著安裝都不會出問題。

不過我還是提醒兩個狀況。

一、phpmyadmin,不只一次聽說會被攻擊,雖然我的server只是測試和寫些小程式,並不打算對外,但是這次安裝的時候,我把這個選項取消了,雖然它很方便,不過我想有很多替代軟體,這次暫時不打算使用它。

二、下載時我就發現有兩個php版本,還覺得怪怪的,安裝後跑了phpinfo之後,發現版本居然是php5,google後才發現原來安裝後多了個php version switch可以選擇php版本,當然是切換到php7。

接著和公司環境不同的是開發工具phpstorm,MVC架構laravel吧!

可是phpstorm要付費,我應該會換成其他的免費軟體。然後就是composer和laravel吧!

沒有必要,我想懶人包還是個不錯的選擇,半小時灌完還三天灌不完,我暫時還是當懶人好了...

win10解安裝php+apache

前兩天一直在掛mysql,不過到最後還是沒有成功,實際上我找不出來問題在哪裡,該爬文也都看了,反覆重掛mysql多達五次之後,暫時放棄決定採用php+apache+mysql的懶人包來處理。

不過在此之前,要先把失敗的mysql以及之前的php+apache先unset掉。

一、先處理mysql

利用系統管理員身分使用power shell,進入mysql/bin的資料夾底下。
mysql remove
看到服務中的mysql消失之後,再把mysql的資料夾刪除,然後到環境變數把原先設定的路徑給刪除掉。

二、再處理apache

用系統管理員身分使用cmd,進入Apach24資料夾(apache根目錄)。
執行httpd -k uninstall
但是window中的服務還能看到apache項目
執行sc delete apache

刪除資料夾時失敗,說有其他地方開啟這個資料夾,重開機再刪除就OK了。
然後到環境變數把原先設定的路徑給刪除掉。

三、最後處理php

刪除php資料夾然後到環境變數把原先設定的路徑給刪除掉。

到此應該有正確的把之前加掛的php+apache+mysql都uninstall,下面就要開始使用懶人包安裝了。

2019年3月24日 星期日

win10下PHP的安裝與設定

接下來就是安裝PHP了,首先先到PHP官網下載檔案。

一、下載PHP

PHP官網:http://php.net/downloads.php

進入之後發現目前7.3.3版本是最新的,首先點選Windows Doadload,進入下圖的頁面。

















我選擇了下載這個版本的ZIP檔,VC15應該是對應Apache的版本吧!

解壓縮之後,更名為php,然後整個資料夾移到C槽下。路徑:C:\php

二、增加環境變數(和之前Apache的步驟一樣)

參考資料:http://myxxqy.com/2017/07/13/windows10%E4%B8%8BPHP%E5%AE%89%E8%A3%85%E5%8F%8A%E9%85%8D%E7%BD%AE/

搜尋控制台->系統及安全性->系統->進階系統設定->環境變數->PATH->編輯

因為步驟一樣,只是環境變數的路徑新增一個C:\php,我就懶得抓圖了,可以參考上一篇的Apache設定。

不過根據參考資料,把環境變數的路徑設好後,進入cmd下php -v的指令,就可以看到目前php的版本,我試過已經成功了,大家有興趣可以測試看看。

三、修改設定檔

修改php.ini檔,首先進入php資料夾中,會發現並沒有php.ini檔案,不過有php.ini-development、php.ini-production兩個檔案,php.ini-development用作測試環境,所以我也用這個copy一個php.ini檔案。

開啟這個檔案之後首先修改extension_dir = "C:/php/ext";

接下來考慮還要使用laravel框架,依照參考資料開啟部分元件。
























參考上圖,我下載的這個版本和參考資料的有些不同。

再來修改檔案上傳的暫存位置,在php資料夾中新增一個temp資料夾。

upload_tmp_dir = "C:\php\temp"

最後為了能正常使用curl功能,依照參考資料使用Mozilla所提供的憑證檔案。

下載網頁:https://curl.haxx.se/docs/caextract.html





















把檔案丟到php資料夾中,修改curl.cainfo = C:/php/cacert.pem。



接著修改Apache的設定檔

C:\Apache24\conf\httpd.conf

增加index.php讓Apache首頁可以識別php檔

<IfModule dir_module>
    DirectoryIndex index.php index.html
</IfModule>

接著在最尾部加上php模組:

#LoadModule xml2enc_module module modules/mod_xm12enc.so
LoadModule php7_module "C:/php/php7apache2_4.dll"
<IfModule php7_module>
PHPIniDir "C:/php"
AddType application/x-httpd-php php
</IfModule>

所有的設定都存檔後,記得重啟Apache伺服器,我是從"服務"中點選的,該怎麼使用命令重啟Apache,大致是cmd進入apache資料夾後,httpd -k restart

最後在C:\Apache24\htdocs中,加上phpinfo.php的測試檔,開啟phpinfo.php檔案後,打上<?php phpinfo()?>,然後看看http://localhost/phpinfo.php網址是否會出現PHP相關資訊就能知道php是否正確安裝了。



win10下Apache安裝及設定

首先開始的是http伺服器,基本上我習慣採用Apache,有沒有其他選擇我是不清楚的,就目前的經驗來說,撰寫PHP程式多半都使用這個。

因為我決定全部都安裝最新版本(希望別出問題),所以不使用懶人包,先進到Apache的下載頁面:https://www.apachelounge.com/download/。

一、下載Apache





















目前我看到這個頁面的最新下載版本httpd-2.4.38-win64-VC15.zip,所以我決定就用這個了,
檔案大小16.8mb。下載之後解壓縮,然後裡面的Apache24資料夾轉移到C槽之下,最後Apache資料夾路徑應為C:\Apache24。







參考我設定的Apache資料夾位置

二、增加系統路徑

參考資料:http://myxxqy.com/2017/07/12/windows10%E4%B8%8BApache%E5%AE%89%E8%A3%85%E5%8F%8A%E9%85%8D%E7%BD%AE/

搜尋控制台->系統及安全性->系統->進階系統設定->環境變數->PATH->編輯
































參考如何設定新的路徑

三、修改Apache設定


打開C:\Apache24\conf\httpd.conf,然後開始修改Apache的設定。

這個版本在37行已經用常數宣告了Apache資料夾的位置,如果有必要應該先修改這一行。













接下來拿掉266行ServerName前的#字號,把名稱換成127.0.0.1












後面的三張圖片是我的參考網頁說要修改,但這個版本因為宣告了SRVROOT這個常數,所以不需要修改的部分。將參考網頁以及原文標註在下方,並配上此版本的抓圖(下面三個流程我是沒有修改的)。

參考資料:https://www.itread01.com/content/1507815490.html

DocumentRoot (修改網站根目錄地址)自己設置
<Directory "網站根目錄地址"> 與上一步地址相同










ScriptAlias 改為 /cgi-bin/ "apache目錄+/cgi-bin/"









<Directory "apache目錄+/cgi-bin/">(與上面那個Directory 不同)















到此Apache的設定部分就修改完畢,接著就要進行安裝以及測試Apache是否正常執行了(開始緊張了)。

四、安裝Apache

在搜尋中輸入cmd,對著命令提示字元按右鍵,接著用系統管理員身分開啟。

參考資料:https://www.itread01.com/content/1507815490.html

安裝命令:"C:\Apache24\bin\httpd.exe" -k install -n apache

卸載命令:"C:\Apache24\bin\httpd.exe" -k uninstall -n apache

(每改一次.conf文件,都要卸載後重新安裝)

目前安裝的情況,首先進入Apache24\bin這個資料夾,執行httpd.exe" -k install -n apache的時候出現錯誤,接著根據說明執行.\httpd.exe" -k install -n apache


然後開始安裝之後就跳出防火牆的設定


















接下來進入http://127.0.0.1/index.html看看Apache是否正常,不過雖然安裝完畢,但我的Apache依舊沒有起來,"127.0.0.1 拒絕連線。"瀏覽器出現這樣的錯誤訊息。

然後我參考了另一個網站,原先我的執行順序是一、三、四,參考另一個網站之後補上的第二個動作,又重新安裝了一次,動作如下:

參考資料:http://myxxqy.com/2017/07/12/windows10%E4%B8%8BApache%E5%AE%89%E8%A3%85%E5%8F%8A%E9%85%8D%E7%BD%AE/

在搜尋中輸入cmd,對著命令提示字元按右鍵,接著用系統管理員身分開啟。

進入Apache24\bin資料夾後,執行httpd -k install










接著在搜尋中輸入"服務",在本機服務中找到Apache後按下啟動。

我的Apache伺服器就正常運作了,參考頁面提供了其他方式由命令列執行,大家可以試看看。

結論:依照上述方式執行應該是可行的,第一次失敗應該是伺服器沒有按下啟動,所以才拒絕連線。










新電腦設定開始

今天剛剛拿到新的電腦,打算把這台電腦對PHP的相關設定以及日後的一些小程式碼公開,待會開始就要痛苦從php+mysql+apache全部不使用懶人包設定。

此外,還有開發工具、XDeBug、單元測試、MVC架構(laravel),全部都要在這台電腦設定好,我對於這類的安裝、設定實在不太行,今晚開始禱告吧!祈求真的能自立自強把這些設定全部完成。

雖然我希望這台電腦上的設定能盡可能和工作環境相同,不過仔細想想,其實也不完全有這樣的必要,畢竟這台電腦主要是讓我練習使用,外加coding一些自己想要的功能,只要大致相同也就沒有問題。

那麼現在就從Apache開始,對這台電腦進行安裝及設定的作業,詳細的過程應該會寫在後面的日誌當中。但願一切能順利。

前面忘了提一下筆電本身,硬體本身就不說了,OS是走windows10,之前用的只到windows7,後面開始做設定時應該會遇到各種狀況,畢竟win7和win10的UI介面應該差異很大吧!加油吧!