まずは公式ページでフォントを選ぶ 公式サイト：Google Fonts フォントが決まったら[+ select this style]を押下 「Use on the web」という箇所があるので、そこでimportを選択。 importが選択できたら下記コードをコピー <style> @import url('https://fonts.googleapis.com/css2?family=(選択されたフォント)&display=swap'); </style> font-family: (選択されたフォント)； styleタグ内にペースト これをコピーしてstyleタグ内に貼り付けます。 scss <style scoped lang="scss"> @import url("https://fonts.googleapis.com/css2?family=(選択されたフォント)&display=swap"); .ttl { font-family: (選択されたフォント)； </style> たったこれだけでGoogle Fontsが使えるようになりました。

執筆動機 Twitterにて個人的にフォローさせていただいているゆーたろーさん（@shimotaroo）の記事を拝見しました。 当記事ではPosgreを使用したものになっていましたが、MySQLの場合ばどうすればいいか知りたくなり、本記事を作成しました。 ゆーたろーさんの記事は初心者でも直感的にわかりやすくなっています。ぜひそちらも参考にデプロイを検討してみてください:) 前提 ・Laravelアプリが作成済み ・Herokuアカウント取得済み ・Heroku CLI導入済み ・DBはMySQLを利用 $ composer -V Composer version 2.0.11 2021-02-24 14:57:23 $ php artisan --version Laravel Framework 8.36.2 $ npm -v 7.8.0 Herokuアプリの作成 ①Herokuのログイン $ heroku login まず初めに、Herokuにログインします。 作成したアプリケーションのディレクトリに移動し、以下のコマンドを打ちます。 ②アプリの作成 $ heroku apps:create [アプリ名] 適当にアプリ名を決めてアプリを作成します。 この時、ユニークな名前でなくてはいけません。 エラーが出る場合は、Heroku上に存在しない名前をつけて再度コマンドを叩いてください。 ③MySQL(ClearDB)の追加 $ heroku addons:create cleardb:ignite その後、Heroku上で使えるMySQL（ClearDB）を追加します。 Cleardbのignite版は、無料で使用する事が可能です。 ただし、クレカを登録する必要があるので、ブラウザ上のHerokuからAccountSettings -> Billingでクレカを登録してください 。 ④Buildpackの追加 $ heroku buildpacks:add heroku/php $ heroku buildpacks:add heroku/nodejs 順番はどっちでも良いです。 DBの環境設定 .envファイルはアップされないので、手動でHerokuに環境変数を登録する必要があります。 ①ClearDBの情報を確認する $ heroku config:get CLEARDB_DATABASE_URL mysql://[ユーザー名]:[パスワード]@[ホスト名]/[データベース名]?reconnect=true ②Herokuに環境変数を登録 ①を参考に、環境変数を登録していきます。 $ heroku config:set DB_DATABASE=[データベース名] $ heroku config:set DB_HOST=[ホスト名] $ heroku config:set DB_USERNAME=[ユーザー名] $ heroku config:set DB_PASSWORD=[パスワード] $ heroku config:set APP_KEY=$(php artisan key:generate --show) 一番下はそのままコピペでうまくいきます。 最低限これだけ登録できれば、動きます。 ファイルの変更、追加 ①Procfileの追加 ルートディレクトリにProcfileを追加します。 ./Procfile web: vendor/bin/heroku-php-apache2 public/ 上記を記入して終わりです。 ②本番環境でのHTTPS化 AppServiceProvider.app public function boot() { if (\App::environment('production')) { \URL::forceScheme('https'); } } 本番環境でのhttpsを強制します。 AppServiceProvider.appに追加してください。 ③DBの文字数設定 Herokuではvarchar型の文字数はデフォルトの255では大きすぎるため191に設定します。 AppServiceProvider.app use Illuminate\Support\Facades\Schema; public function boot() { Schema::defaultStringLength(191); } 同じくAppServiceProvider.appのbootに追加してください。 また、useで名前空間をインポートします。 デプロイ ①ローカルリポジトリにHerokuアプリ用のリモートリポジトリを登録 git管理をしていなかった場合 $ git init $ heroku git:remote -a {アプリ名} git管理をすでにしている場合 $ heroku git:remote -a {アプリ名} アプリ名は自分で名付けたものを使用してください。 ②デプロイする $ git checkout -b 'main' $ git add . $ git commit -m 'first commit' $ git push heroku main ③マイグレーションやシーディングの実行 $ heroku run php artisan migrate --seed シーディングを用意していない場合は、--seedを除いてコマンドを叩いてください 。 このように表示されるのでyesと入力してください。 アプリを開いてみる $ heroku open エラーなく表示されたら成功です！！ お疲れ様です^^ アドバイス もし上記のようにデプロイしてもうまく表示されない場合は、 herokuのログを確認したり、Laravelのデバックモードをオンにしてみたらいいかも ログの確認 $ heroku logs -t ターミナルからログを確認できます。 詳細なエラーを確認するには、Herokuの環境変数にLOG_CHANNEL=errorlogを設定します。 デバックモード app.php /* |-------------------------------------------------------------------------- | Application Debug Mode |-------------------------------------------------------------------------- | | When your application is in debug mode, detailed error messages with | stack traces will be shown on every error that occurs within your | application. If disabled, a simple generic error page is shown. | */ 'debug' => env('APP_DEBUG', true), 変更したのちにデプロイの手順を取り、エラーを確認できます。 うまく動いたら、デバックモードをfalseにしておきましょう。 参考にさせていただいた記事、ドキュメント

