ほ〜と思ったことがあったので共有。 物理削除と論理削除 ユーザーのデータを削除したい時。 表題の2つの方法があるみたいです。 物理削除は実際にSQLでDeleteを実行し、データベースから削除される。 なので復元したり削除されたデータを参照することはできない。 論理削除は実際にはデータを削除せずに、削除しているかのように振る舞うことです。 消されたフリをしているだけなので復元すぐできるし参照もできるのです。 ↓論理削除Laravelでは簡単にできるようです。 論理削除用カラム追加 [database/migrations/yyyy_mm_dd_000000_create_users_table.php]※一部抜粋 public function up() { Schema::create('users', function (Blueprint $table) { // 省略 $table->softDeletes(); }); } $table->softDeletes()で「delete_at」というカラムが作成されます。 ↓続いてモデルをいじります。 app/User.php use Illuminate\Database\Eloquent\SoftDeletes; // 省略 class User extends Authenticatable implements MustVerifyEmail { // 省略 use SoftDeletes; // 追加 // 省略 これだけで、今回の場合Userモデル関連のdelete()を行うと「delete_at」カラムに日付が入力されて論理削除になる！ ただしやみくもに論理削除を設計に組み込むと 論理削除データが多い場合データ量増大やそれに伴う検索性能の劣化する可能性があるため あまりよろしくない。 まとめ 現段階ではこの２つを使いこなすのは到底難しいけども 概念として知っておくべきだと思ったのでメモしておきました。 間違ってること言ってるかもしれないので鵜呑みは要注意。
ベストベンチャー100に選ばれている企業に勤めております。 新卒研修の振り返りで2ヶ月間(4~5月)でやったことを残します。 4月第１週 総合職研修 - PDCA - タスク管理 - ビジネスマナー 4月第2週 開発手法 スクラム開発 1スプリントを繰り返す開発手法 1スプリントは、スプリントプランニング、デイリースクラム、スプリントレトロスペクティブ、スプリントレビュー クラウドネイティヴ クラウド技術を最大限活かそうという考え方 開発スピードの向上、属人化を防ぐ、品質向上などの利点がある 開発ステージについて ローカル開発環境 テスト環境(プログラムが動くかどうかの確認) ステージング環境(本番環境の検証のための環境) 本番環境 Laravel環境構築 Docker for M1 Mac、Workbenchのインストール PHP基本構文、DB、 4月第3週 [チーム・個人]におけるKPI(key performance indicator)について 目標を達成するために必要なアクティビティ べロシティ →ストーリーポイント(タスクの難易度)をどれくらいこなしたか デプロイ回数 →お客さんにどれだけデリバリーできたか サーバー応答速度 → ブラウザの速度 工数・工期予実達成率 開発フローについて テスト設計 テストケース作成 単体テスト 結合テスト 総合テスト UAT (User Acceptance Testの略) 目標設定 基本的には上長がこの1年間で期待していることを目標に定めた。 サービス全体像の理解やサービスアーキテクチャの理解、他部門からの依頼処理など ソフトウェアのテスト技法 の輪行開始 テストファーストな考え方を知る。 バグが出て修正する時間の方が勿体無い。 良いコードとは。 可読性 保守・運用のしやすさ 昔は少ないコード、処理速度に重点を置いていた(CPUやメモリの関係) - ブラックボックステスト(要件定義署や仕様書に合っているか確認するテスト手法) 同値クラステスト 境界値テスト -ディシジョンテーブルテスト ペア構成テスト 状態遷移テスト ドメイン分析テスト ホワイトボックステスト(パスや処理の流れなどプログラム内部に沿ったテスト手法) 制御フローテスト データフローテスト テストの終了条件 テストログ、テスト不具合レポート エビデンス、ログを示す、再現手順がしっかりと書かれているかが大事。 xdebugを入れてPHPUnitを実行 正直、テストに関しては実際に作成&実践してみないと実感がわかない。 Dockerコマンド docker-compose build docker-compose up docker-compose down docker-compose exec アプリ名 シェル Laravel ディレクトリ構造 MVCモデル artisan コマンド 4月第4週 CI/CDについて CI(各開発者の作業結果を自動的に統合、単体テストや結合テストの自動化) CD(開発物を素早くユーザに供給する) AWSについて ELB ECS Lambda Cloudwatch S3 DynamoDB ECR Fargate Athena QuickSight GAS(Google Apps Script)環境構築 Golang デバッグ環境構築 5月第1週 Google チャットbot開発。新規入会者数を決まった時間に通知する。 使用した技術 Golang, CloudWatch、Lambda、APIGateway、DynamoDB 所感 静的言語型付け言語を初めて触った。構造体やポインタの概念など改めて勉強になった。Golangの醍醐味である並列処理などは行っていないので、暇があったらやってみたい。 5月第2週 記念日Slack通知bot開発 スプレッドシートから記念日を取得し、Slackに通知する。 要件定義から、運用計画、デモまで行った。 使用した技術 - GAS、SlackAPI 所感 開発したBotが初めて動いた時(エンジニアの誕生日を祝った)はとても嬉しかった。今後も社内で運用していくので、より良いサービスに改築していきたい。 5月第3週~4週 Github活動見える化 リポジトリ情報(プルリクやレビュー情報など)を大量に取得し、Amazon QuickSightでデータの可視化を行う。 使用した技術 - Golang、ECS、ECR、Fargate、athena、QuickSight、Github API 所感 チームや個人の貢献度を測るための指標づくりの一環として開発を行った。ビッグデータ の取得やBIツールを使った分析方法を学べたのはよかった。
英会話＝リスニング+瞬間英作文 英作文のWEBサービスを作ってみた。 初めに 英語を勉強する目的はひとそれぞれです。TOEICで良いスコアを取りたい、映画を字幕なしで見たい、受験のために英語が必要、留学したい、英語を使った仕事に就きたい、外国人と楽しく英会話をできるようになりたい、カッコよく英語を話せるようになりたいなど。 英語の勉強をする方法も、無料のものから有料のものまで数えられないほどたくさんあります。英単語を覚える、文法を暗記、簡単な英文を暗記、シャドーウィング、リスニングを聴く、リーディング、ディクテーション（耳で聞いたものをそのまま書き取っていく）をする、英文の音読、英語で日記を書く、英作文を作る、オンライン英会話、学校に通う、留学などなど。 どれも大切ですし、正直何から始めて良いかわからないかとおもいます。 ただ、よく言われるように多くのひとはリーディングはそれほど苦労なくできると思います。 英語を学ぶ目的としては、英語を話せるようになりたい、英会話できるようになりたいというのが一番ではないでしょうか。リスニングには問題がなく、相手の言っていることは分かるのに、上手く答えられない、会話がスムーズにいかないというのはフラストレーションがたまります。 この5秒英作文のサイトは、日本語を見て、瞬間的に英作文ができるようになるために作りました。 英会話ができるようになるには 瞬間的に英文が作れると何がいいのか。 瞬間的に英文を作れるようになると英会話がスムーズにできるようになります。コミュニケーションも円滑になるでしょう。 瞬間的に英作文を作る練習は「基本的な文法をマスターする」「瞬発力を鍛える」のに効果的で、この力は英会話においてはかなり重要です。 TOEICなどのリーディングの試験で必要な英語の力をつけることにも役立つはずです。 英語が話せるとは”今言いたいことが口から瞬時に出てくること”だと思います。 では、どうすれば今言いたいことが瞬時にでてくるのかというと、瞬時に出てくるセリフの引き出しが多ければ多いほど出てきやすいです。 最初は難しいかもしれませんが、日本語を見て英語を口に出すトレーニングを積めば、英語を口に出すことに慣れてきます。 何度もやれば少しずつフレーズを覚えてきます。 インプットなしにはアウトプットはできません。頭の中に英語があまり入っていないのに、英語が話せるわけがないのです。 少しずつでも続けていれば、そのうち自分が言いたいことも出てきやすくなります。そして引き出しが増えていきます。 基本的な文法の引き出しが増えれば、後はボキャブラリー（単語）のバリエーションが広がれば広がるほど、英語で伝えられることが増えていきます。応用がきくようになります。 トレーニングを積むことで、使うべき文法やフレーズがより瞬間的に頭に浮かんでくるようになるでしょう。 英語が話せるようになりたくてオンライン英会話を始めたり、留学を検討する人も多いとおもいます。ですが、これだけでは英語のスピーキング力を効率的に向上させることはできません。 スピーキング力を向上させるには、話す機会を持つことが重要なのではなく、その準備（時間が掛かっても、まずは正確な文章を作れるようになること）が大切なのです。基本的な簡単な単語、文法を学んでからオンライン英会話なり、留学をした方が会話を楽しめます。むしろ、基本的な文法さえ分からない状態だと英会話がストレスに感じ、あまり楽しく感じられないのではないでしょうか。 基本的な簡単な単語、文法を身に着けるのにはこの5秒英作文のサイトで瞬間英作文力をきたえることが最適です。 また、単語・文法の基本的な知識がないうちに、オンライン英会話などで先生にうながされて話すと、単語も文法もめちゃくちゃな「変」な英語を自分で作ってしまいます。その後に、修正されても、自分で作りだした「変」な英語が強烈な印象を持って頭に刻み込まれているので、何度も同じ間違いを繰り返してしまうという現象すらあります。まずは初期段階での基礎学習とインプットが重要です。 ネイティヴスピーカーと話す機会は、ある程度基礎知識が身についてからの実践練習のステップで積極的に活用するほうがいいでしょう。 このサイトには基本的な文法をつかった簡単な日常会話から少し難しい関係代名詞を使った文章を登録しています。 基本は中学英語レベルの問題がかなり多いです。英語を見れば「あー!こんなものか。」というくらい簡単なのに、日本語を見て英語を作れないというのは、中学英語が「わかる」けど使いこなせていないのです。中学英語を使った簡単な英文を大量に声に出して、基礎をマスターしましょう。 基本的な使い方 ①日本語を見て、英文を口に出す。 日本語を見て5秒以内に英語に直して声に出してください。 ②5秒考えてわからなければ英語を確認して答え合わせ。 日本語をクリックすると英文がでます。 あまり長く考えず、分からなければすぐに答えを見てください ③何度か口に出す。 口になじむまで何回か声に出してみましょう。 サウンドボタンを押すと英語を読み上げますが、デバイスの言語を英語にする必要があります。 ④次の問題へ 全部で1000問以上あります。リロードで問題はシャッフルされます。 機能 日本語を表示。Laravelのメソッドを使ってランダムで表示。 日本語をクリックしたら英文を表示。JQueryで実装/li> サウンドボタンをクリックしたら英文を再生。Web Speech APIをつかって実装。ここが割と苦労しました。今もAndroidとWindowsからの利用だと正しく英語が再生されるが、IPhoneだとデバイスの設定が日本語の場合、たどたどしい日本語で読み上げられてしまいます。仕方ないのかなああああと諦めました。 検索機能。 日本語と英語を逆にしたバージョン。英語を読みたい人、日本語を勉強したい外国人向け。 新規投稿機能。(ログイン時） お気に入り機能。(ログイン時） アドミン機能。アドミンユーザーははすべての投稿を修正できます。 経緯 友人が留学に行くとのことだったので何か英語の勉強に役にたつもの作れないかなと思った。僕は英語を学んだ際、瞬間英作文を本を使って勉強していたが、サービスを提供しているWEBサイトが見つからなかったので作ってみました。 公開後 Twitterアカウントを作成 Webアプリを作ったことのある方であればわかるかと思うのですが、作っただけではアクセスは全くありません。全くというほどありません。 英語学習中の友人にサイトを送ったところ好評だったので、別の友人にも送ってみたところこちらも好評でした。もしかしたら役に立つサイトなのでは？と思い、アクセスを集めるために、人に広めるためにTwitterのアカウントを作成。RT30ほど、イイネを250近くいただき、「良いサイトだ」「神サイトだ」というような嬉しいコメントも結構頂きました。 サイトのアクセスもグングン伸び、1日で最大80人のユーザーに見られ、1か月で新規のユーザーが800人になりました。こんなにも反応を頂けるとは予想していなかったので驚きました。 1か月半ほど経った現在の1日平均のアクセスは20-30人ほど。はじめはTwitterからのアクセスが主だったのですが、今はTwitter3割、ダイレクトで来る人が4割、検索またはGoogle広告から来る人が3割くらいです。 Google広告の効果なのかアクセスは日本からだけでなくいろんな国からあります。外国に住む日本人の方が英語の必要性が高いからなのかな？と思ってましたが外国人の方も数人登録してくれているようです。不思議ですね。 今後 もう少したくさんの人に使ってもらいたいなあと思います。1日平均50人ぐらいのアクセス欲しいなあと思います。データを追加したりコツコツとアップデートはしてます。SPA化しようかなとも考えてますが、SEO的によくないという記事を見たり何が正解かわからないので躊躇してます。ほそぼそと続けていきます。
状況 Laravelに備え付けの認証機能を使って、Googleの認証を実装する時のこと。 LoginControllerに処理を書き、route/web.phpに以下のルーティングを設定した。 route/web.php Route::get('login/google', 'Auth\LoginController@redirectToGoogle'); Route::get('login/google/callback', 'Auth\LoginController@handleGoogleCallback'); エラー内容 Webページに表示されたエラー文はこちら。 Illuminate\Contracts\Container\BindingResolutionException Target class [Auth\LoginController] does not exist. Illuminate\Container\Container::build vendor/laravel/framework/src/Illuminate/Container/Container.php:835 LoginControllerが見つからないとのこと。 原因の検証 このパターンのエラーで私がこれまで経験した例では、以下ような問題が原因…。 ・namespaceが定義されていない ・ルーティングファイルに書いているパスが不完全、誤っている ・ルーティングファイルに使いたいコントローラーをuseしていない 解決法 今回はnamespaceの定義部分がコメントアウトになっていました。 app/Providers/RouteServiceProvider.php protected $namespace = 'App\\Http\\Controllers'; この部分のコメントアウトを外すと、エラーは解消しました。
はじめに アプリケーションをローカルで作成し、mixhostにデプロイしたので、その時の備忘録です。 操作 mixhostのコントロールパネルから操作します。 MySQLデータベースをクリック 新しいデータベースを作成します。 新しいユーザーを追加します。 ユーザーをデータベースに追加します。 ユーザー権限は細かく設定できます。 ここからはLaravelの設定です。 .env DB_CONNECTION=mysql DB_HOST=127.0.0.1 DB_PORT=3306 DB_DATABASE=XXXXX_test //作成したデータベース名 DB_USERNAME=XXXXX_user01 //作成したユーザー名 DB_PASSWORD=******** //ユーザー作成の時に設定したパスワード 以上で完了です。
Laravelでmarked.jsを使用したマークダウンプレビュー機能を実装したので備忘力として残して置こうと思います。 完成形 1.marked.jsをインストール $ npm install marked インストールができたのか確認はpackage.jsonのdependenciesをみていただけるとmarkedが入っていると思います。 2.テンプレート作成 resources/views/posts/form.blade.php <form class="post-page-wrapper" action="{{ route('post.create') }}" method="post"> @csrf <div class="row"> <div class="col-6 m-1"> <textarea name="body" id="markdown_editor_textarea" cols="30" rows="10" class="form-control"></textarea> </div> <div class="col-6 m-1"> <div id="markdown_preview"></div> </div> </div> <div class="post-page-footer"> <input type="submit" class="post-button m-1" value="投稿"> </div> </form> マークダウンをプレビューに表示する処理をjsに記述 resources/js/markdown.js import marked from 'marked'; // マークダウンをプレビュー画面に表示する $(function() { marked.setOptions({ langPrefix: '', breaks : true, sanitize: true, }); $('#markdown_editor_textarea').keyup(function() { var html = marked(getHtml($(this).val())); $('#markdown_preview').html(html); }); //マークダウンをHTMLに変換する var target = $('.item-body') var html = marked(getHtml(target.html())); $('.item-body').html(html); // 比較演算子が < 等になるので置換 function getHtml(html) { html = html.replace(/</g, '<'); html = html.replace(/>/g, '>'); html = html.replace(/&/g, '&'); return html; } }); app.jsに読み込ませる resources/js/app.js require('./markdown.js'); これでこのようにプレビュー表示できるようになります。 また、highlight.jsを使用するとプレビューにハイライトをつけたりおしゃれにすることができるので是非やって見てください。
この記事は私自身のmediumにも記載されています。 Laravel Queue work with supervisor on AWS EC2 1. Supervisorをインストールする Amazon レポジトリーにはsupervisorが入っておりません。 なのでepelレポジトリーを使ってインストールする必要があります。 sudo yum --enablerepo=epel install supervisor 2. supervisorをスタート sudo service supervisord start Redirecting to /bin/systemctl start supervisord.serviceこのメッセージが表示されたらインストール成功です。 3. supervisor設定ファイル修正 supervisorにworkerを追加するため、設定ファイルを修正します。 sudo vi /etc/supervisord.conf 下記を追記しましょう。 [program:worker] command=php /project-home/artisan queue:work process_name=%(program_name)s_%(process_num)02d numprocs=2 autostart=true autorestart=true user=root redirect_stderr=true stdout_logfile=/project-home/storage/logs/worker.log worker.logファイルをログパスに追加することを忘れないでください。 touch /project-home/storage/logs/worker.log 4. supervisor設定ファイルの読み込み 修正された設定ファイルを読み込ませるため、下記コマンドを実行します。 sudo supervisorctl reread 正しく入力したら、このようなメッセージが表示されます。 worker: available 5. supervisor再起動 設定を適用させるためにsupervisorを再起動しましょう。 sudo service supervisord restart workerが動作されているのか確認しましょう。 sudo supervisorctl status 下記のようなメッセージが表示されます。pidとuptimeは私のメッセージと違うはずです。 worker:worker_00 RUNNING pid 1043936, uptime 0:00:10 worker:worker_01 RUNNING pid 1043937, uptime 0:00:10 6. supervisorをインスタート再起動時にスタートするように設定する sudo chkconfig supervisord on 終わり！
参考記事 laravel公式ドキュメント→環境変数 https://readouble.com/laravel/8.x/ja/mix.html 実装方法 google map apiを使いたいけど、keyを丸出しでpushするのはよろしくないと考えました。 まず、.envのファイルに以下のように記述。 MIX_API_KEY=自分のapikey ※先頭にMIXをつけることでjavascriptでも呼び出すことができます。 次に、resourceフォルダのapp.jsファイルに.envで記述したapikeyを呼び出します。 resource/app.js require('./bootstrap'); // Import modules... import { createApp, h } from 'vue'; import { App as InertiaApp, plugin as InertiaPlugin } from '@inertiajs/inertia-vue3'; import { InertiaProgress } from '@inertiajs/progress'; import Icon from './Utils/Icon'; //お気に入り用 import VueGoogleMaps from '@fawmi/vue-google-maps'; const el = document.getElementById('app'); createApp({ render: () => h(InertiaApp, { initialPage: JSON.parse(el.dataset.page), resolveComponent: (name) => require(`./Pages/${name}`).default, }), }) .mixin({ methods: { route, isRoute(...routes){ return routes.some(route => this.route().current(route)); // 投稿取得用 } }}) .use(InertiaPlugin) .use(VueGoogleMaps, { // google map api load: { key: process.env.MIX_API_KEY }, }) .component('icon', Icon) // お気に入り用 .mount(el); InertiaProgress.init({ color: '#4B5563' }); ※私はvue3 google-mapsをインストールしているためこの様になっています。 key:の部分ですが、MIX_API_KEYの先頭にprocess.envをつけることで .envから呼び出すことができます。 また、.envにapikeyを記述しているのでgitignoreされているはずなので あとは普通にプッシュすればオーケーです。 他にも、npmでdotenvをインストールしてやる方法もあったのですが 公式に書いてあるほうが簡単だったのでおすすめです。
