20211129のlaravelに関する記事は10件です。

Laravelでポケモン図鑑をつくってAWSでデプロイまでしてみた

株式会社やどかりのカイノと申します。 アドベントカレンダーを作ってみんなに書いてください〜って言ってやってもらってる張本人です。 今年もう少しで終わりだー今年もクソお世話になりましたー! やどかり&ネッコス Advent Calendar 2021の1日目を担当させていただきます。 明日は圭ちゃんです はじめに 2020年8月に入社して2021年6月までWeb開発をやってました。 2021年の7月からAndroid開発とWeb開発の2足のワラジでやってます。 今年はエンジニアとしてだけでなくマネジメント系の仕事もかなり増えててそっちもめちゃくちゃ面白いのですがやっぱりコード書いている時間は楽しいなとこの開発をしている時に改めて思いました。 去年も似たような記事を書いたのですが以前よりはレベルアップしているなー 、というか分かったこと増えたなーと感じました。 とはいえまだまだわからないところは多いので精進していきます。 ということで学んだことの棚卸しもしながら作りました 使用言語 Laravel 6.20 php 7.4 ポケモン図鑑つくりました(PC推奨) 作ったことなかったので一度作りたかったんですよね。 仕事の合間に結構急ぎで作ったので色々と雑になってます。ドメインもまだ設定してないです。 csv配布 ポケモン各種情報が入ったDBです。 これ使ってぜひみなさんもポケモンの何かアプリ作ってみてください。 クリックしたらダウンロードできます サイトはこんな感じです 一覧画面 レイアウトはテキトーです。 詳細画面 フシギダネは最初に仲間にしたポケモンなのでめちゃめちゃ覚えてるし好きですね。 種族値も取れることを知ったので徹底攻略みたいに表示してみました。 やったこと Laravelでコマンド作成 ポケモンAPIを叩く 取得したAPIを各パラメータに入れる DB設計&作成 ポケモンごとにDBにインサート 画面に表示 種族値も表示してみた AWSでサーバ構築してデプロイ Laravelでコマンド作成 app/Console/Commands/GetPokemonInfo.php このpathに下記のようにコマンド作成 今回はphp artisan command:getpokemoninfoで実行できるようにしました。 <?php namespace App\Console\Commands; require "vendor/autoload.php"; use Illuminate\Console\Command; use App\Models\Pokemon; use GoogleTranslate\GoogleTranslate; class GetPokemonInfo extends Command { /** * The name and signature of the console command. * * @var string */ protected $signature = 'command:getpokemoninfo'; /** * The console command description. * * @var string */ protected $description = 'Command description'; /** * Create a new command instance. * * @return void */ public function __construct() { parent::__construct(); } /** * Execute the console command. * * @return mixed */ public function handle() { try { $p_no_array = range(1, 898); foreach ($p_no_array as $no) { // すでに取得済みの場合はスキップ $pokemon = Pokemon::where('p_id', $no)->first(); if (!empty($pokemon)) { continue; } // ポケモンごとの情報をcurlで取得 $url = 'https://pokeapi.co/api/v2/pokemon/'.$no; $curl = curl_init($url); curl_setopt($curl, CURLOPT_CUSTOMREQUEST, 'GET'); curl_setopt($curl, CURLOPT_SSL_VERIFYPEER, false); curl_setopt($curl, CURLOPT_RETURNTRANSFER, true); $r = curl_exec($curl); $data = json_decode($r, true); $p_info = self::getPokemonInfo($data); print_r($p_info['id']); print_r($p_info['jp_name']."\n"); print_r($p_info['en_name']."\n"); print_r("\n"); $p_info = Pokemon::createPokemon($p_info); sleep(1); } curl_close($curl); } catch(Exception $e) { echo $e->getMessage(); } } static function getPokemonInfo($d) { $p_info = []; // パラメータを設定 $p_info['id'] = $d['id']; $p_info['en_name'] = $d['name']; $from = "en"; // English $to = "ja"; // 日本語 $st = new GoogleTranslate($p_info['en_name'], $from, $to); $p_info['jp_name'] = $st->exec(); $p_info['type1'] = $d['types'][0]['type']['name']; if (isset($d['types'][1])) { $p_info['type2'] = $d['types'][1]['type']['name']; } else { $p_info['type2'] = null; } $p_info['ability1'] = $d['abilities'][0]['ability']['name']; if (isset($d['abilities'][1]) && !$d['abilities'][1]['is_hidden']) { $p_info['ability2'] = $d['abilities'][1]['ability']['name']; $p_info['hidden_ability'] = $d['abilities'][2]['ability']['name']; } else { $p_info['ability2'] = null; if (isset($d['abilities'][1]['is_hidden'])) { $p_info['hidden_ability'] = $d['abilities'][1]['ability']['name']; } else { $p_info['hidden_ability'] = null; } } $p_info['hp'] = $d['stats'][0]['base_stat']; $p_info['attack'] = $d['stats'][1]['base_stat']; $p_info['defense'] = $d['stats'][2]['base_stat']; $p_info['special_attack'] = $d['stats'][3]['base_stat']; $p_info['special_defense'] = $d['stats'][4]['base_stat']; $p_info['speed'] = $d['stats'][5]['base_stat']; $p_info['total_stats'] = $p_info['hp'] + $p_info['attack'] + $p_info['defense'] + $p_info['special_attack'] + $p_info['special_defense'] + $p_info['speed']; $p_info['front_default'] = $d['sprites']['front_default']; $p_info['back_default'] = $d['sprites']['back_default']; if (isset($d['sprites']['other']['dream_world'])) { $p_info['dream_world_front_default'] = $d['sprites']['other']['dream_world']['front_default']; } else { $p_info['dream_world_front_default'] = null; } if (isset($d['sprites']['other']['home'])) { $p_info['home_front_default'] = $d['sprites']['other']['home']['front_default']; } else { $p_info['home_front_default'] = null; } if (isset($d['sprites']['other']['official-artwork'])) { $p_info['official_artwork_front_default'] = $d['sprites']['other']['official-artwork']['front_default']; } else { $p_info['official_artwork_front_default'] = null; } $p_info['height'] = $d['height']; $p_info['weight'] = $d['weight']; return $p_info; } } このコマンドでやりたいことは 「ポケモンAPIから取得した各ポケモン情報をパラメータに格納してDBにインサートさせる」ことです。 ポケモンAPIを叩く $p_no_array = range(1, 898); foreach ($p_no_array as $no) { // すでに取得済みの場合はスキップ $pokemon = Pokemon::where('p_id', $no)->first(); if (!empty($pokemon)) { continue; } // ポケモンごとの情報をcurlで取得 $url = 'https://pokeapi.co/api/v2/pokemon/'.$no; $curl = curl_init($url); curl_setopt($curl, CURLOPT_CUSTOMREQUEST, 'GET'); curl_setopt($curl, CURLOPT_SSL_VERIFYPEER, false); curl_setopt($curl, CURLOPT_RETURNTRANSFER, true); $r = curl_exec($curl); $data = json_decode($r, true); $p_info = self::getPokemonInfo($data); print_r($p_info['id']); print_r($p_info['jp_name']."\n"); print_r($p_info['en_name']."\n"); print_r("\n"); $p_info = Pokemon::createPokemon($p_info); sleep(1); } curl_close($curl); ポケモンAPIのurlにcurlでアクセスして受け取ったJSONをデコードしてます。 これを1~898回繰り返します。 図鑑No.1のフシギダネからNo.898バドレックスまでです。 サーバに攻撃にならないようにsleep()をいれて間隔を少しだけ空けてます。 取得したAPIを各パラメータに入れる getPokemonInfoというfunctionを呼び出して 各パラメータの中にポケモン情報を格納しています。 https://pokeapi.co/api/v2/pokemon/1 を実行してみるとわかるのですが情報がめちゃめちゃあってどれを使おうかを決めて各パラメータにいれねばなりません。 地味な作業でした。。。 static function getPokemonInfo($d) { $p_info = []; // パラメータを設定 $p_info['id'] = $d['id']; $p_info['en_name'] = $d['name']; $from = "en"; // English $to = "ja"; // 日本語 $st = new GoogleTranslate($p_info['en_name'], $from, $to); $p_info['jp_name'] = $st->exec(); $p_info['type1'] = $d['types'][0]['type']['name']; if (isset($d['types'][1])) { $p_info['type2'] = $d['types'][1]['type']['name']; } else { $p_info['type2'] = null; } $p_info['ability1'] = $d['abilities'][0]['ability']['name']; if (isset($d['abilities'][1]) && !$d['abilities'][1]['is_hidden']) { $p_info['ability2'] = $d['abilities'][1]['ability']['name']; $p_info['hidden_ability'] = $d['abilities'][2]['ability']['name']; } else { $p_info['ability2'] = null; if (isset($d['abilities'][1]['is_hidden'])) { $p_info['hidden_ability'] = $d['abilities'][1]['ability']['name']; } else { $p_info['hidden_ability'] = null; } } $p_info['hp'] = $d['stats'][0]['base_stat']; $p_info['attack'] = $d['stats'][1]['base_stat']; $p_info['defense'] = $d['stats'][2]['base_stat']; $p_info['special_attack'] = $d['stats'][3]['base_stat']; $p_info['special_defense'] = $d['stats'][4]['base_stat']; $p_info['speed'] = $d['stats'][5]['base_stat']; $p_info['total_stats'] = $p_info['hp'] + $p_info['attack'] + $p_info['defense'] + $p_info['special_attack'] + $p_info['special_defense'] + $p_info['speed']; $p_info['front_default'] = $d['sprites']['front_default']; $p_info['back_default'] = $d['sprites']['back_default']; if (isset($d['sprites']['other']['dream_world'])) { $p_info['dream_world_front_default'] = $d['sprites']['other']['dream_world']['front_default']; } else { $p_info['dream_world_front_default'] = null; } if (isset($d['sprites']['other']['home'])) { $p_info['home_front_default'] = $d['sprites']['other']['home']['front_default']; } else { $p_info['home_front_default'] = null; } if (isset($d['sprites']['other']['official-artwork'])) { $p_info['official_artwork_front_default'] = $d['sprites']['other']['official-artwork']['front_default']; } else { $p_info['official_artwork_front_default'] = null; } $p_info['height'] = $d['height']; $p_info['weight'] = $d['weight']; return $p_info; } DB設計&作成 今回はpokemonテーブルのみ作りました。 Laravelのマイグレーションで作っています。 <?php use Illuminate\Database\Migrations\Migration; use Illuminate\Database\Schema\Blueprint; use Illuminate\Support\Facades\Schema; class CreatePokemonsTable extends Migration { /** * Run the migrations. * * @return void */ public function up() { Schema::create('pokemons', function (Blueprint $table) { $table->bigIncrements('id'); $table->integer('p_id')->nullable(); $table->string('jp_name')->nullable(); $table->string('en_name')->nullable(); $table->string('type1')->nullable(); $table->string('type2')->nullable(); $table->string('ability1')->nullable(); $table->string('ability2')->nullable(); $table->string('hidden_ability')->nullable(); $table->integer('hp')->nullable(); $table->integer('attack')->nullable(); $table->integer('defense')->nullable(); $table->integer('special_attack')->nullable(); $table->integer('special_defense')->nullable(); $table->integer('speed')->nullable(); $table->integer('total_stats')->nullable(); $table->string('front_default')->nullable(); $table->string('back_default')->nullable(); $table->string('dream_world_front_default')->nullable(); $table->string('home_front_default')->nullable(); $table->string('official_artwork_front_default')->nullable(); $table->integer('height')->nullable(); $table->integer('weight')->nullable(); $table->timestamps(); }); } /** * Reverse the migrations. * * @return void */ public function down() { Schema::dropIfExists('pokemons'); } } ポケモンごとにDBにインサート インサートするファンクションをModel内で作成しました。 ここはシンプル。 <?php namespace App\Models; use Illuminate\Database\Eloquent\Model; class Pokemon extends Model { protected $table = 'pokemons'; protected $dates = ['publication_date', 'expiration_date', 'registration_date']; protected $fillable = [ 'p_id', 'jp_name', 'en_name', 'type1', 'type2', 'ability1', 'ability2', 'hidden_ability', 'hp', 'attack', 'defense', 'special_attack', 'special_defense','speed', 'total_stats', 'front_default', 'back_default', 'dream_world_front_default', 'home_front_default', 'official_artwork_front_default', 'height', 'weight' ]; static function createPokemon($p_info) { if (empty($pokemon)) { self::create([ 'p_id' => $p_info['id'], 'jp_name' => $p_info['jp_name'], 'en_name' => $p_info['en_name'], 'type1' => $p_info['type1'], 'type2' => $p_info['type2'], 'ability1' => $p_info['ability1'], 'ability2' => $p_info['ability2'], 'hidden_ability' => $p_info['hidden_ability'], 'hp' => $p_info['hp'], 'attack' => $p_info['attack'], 'defense' => $p_info['defense'], 'special_attack' => $p_info['special_attack'], 'special_defense' => $p_info['special_defense'], 'speed' => $p_info['speed'], 'total_stats' => $p_info['total_stats'], 'front_default' => $p_info['front_default'], 'back_default' => $p_info['back_default'], 'dream_world_front_default' => $p_info['dream_world_front_default'], 'home_front_default' => $p_info['home_front_default'], 'official_artwork_front_default' => $p_info['official_artwork_front_default'], 'height' => $p_info['height'], 'weight' => $p_info['weight'] ]); } return true; } } 画面に表示 <div id="pokemon_block"> <div class="wrap-inner"> <ul class="poke_list flexlist"> <?php foreach ($pokemons as $pokemon) : ?> <li class="item"> <a href="{{ route('poke_show', $pokemon['id']) }}"> No.<?php echo $pokemon['id'] ?> <?php echo $pokemon['jp_name'] ?> <div class="imgarea"> <img src="<?php echo $pokemon['front_default'] ?>" alt=""> </div> </a> </li> <?php endforeach ?> </ul> </div> </div> 一旦全部のポケモンを表示させました。 'front_default'は画質が低いので大きな遅延はないのですが、他の重めの画像だと表示までに30秒くらいはかかってました。 今回は'front_default'を選んで遅延がないようにしました。 ただ、すこーしだけ遅いので全件表示よりは各世代ごとに分けて出すとかにする方が現実的ですね。 種族値も表示してみた <?php for($i = 0; $i < $pokemon['hp']/10; $i++): ?> <span class="single_gauge">▓</span> <?php endfor ?> "▓"という文字列を種族値/10の回数分だけ表示するように出しています。 これでこのポケモンの種族値の高さざっくりと見やすくなりましたね。 さてはこの種族値は何でしょう? ↓下のリンクが答えです。 AWSでサーバ構築してデプロイ サーバ構築はシンプルにしています。 ・ec2 linux/apache ・EIP ・RDS ハッサムが好き! かっこいい系のポケモンが好きなんですよね。 ハッサムはアルファサファイアやってた時にサイクルパでめっちゃ使ってましたね~ 使いやすいしかっこいいし(語彙力) おわりに これで終わりです。 もっと色々やりたかったのですが、とりあえずここまでにしました。 今回でポケモンDBを作れたので今後色々なアプリに使えるなーと思ってます。 勉強がてら遊びがてら使っていこうと思います。 今年も仕事納め前で絶賛忙殺中な毎日ですがわずかな合間を縫って10時間以内で全部作りました。 0から開発してサーバにアップするまでのスピード感も少しずつ付いてきた気がします。
  • このエントリーをはてなブックマークに追加
  • Qiitaで続きを読む

laravel uuidを生成する 個人メモ

目的 laravel8でuuidを生成する方法をまとめる 方法 下記のように記載することで$uuidにuuidが生成されて格納される。 use Illuminate\Support\Str; $uuid = Str::uuid(); 参考文献 https://laravel.com/docs/master/helpers#method-str-uuid https://qiita.com/miriwo/items/e40a8f5d03541eed7e7b
  • このエントリーをはてなブックマークに追加
  • Qiitaで続きを読む

複数のプロジェクトで Docker を使用する場合の個人的ベストプラクティス

社内でDockerを利用したプロジェクトが増えてきて、ポートの競合問題やコンテナが多すぎて重いなどの問題があり、「ひとまず現状これがベストかな?」と思える設定に落ち着いたので、それを書く。 概要 DB や mailhog などの共通で利用できるコンテナは共通化し、DBなどのポート競合や起動コンテナを減らす nginx-proxy でリバースプロキシして web のポート競合も回避する laravel のプロジェクトでしか私は使用していないが、汎用性はあると思う 注意 DBを共有にするため、プロジェクト毎にDBのバージョンを分けたい場合には対応できない。 そういった場合は、 律儀に、ポート番号が被らないように各プロジェクトで設定するか ループバックアドレスをプロジェクト毎に割り当てるか (https://qiita.com/hanlio/items/243006a67fb8d535d958) で対応が可能です。 ディレクトリ構成 . ├── webdev │   ├── dump/ │   └── docker-compose.yaml ├── project1 │   ├── docker-compose.yaml │   └── etc... └── project2    ├── docker-compose.yaml    └── etc... 共通コンテナの設定 adwin さんが公開してくれているリポジトリに nginx-proxy を追加いただけ。 https://github.com/adwinying/webdev docker-compose.yaml docker-compose -d pgsql mailhog proxy と必要なコンテナのみ起動する ダンプファイルなどがあれば、dump ディレクトリを作成して、そこにダンプファイルを格納する version: '3' services: mysql: image: mysql:5.7 ports: - '${MYSQL_PORT:-3306}:3306' environment: MYSQL_ROOT_PASSWORD: '${DB_PASSWORD:-password}' MYSQL_DATABASE: '${DB_DATABASE:-db}' MYSQL_USER: '${DB_USERNAME:-sail}' MYSQL_PASSWORD: '${DB_PASSWORD:-password}' MYSQL_ALLOW_EMPTY_PASSWORD: 'yes' volumes: - 'webdev-mysql:/var/lib/mysql' - './dump:/tmp/dump' networks: - webdev healthcheck: test: ["CMD", "mysqladmin", "ping", "-p${DB_PASSWORD:-password}"] retries: 3 timeout: 5s pgsql: image: postgres:13 ports: - '${PGSQL_PORT:-5432}:5432' environment: PGPASSWORD: '${DB_PASSWORD:-password}' POSTGRES_DB: '${DB_DATABASE:-db}' POSTGRES_USER: '${DB_USERNAME:-sail}' POSTGRES_PASSWORD: '${DB_PASSWORD:-password}' volumes: - 'webdev-pgsql:/var/lib/postgresql/data' - './dump:/tmp/dump' networks: - webdev healthcheck: test: ["CMD", "pg_isready", "-q", "-d", "${DB_DATABASE:-db}", "-U", "${DB_USERNAME:-sail}"] retries: 3 timeout: 5s redis: image: 'redis:alpine' ports: - '${REDIS_PORT:-6379}:6379' volumes: - 'webdev-redis:/data' networks: - webdev healthcheck: test: ["CMD", "redis-cli", "ping"] retries: 3 timeout: 5s meilisearch: image: 'getmeili/meilisearch:latest' ports: - '${MEILISEARCH_PORT:-7700}:7700' volumes: - 'webdev-meilisearch:/data.ms' networks: - webdev mailhog: image: 'mailhog/mailhog:latest' ports: - '${MAILHOG_PORT:-1025}:1025' - '${MAILHOG_DASHBOARD_PORT:-8025}:8025' networks: - webdev proxy: image: jwilder/nginx-proxy container_name: nginx-proxy ports: - "127.0.0.1:80:80" volumes: - /var/run/docker.sock:/tmp/docker.sock:ro restart: always privileged: true networks: - webdev networks: webdev: name: webdev driver: bridge volumes: webdev-mysql: driver: local webdev-pgsql: driver: local webdev-redis: driver: local webdev-meilisearch: driver: local プロジェクト毎の設定 共通コンテナを立ち上げた後、プロジェクト毎では web のコンテナだけ起動すれば良い docker-compose.yaml ports は 80 だけ指定すれば、コンテナ側のポートは適当に割り当ててくれる environment に VIRTUAL_HOST を設定することで、http://laravel.test にアクセスした際、nginx-proxy がよしなにしてくれる 共通コンテナと同一ネットワークに所属する必要があるので、 networks に webdev を指定している version: '3' services: app: image: thecodingmachine/php:7.4-v4-apache ports: - '80' environment: PHP_EXTENSIONS: bcmath gd intl pdo_pgsql pgsql PHP_INI_MEMORY_LIMIT: 512M PHP_INI_DATE__TIMEZONE: Asia/Tokyo PHP_INI_MBSTRING__LANGUAGE: Japanese APACHE_DOCUMENT_ROOT: /var/www/html/public VIRTUAL_HOST: 'laravel.test' volumes: - '.:/var/www/html' networks: - webdev networks: webdev: external: true name: webdev hosts ファイル hostsファイルに、 VIRTUAL_HOST の値を追記。 127.0.0.1 laravel.test おまけ 少しズレるが、docker-compose コマンドが長すぎるので、Taskfile の設定も置いておきます。 使用手順 docker-compose.yaml と同一階層に置く chmod 755 ./Taskfile で権限を変更する alias task=./Taskfile などとエイリアスを設定する これで準備完了です。 task artisan migrate などで実行できるので便利! Taskfile #!/bin/bash # https://github.com/adriancooney/Taskfile#install function up { docker-compose up -d } function down { docker-compose down } function restart { docker-compose restart } function exec { docker-compose exec app "$@" } function bash { exec bash } function php { exec /usr/bin/php "$@" } function artisan { exec /usr/bin/php artisan "$@" } function composer { exec /usr/local/bin/composer "$@" } function test { exec vendor/bin/phpunit "$@" } function tinker { artisan tinker } function start { echo "start task not implemented" } function default { help } function help { echo "$0 <task> <args>" echo "Tasks:" compgen -A function | cat -n } TIMEFORMAT="Task completed in %3lR" time ${@:-default} 本記事は個人ブログからの転記です。 https://zumikiti-note.netlify.app/posts/docker-multi-up/
  • このエントリーをはてなブックマークに追加
  • Qiitaで続きを読む

XAMPPでローカルDB開発環境(確認編)

ブラウザで確認する cmderからphp artisanコマンドを使用し、サーバーを立ち上げます。 Laravelフォルダ内に移動します。 cd C:\xampp\htdocs\Laravel_CRUD ローカルサーバを立ち上げます。 php artisan serve 「php artisan serve」のコマンドを実行後、「http://~」と表示されたURLをブラウザに入力することで、LaravelのWEBページを確認することができます。 ※ルーティングで設定したURLを「http://~」の末尾に追加してブラウザから各ページを確認してください。 例:表示されたURLが「http://127.0.0.1:8000」の場合→「http://127.0.0.1:8000/login」 ※ターミナルからコマンド入力に戻る場合は、「command+C」でサーバーを落とし、入力画面に戻ってからコマンド入力してください。 XAMPPのMySQLにログインする ターミナルからXAMPPのMysqlにログインします。 XAMPPのmysqlコマンドが使用できる階層に移動します。 cd C:/XAMPP/mysql/bin/ mysqlログインコマンド mysql -u root -p mysqlのログインコマンドを入力、パスワードは変更していなければ入力せずにそのままEnterでログインできるはずです。
  • このエントリーをはてなブックマークに追加
  • Qiitaで続きを読む

XAMPPでローカルDB開発環境(構築編1)

XAMPPをインストールする インストールするXAMPPのバージョン 下記のページから「PHP7.2.5」以上のXAMPPをダウンロードします。 今回は「LARAVELバージョン5.5」をダウンロードします。それに伴い「LARAVELバージョン5.5」が対応している、「PHP7.2.5」以上のXAMPPをダウンロードし、ローカル開発環境として使用します。xamppのインストール画面では、phpのバージョンごとにインストールするxamppを選択するようになっているのですが、「PHPバージョン8系」では「LARAVEL5.5」が使えない可能性がありますので、「PHPバージョン7系」のXAMPPをインストールしてください。 https://www.apachefriends.org/jp/download.html インストール手順 ダウンロードした「XAMPP-windows-installer.exe」をクリックして、インストールを開始します。 exeファイルがダウンロードできたら、起動しインストールを行います。 通常インストール時には「Cドライブ/programfile/」にソフトがダウンロードされますが、programfileに解凍してしまうと、トラブルが多く不便なので、今回はCドライブの直下にダウンロードを行います。 OKを押して、ダウンロード先の選択画面に進みます。 スタート画面です。Nextボタンを押して次の画面へ進みます。 次はインストールするツールを選びます。基本的に全部インストールでOKです。 次にインストール先のフォルダです。デフォルトでCドライブ直下にインストールするようになってますので、このままでOK。 ※制作を進めていくと1G以上のサイズになってしまうこともあるので、ダウンロード先をDドライブに変更しても動作に問題はありません 続けて言語設定です。 「English」を選択して「Next」をクリックしましょう。 BitnamiというPHPとMySQLのセットになっているツールなど、XAMPPに搭載されているツール説明機能紹介の文が表示されます。 「Next」をクリックして、進みます。 続けて「Next」をクリックしていくとインストールが実行されます。 XAMPPを起動して、コントロールパネルが表示されるとインストール完了です。 画像のように上から『Apache』『MySQL』の「Start」ボタンをクリックして起動しましょう。 Apacheが起動できない場合 Apacheが起動できない場合、別のソフトが同じポート番号を使っている可能性があります。 上の画像でPort80と表示されている通り、80番をXAMPPは使ってます。例えば、Skypeなども80番を使用している事が多いので、Skypeを使ってる場合は終了(Quit)してから試してみてください。それでもダメなら、その80番を使ってるアプリを探して終了してからApacheを起動しましょう。 ブラウザに「http://localhost/」と入力し、XAMPPにアクセスしてみましょう。 このように表示されれば、XAMPPの仮想サーバーがちゃんと動いているということが確認できます。 ブラウザで確認する 「XAMPP/htdocs/」に配置したファイルを確認するときは、ブラウザに「http://localhost/」で始まるURLを入力することで、XAMPPのApacheサーバーを経由して確認することができます。 (例)「XAMPP/htdocs/test/test.php」を作成して、ブラウザからそのファイルを確認する時 階層構造 XAMPP └ htdocs └ test └ test.php この場合は、「http://localhost/test/test.php」のように、htdocs配下からがlocalhost以降のパスになるように記述します。 ※直接ブラウザにphpファイルをドラッグドロップしても、ブラウザがphpを処理できないので、ソースコードがそのまま表示されてしまいます。 ブラウザで確認の際は、上記のURLで開いてXAMPPのApacheサーバーを通して確認しましょう。
  • このエントリーをはてなブックマークに追加
  • Qiitaで続きを読む

MAMPでローカルDB開発環境(確認編)

このページでは、下記の内容を解説していきます。 Laravelで作成したページを確認する ターミナルでMAMPのMySQLにログインする方法 MAMP環境にLaravelを制作された方は、このページを参考に、それぞれブラウザで開いて確認してみましょう。 Laravelで作成したページを確認する Laravelでは、artisanコマンドでビルトインWEBサーバーを起動することができます。 まず、Laravelの中にcdコマンドで移動します。 ターミナルで以下のコマンドを入力して下さい。 cd /Applications/MAMP/htdocs/Laravel 続けて、サーバーを起動します。 php artisan serve 上記のコマンドを入力するとURLが発行されますので、ブラウザにURLを入力してページを開きます。 すると作成中のWEBページを確認することができます あとはLaravelのルーティングで設定した後でブラウザから各ページを確認してください。 例:php artisan serveで表示されたURLが「http://127.0.0.1:8000」で、Laravelで「/login」というURLをルーティングした場合は、「http://127.0.0.1:8000/login」とすることでページを開くことができます。 サーバー起動中はターミナルにアクセスログが表示されます。 コマンド入力で、Laravelを編集する際は「command + C」でサーバーを落とし、入力画面に戻してください。 MAMP環境のMySQLヘログイン MAMP環境にアクセスします。 MAMPのコマンド群は「/Applications/MAMP/Library/bin/」に格納されていますので、cdコマンドで階層へ移動し、コマンドを入力することでMAMPのログインコマンドを使用することができます。 ターミナルで以下のコマンドを入力して下さい。 cd /Applications/MAMP/Library/bin/ 移動したら、MAMPのMySQLにログインします。 下記のコマンドを入力して下さい。 ./mysql -u root -p パスワードの入力を求められますが、MAMPのWEBスタートページに記載されているので、確認して入力して下さい。 MAMPのデータベースにMySQLでログインできましたか? ここからはサーバーサイドLESSON3で学習したように、コマンドで操作してデータベースを確認してみて下さい。 以上で、MAMPでLaravel環境構築は終了になります。 ここからは、もとのカリキュラムを進めてみてください。artisanコマンドを入力する箇所は、カリキュラム内容と異なるので、カレントディレクトリの表示を確認して、MAMPのLaravel直下で行う様に注意してください。 ご不明点はお問い合わせチャットからご質問ください。 まとめ artisanコマンドを使用するときは、「/Applications/MAMP/htdocs/Laravel_CRUD/Laravel/」階層で実行する。 artisan コマンドでサーバーを立てる。 MySQLにログインする時は、「Applications/MAMP/Library/bin/」階層でログインコマンド「./mysql -u root -p」を実行する。
  • このエントリーをはてなブックマークに追加
  • Qiitaで続きを読む

MAMPでローカルDB開発環境(構築編)

環境構築の流れ 後で説明しますが、LaravelをインストールするときはComposerというソフトを使用します。MAMP環境内でダウンロードを行う際、MAMPのPHPのバージョンを確認して、使用できるクラスなどを準備します。 なので、本項で作成したLaravelを、他の環境に移動して使用しようとするとPHPのバージョンの違いで動かないことがあります。 そう言った場合は、移動した先の環境下でcomposerの調整を行う必要が出てきますのでご注意ください。 LaravelのダウンロードとMAMPへ接続 まず、本カリキュラムではLaravelをインストールする際に、「Composer」というPHPのライブラリ依存性管理ソフトを使用するため、まずこちらをダウンロードします。 Composer(Laravelのパッケージ管理ソフト)のダウンロード Composer ダウンロードすることでさまざまな機能を実装することができる「パッケージ」という機能群があります。パッケージを使用することで、制作の高速化を図ることができます。 パッケージにもたくさんの種類があり、それらは「ライブラリ」と呼ばれる一つのまとまりになっています。また、そのライブラリも色々なメーカーや、種類ごとにまとまっていて様々なものが存在します。 例えば「便利そうなライブラリAを使用したい」という場面で、使い方を調べてみると「ライブラリAを使うにはライブラリBが必要であることが分かった…そしてライブラリBを使うには、Cが必要で…」というような、実装に手間がかかることがあります。 Composerを使用すると、「composer require ライブラリA」と入力するだけで、依存関係を考慮して必要なものをダウンロードしてくれます。 このように、ある一つのライブラリが必要な環境に、他のライブラリが必要になる場面で「他パッケージとの依存性」を「管理」して、必要なデータを選んでダウンロードを行なってくれます。 ダウンロード手順 では実際にComposerをインストールしましょう。 ターミナルで、以下のコマンドを入力してください。 curl -sS https://getcomposer.org/installer | php 使用環境のPHPバージョン確認が行われ、適正なバージョンのComposer(composer.phar)がダウンロードされます。 次に、どの階層でもcomposerコマンドが使用できるように、パスを通します。mvコマンドを使用してこのファイルを移動して下さい。 sudo mv composer.phar /usr/local/bin/composer これでComposerのダウンロードとパスの設定は完了です。 試しに、コマンドが使用できるか試してみましょう。 以下のコマンドを入力して、Composerのバージョン確認をしてみて下さい。 composer -V コマンド処理結果 Composer version 2.0.9 2021-01-27 16:09:27 Composerのバージョンが表示されればインストール完了です。 Laravelのダウンロード では、Laravelをダウンロードしましょう。 始めにLaravelをダウンロードするディレクトリに移動します。下記のコマンドでMAMPの開発環境「/htdocs」に移動して下さい。 ターミナルで以下のコマンドを実行してください。 cd /Applications/MAMP/htdocs/ MAMP環境に移動したら、Laravel_CRUDというファイルを作成して、その中にLaravelをダウンロードしましょう。下記のコマンドでフォルダを作成、Laravel_CRUDフォルダ内に移動します。 mkdir Laravel_CRUD && cd Laravel_CRUD フォルダに移動できたら、以下のコマンドでComposerを使用しLaravelをダウンロードします。 composer create-project laravel/laravel=5.5 Laravel 以上でダウンロード手順は終了です。 ダウンロードしたものを確認してみましょう ターミナルだけで作業をしていたので、フォルダ内階層がどうなっている一度確認しましょう。FinderでMAMPの「/htdocs」フォルダ内を見てどのような構造になっているか確認してみてください。 Finderから「アプリケーション/MAMP/htdocs/」を開いて頂き、「Laravel_CRUDフォルダ」が作成されていて、中にLaravelフォルダが入っていれば大丈夫です。 LaravelをMAMPのデータベースに接続する データベースの作成 まず、MAMPのデータベースに今回Laravelで使用するデータベースを作成します。MAMPの「WEBスタートページ」(MAMPを起動した状態で、ブラウザで「http://localhost:8888/MAMP/」)を開き、ヘッダーメニューから「TOOLS/PHPMYADMIN」を選択して下さい。 すると、このようなページが開きます。 このページでは、MAMP環境内のデータベースをGUIで表示したページで、クリック操作で「データベース作成」や「テーブルの確認」などを行ったり、SQL文を入力して「レコードの作成」などを行うことができます。 ただ、テーブル作成、レコードの挿入はLaravelからコマンド入力で行うことができるので、今回は「データベース作成」のみをこの画面から行います。 PHPMyAdminで以下の操作をしてください。 タブメニューの「データベース」を選んでください。 すると、データベースを作成する画面に切り替わります。 続けて、作成するデータベースの名前を入力します。今回は「Laravel_CRUD」というデータベースを作成し、Laravelでこのデータベースに接続しましょう。 「作成」をクリックすればデータベースが作成されます。 以上でデータベース作成完了です。 .envファイルの編集 次にLaravelでMAMPのデータベースに接続する設定を行います。 「.env」という、接続設定を行うファイルがあるのですが、「.」で始まるこのファイルは「隠しファイル」といい、アプリケーションの動作に関連する重要なファイル群のひとつです。 「隠しファイル」という名の通り、OSの初期搭載ソフトでは設定などを変更することなく、表示されないようになっています。 ショートカットコマンドで表示することができるので、入力してみましょう。 Finderでファイルを開いた状態で「command + shift + .(ドット)」を入力して下さい。すると全ての階層で、半透明の「隠しファイル」が表示されるようになります。 先にも述べましたが、隠しファイルは重要なファイルなので、不必要に消したり、編集しない様に注意してください。 続けて、「.env」ファイルを開きましょう。 Finderで「アプリケーション/MAMP/htdocs/Laravel」を開いて下さい。 半透明のデータ「隠しファイル」の中に「.env」というファイルを確認できましたか? 今回編集するこの「.env」ファイルも「隠しファイル」で、中にはLaravelとデータベースを接続に関する設定が記載されています。 では、このファイルを編集していきましょう。 設定に関する記述が並んでいますが、記述の一部を、MAMPのデータベースに接続するように変更します。 書き換える内容は、MAMPの「WEBスタートページ」(MAMPを起動した状態で「http://localhost:8888/MAMP/」をご確認下さい)に記載のMySQL箇所に合わせます。 DB_CONNECTION=mysql DB_HOST=127.0.0.1 DB_PORT=3306 DB_DATABASE=homestead DB_USERNAME=homestead DB_PASSWORD=secret 上記箇所をMAMPのWEBスタートページのMySQL情報に記載されている内容に修正してください。 DB_CONNECTION=mysql DB_HOST=127.0.0.1 DB_PORT=8889 DB_DATABASE=Laravel_CRUD DB_USERNAME=root DB_PASSWORD=root DB_SOCKET=/Applications/MAMP/tmp/mysql/mysql.sock ・ご自身のMAMPのMySQL情報と同じ内容になっているか確認してください。 「DB_DATABASE」は、PHPMyAdminで作成したデータベース名にします。 これでLaravelのデータベースの設定は完了しました。 以上でMAMPでLaravel環境構築のセットアップは完了になります。お疲れ様でした。 ここからは、元のカリキュラムに戻って作業を進めて頂きますが、一部コマンド入力の階層が、元のカリキュラムと異なる箇所があるので、次のMAMPでLaravel環境構築(確認方法)のページもご確認下さい。 まとめ LaravelのダウンロードとMAMPへ接続 Composer(Laravelのパッケージ管理ソフト)のダウンロード Laravelのダウンロード LaravelからMAMPのデータベースへ接続する
  • このエントリーをはてなブックマークに追加
  • Qiitaで続きを読む

Laravel Eloquentとクエリビルダの違いを整理してみた

はじめに 株式会社じげんの藤井です。 リフォームマッチングサイト リショップナビの開発を担当しています。 今年度の6月に現場配属され、半年ほどLaravelを使った開発に携わってきたので、 混同しがちなクエリビルダとEloquentとの相違点をまとめます。 これからLaravelを触り始める方の参考になれば幸いです。 クエリビルダとは? LaravelのDB関連の機能として代表的なものに、クエリビルダがあります。 こちらはPHPを使ってSQL文を構築する仕組みで、メソッドチェーンでSQL関連のメソッドを並べてSQLを発行できるので、SQLがわかる人には直観的に理解しやすいという特徴があります。 具体的には、以下のように使用します。 use \Iluminate\Support\Facades\DB; $posts = DB::table('posts') ->select('id', 'author_id') ->where('author_id', '10') ->orderBy('created_at', 'desc') ->get(); DBファサードのtableメソッドで、扱う対象となるDBのテーブルを指定しています。 select, where, orderByに関しては生のSQLと同じで、クエリをgetメソッドで実行し、結果を$postsに格納しています。 クエリビルダは、SQLインジェクションからアプリケーションを守る機能を備えています。(Eloquentも同様) 不正なSQL文が送られてきた場合、それをSQL文ではなく単なる文字列として扱う(エスケープする)ことで、DBに対する攻撃を防ぎます。 具体的には、PHPのプリペアドステートメントに対してPDOパラメータを後からバインディング(PHPのbindValue()のような処理が内部的に走る)することで、挿入されたパラメータが生SQLとして解釈され、意図しないSQL文が発行されてしまうのを事前に防いでいます。 Eloquentとは? Laravelの機能として提供されているO/Rマッパーです。 RDBのテーブルとモデルを関連付ける機能を実現しており、PHPの書き方でDBを操作することを可能にします。 関連付ける具体的な方法としては、作成するモデルのクラス名を単数形で、DBのテーブル名をその複数形で作成することによって、自動的に紐づけることができます。 具体的には、以下のように使用します。 use App\Models\Post; $posts = Post::where('author_id', 10) ->orderBy('created_at', 'desc') ->get(); Postモデルに紐づいた、DBのpostsテーブルから、author_idカラムが10のものを検索し、created_atカラムを降順に並べて返却したデータを$postsに格納しています。 また、DB間の差異をEloquentが吸収する(例えば、本来MySQLとPostgreSQLで異なる書き方をするべきであるところを、Eloquentが各々に適したSQLを自動的に発行してくれる)ため、アプリケーション側からDBの種類や仕様を意識しなくて良くなります。 「アプリケーションとDBを疎結合にする」と言い、保守性が高まります。 クエリビルダとEloquentの返り値の違い クエリビルダとEloquentの大きな違いとして、返り値の形式があります。 クエリビルダの返り値 DB::table('posts') ->get(); stdClassのオブジェクト、またはそのCollectionとなります。 stdClassとはPHP標準で搭載されているClassで、プロパティやメソッドが一切定義されていないクラスです。 オブジェクトの代替として利用することがあるようです。 Eloquentの返り値 Post::all(); モデルオブジェクト、またはそのCollectionとなります。 Collectionの各要素がそのままPostクラスのインスタンスになっているため、foreachなどを使って個別の要素を取り出せば、クラス内に実装されたメソッドなども使えます。 クエリビルダとEloquentはどのように使い分ける? Eloquentは、実は内部処理でクエリビルダを利用しています。そのため、クエリビルダで使用できるメソッドは全てEloquentでも使用可能です。 クエリビルダの方が適している場合 パフォーマンスを重視する場合:一覧画面の実装など、多くのデータを取得する必要がある場合、よりパフォーマンスの良いクエリビルダが適しています。 複雑な条件を扱う場合:SQLに慣れていれば、クエリビルダはEloquentよりも発行されるSQLを把握しやすく、複雑な条件を適切に指定することができます。 Eloquentの方が適している場合 記述を簡潔にしたい場合:Eloquentではモデル同士にリレーションを貼ることができ、関連したモデルを簡単に呼び出すことが可能です。そのため、join句を使う必要のあるクエリビルダよりも相対的に記述が短くなります。 クエリスコープを使いたい場合:上記の「記述を簡潔にする」と近い項目ですが、クエリの共通条件をメソッド化してしまい切り出すことで、同じクエリを繰り返し書かなくて良くなる「クエリスコープ」という機能がEloquentに実装されています。繰り返しを避けることができるようになるだけでなく、条件の一部が変更になった際に修正が1箇所で足りるといったメリットがあります。 こうして、両者を使い分けていくと良いのではないかと考えています。  〆 私自身、両者の違いを曖昧に理解していたまま使用していましたが、今回まとめてみることで大変勉強になりました。 皆さまの参考になれば幸いです。 今回は以上となります。
  • このエントリーをはてなブックマークに追加
  • Qiitaで続きを読む

振り返り②(これいる?作っとく?の会話記録)

振り返り2回目です。 今回もどうしようね?って3人で話した結果の記録です。 決まったこと サーバーのお金、どうする? →会社の人に要相談(AWS1年間無料プランがあったけど…) →後日菊池さんに聞いたところ、お金は気にしなくていいよとイケメンな回答された toolとfrontいる? →stgとprodいる?金銭的な問題のため自分たちでは決められないねえ。。。 →菊池さん「dev環境だけ作ればいいよ」 アカウント制限どうする?いる? →必要ないかと思ったけど、Laravelでアカウントの権限のところを作るのは調べたところ、  容易そうなので、やってみたいかもってことで作ることに マスター権限だけでできることって何かある!? →アカウント削除とかユーザー一覧が見られるくらいになりそう →とりあえず作っておこ! 画面仕様書とかテーブル設計書とかワイヤー作る? →そのほうが管理しやすいと思われる →個人的にドキュメント作るのはいい経験だと思うので、作っておきたい →菊池さん「簡易的なシステム構成図とか書くと整理できていいかもね」 私「じゃあ作ってみよう〜」 進めていくうちに他にも決めることがいろいろ出てくるだろうけど、 とりあえず始まったばかりはこんな感じだろって思いました。 written by 大森
  • このエントリーをはてなブックマークに追加
  • Qiitaで続きを読む

laravelでソーシャルログインができるようになりたい(OAuth)

laravelでのソーシャルログインができるようになるために参考になった記事を貼っていきます Line Facebook
  • このエントリーをはてなブックマークに追加
  • Qiitaで続きを読む