執筆動機 Twitterにて個人的にフォローさせていただいているゆーたろーさん（@shimotaroo）の記事を拝見しました。 当記事ではPosgreを使用したものになっていましたが、MySQLの場合ばどうすればいいか知りたくなり、本記事を作成しました。 ゆーたろーさんの記事は初心者でも直感的にわかりやすくなっています。ぜひそちらも参考にデプロイを検討してみてください:) 前提 ・Laravelアプリが作成済み ・Herokuアカウント取得済み ・Heroku CLI導入済み ・DBはMySQLを利用 $ composer -V Composer version 2.0.11 2021-02-24 14:57:23 $ php artisan --version Laravel Framework 8.36.2 $ npm -v 7.8.0 Herokuアプリの作成 ①Herokuのログイン $ heroku login まず初めに、Herokuにログインします。 作成したアプリケーションのディレクトリに移動し、以下のコマンドを打ちます。 ②アプリの作成 $ heroku apps:create [アプリ名] 適当にアプリ名を決めてアプリを作成します。 この時、ユニークな名前でなくてはいけません。 エラーが出る場合は、Heroku上に存在しない名前をつけて再度コマンドを叩いてください。 ③MySQL(ClearDB)の追加 $ heroku addons:create cleardb:ignite その後、Heroku上で使えるMySQL（ClearDB）を追加します。 Cleardbのignite版は、無料で使用する事が可能です。 ただし、クレカを登録する必要があるので、ブラウザ上のHerokuからAccountSettings -> Billingでクレカを登録してください 。 ④Buildpackの追加 $ heroku buildpacks:add heroku/php $ heroku buildpacks:add heroku/nodejs 順番はどっちでも良いです。 DBの環境設定 .envファイルはアップされないので、手動でHerokuに環境変数を登録する必要があります。 ①ClearDBの情報を確認する $ heroku config:get CLEARDB_DATABASE_URL mysql://[ユーザー名]:[パスワード]@[ホスト名]/[データベース名]?reconnect=true ②Herokuに環境変数を登録 ①を参考に、環境変数を登録していきます。 $ heroku config:set DB_DATABASE=[データベース名] $ heroku config:set DB_HOST=[ホスト名] $ heroku config:set DB_USERNAME=[ユーザー名] $ heroku config:set DB_PASSWORD=[パスワード] $ heroku config:set APP_KEY=$(php artisan key:generate --show) 一番下はそのままコピペでうまくいきます。 最低限これだけ登録できれば、動きます。 ファイルの変更、追加 ①Procfileの追加 ルートディレクトリにProcfileを追加します。 ./Procfile web: vendor/bin/heroku-php-apache2 public/ 上記を記入して終わりです。 ②本番環境でのHTTPS化 AppServiceProvider.app public function boot() { if (\App::environment('production')) { \URL::forceScheme('https'); } } 本番環境でのhttpsを強制します。 AppServiceProvider.appに追加してください。 ③DBの文字数設定 Herokuではvarchar型の文字数はデフォルトの255では大きすぎるため191に設定します。 AppServiceProvider.app use Illuminate\Support\Facades\Schema; public function boot() { Schema::defaultStringLength(191); } 同じくAppServiceProvider.appのbootに追加してください。 また、useで名前空間をインポートします。 デプロイ ①ローカルリポジトリにHerokuアプリ用のリモートリポジトリを登録 git管理をしていなかった場合 $ git init $ heroku git:remote -a {アプリ名} git管理をすでにしている場合 $ heroku git:remote -a {アプリ名} アプリ名は自分で名付けたものを使用してください。 ②デプロイする $ git checkout -b 'main' $ git add . $ git commit -m 'first commit' $ git push heroku main ③マイグレーションやシーディングの実行 $ heroku run php artisan migrate --seed シーディングを用意していない場合は、--seedを除いてコマンドを叩いてください 。 このように表示されるのでyesと入力してください。 アプリを開いてみる $ heroku open エラーなく表示されたら成功です！！ お疲れ様です^^ アドバイス もし上記のようにデプロイしてもうまく表示されない場合は、 herokuのログを確認したり、Laravelのデバックモードをオンにしてみたらいいかも ログの確認 $ heroku logs -t ターミナルからログを確認できます。 詳細なエラーを確認するには、Herokuの環境変数にLOG_CHANNEL=errorlogを設定します。 デバックモード app.php /* |-------------------------------------------------------------------------- | Application Debug Mode |-------------------------------------------------------------------------- | | When your application is in debug mode, detailed error messages with | stack traces will be shown on every error that occurs within your | application. If disabled, a simple generic error page is shown. | */ 'debug' => env('APP_DEBUG', true), 変更したのちにデプロイの手順を取り、エラーを確認できます。 うまく動いたら、デバックモードをfalseにしておきましょう。 参考にさせていただいた記事、ドキュメント

