# Heroku 雲端架站
###### tags: `heroku` `雲端架站`

<style>
.r{
background-color: pink;
}
.s{
background-color: skyblue;
}
</style>

## 01 註冊帳號
連結👇
https://www.heroku.com/home

😀註冊頁面的language隨便選 都沒差😀
📫註冊完記得去收信📫

## 02 登入並建立專案

||說明||
|-|-|-|
||點選右側下拉:控制面板(dashboard)||
||創立app專案(左側)||
||輸入名稱,選擇美國||
||||

## 03 VSCODE前置作業

### I. 讓本地端網頁可與HEROKU連結

~~請回到VSCODE 輸入指令，產生檔案 Procfile於根目錄~~
:::info
~~echo web: vendor/bin/heroku-php-apache2 public/ > Procfile~~
:::

⚠ <font color="#f00"> 建議自己手打 </font>
* 自行建立檔案 Procfile於根目錄
* 檔案內輸入👇

web: vendor/bin/heroku-php-apache2 public/


### II. 讓本地端網頁檔案(asset)可與HEROKU連結
>使asseet從http變成https

到app\Providers\AppServiceProvider.php中
修改 public function boot，並引入
use Illuminate\Support\Facades\URL;
檔案內輸入👇

<?php

namespace App\Providers;

use Illuminate\Support\Facades\URL;
use Illuminate\Support\ServiceProvider;

class AppServiceProvider extends ServiceProvider
{
    /**
     * Register any application services.
     *
     * @return void
     */
    public function register()
    {
        //
    }

    /**
     * Bootstrap any application services.
     *
     * @return void
     */
    public function boot()
    {
        //讓HEROKU可以顯示內部連結資料使asseet從http變成https
        if (env('HTTPS_CHECK')){
            URL::forceScheme('https');
        }
    }
}

### III. 準備連結env

複製上述的HTTPS_CHECK，並將檔案env打開，以利後續連結

## 04 將env 鍵值輸入

到setting將config輸入

1. 剛剛的HTTPS_CHECK

|NAME|VALUE|
|-|-|
|HTTPS_CHECK|true|

2. 以及VSCODE中env檔案中的所有鍵值

## 05 連結github
|I.到部署(deploy)面板|
|-|
||

|II.下拉選到連結帳號處|III.確認連結帳號|
|-|-|
|||

## 06 選擇分支並部屬

### 1. 分為自動Automatic deploys與手動Manual deploy


:::warning
### ⚠使用KRLOVE套件恐造成錯誤<br><br>"ERROR: Dependency installation failed"
:::

<details>
<summary><font color="#055">☘解決方法請點我</font></summary>

>因HEROKU(亥若哭)在部屬時會無法找到require-dev中的Krlove
錯誤訊息如下👇(ERROR: Dependency installation failed!)

 In ProviderRepository.php line 208:
Class 'Krlove\EloquentModelGenerator\Provider\
GeneratorServiceProvider' not found 

1. 請回到VSCODE 輸入指令

cp composer.lock composer.lock-prev

2. 到composer.json檔案

|將|"krlove/eloquent-model-generator": "^1.3"|
|:-:|-|
|從|"require-dev": { <a class="r">這裡</a> }|
|搬||
|到|"require": { <a class="s">這裡</a> }|
<br>

更改完如下👇

 "require": {
        "php": "^7.2.5",
        "biscolab/laravel-recaptcha": "^5.0",
        "darryldecode/cart": "^4.2",
        "doctrine/dbal": "2.10",
        "fideloper/proxy": "^4.2",
        "fruitcake/laravel-cors": "^1.0",
        "guzzlehttp/guzzle": "^6.3",
        "laravel/framework": "^7.0",
        "laravel/tinker": "^2.0",
        "laravel/ui": "2.4",
        "tsaiyihua/laravel-ecpay": "^2.4",
        "krlove/eloquent-model-generator": "^1.3"
    },
    "require-dev": {
        "facade/ignition": "^2.0",
        "fzaninotto/faker": "^1.9.1",
        "mockery/mockery": "^1.3.1",
        "nunomaduro/collision": "^4.1",
        "phpunit/phpunit": "^8.5"
    },

3. 請繼續回到VSCODE 輸入指令

composer install

composer update

並重新回到HEROKU部屬一次

</details>

<br>

### 2. 以下是執行結果
可在HEROKU 的 Overview檢視

### 3. 點Open app來開啟專案網頁



:::warning
目前還沒放後端資料
:::