概要 2021年3月末からLaravelを触ってみた、ほんとに初心者です。 LaravelはおろかPHPすら、なんかみたことあるなぁくらい。 簡単なwebサイトをちょろっと作れるくらいになりたいなぁと。 作業に当たってプロジェクトをする作れるように手順をメモしてます。 （結構、プロジェクトの根底からの実装を修正したいことが、あるはず・・・なので） 絶賛、実装含めて触っているところなので、しばらくは更新するかもしれない。 自分用のメモをまとめていたのですが、 もっとこうしたほうがいいよとか、こんなの便利だよとかあったら教えてもらいたい というのもあり＋ちゃんと整理したかったので公開してみます。 【環境】 PHP 8.0.0 Laravel Framework 8.36.2 windows 10 node v14.16.0 では、ここから手順です。 インストールは割愛します。 1.プロジェクト作成 cmd cd C:\Users\ADMIN\source\repos composer create-project laravel/laravel --prefer-dist TEST 2.composerにてインストール（任意） データベースからLaravelのSeederを逆生成したい場合 cmd cd TEST composer require --dev "orangehill/iseed" 3.app/Providers/RouteServiceProvider.phpを修正 設定系　（Laravel8から変わってるらしい。） ※実際は、ファイルコピーしてます。 before // protected $namespace = 'App\\Http\\Controllers'; after protected $namespace = 'App\\Http\\Controllers'; 4.config/app.phpを修正 設定系 ※実際は、ファイルコピーしてます。 before 'timezone' => 'UTC', 'locale' => 'en', 'faker_locale' => 'en_US', after 'timezone' => 'Asia/Tokyo', 'locale' => 'ja', 'faker_locale' => 'ja_JP', 'providers' => [ ・・・ Orangehill\Iseed\IseedServiceProvider::class, //追加 5.一回動作確認 cmd php -S localhost:8000 -t public http://localhost:8000/ へアクセス。 ～ここからは自分の実装用～ 6.model作成 aオプションで全部作る a = all : model・factroy・seeder・controller(resorce) cmd php artisan make:model Employee -a 各モデルに、ソフトデリート（論理削除）使用に変更 Employee.php <?php namespace App\Models; use Illuminate\Database\Eloquent\Factories\HasFactory; use Illuminate\Database\Eloquent\Model; use Illuminate\Database\Eloquent\SoftDeletes; //追加 class Employee extends Model { use HasFactory; use SoftDeletes; //追加 } 7.migrateファイル修正 ご自由に。 ※自分メモ C:\Users\ADMIN\source\repos\TEST\database\migrations　の整理 C:\Users\ADMIN\source\projecct作成時model作成後\database\migrations をコピー DB migrations　を整理 8.マイグレーション実行 cmd php artisan migrate:refresh --seed 参考 //migrateのみ php artisan migrate:refresh //seedのみ php artisan db:seed 9.サーバ起動 cmd php -S localhost:8000 -t public http://localhost:8000/ へアクセス。 その他　メモ 現在のテーブルからseedファイル作成（DatabaseSeeder.phpにも更新） php artisan iseed tableName 画面作成時手順 ①DB設定 ②コントローラ作成（メソッド作成） 　php artisan make:controller controllerName ③view編集（画面作成） ④ルーティング設定 -- バージョン確認 php artisan --version