以下のファイルを直接編集する！

C:\Users\ユーザ名\AppData\Local\Atlassian\SourceTree\bookmarks.xml

※注意
もしかするとSSHキーとの関連が切れて、つなぐときに改めてSSHキーの場所を指定してあげないといけないかも

1. xampp/mysql/data フォルダを _data にリネーム
2. xampp/mysql/backup フォルダを中身ごとコピーして data にリネーム
3. _data の ibdata1 ファイルを data に持ってきて上書き
4. xampp を起動してMySQLが動くか確認
5. OKなら _data の自作データのみを data に移動
6. rootのパスワードが初期化（＝未設定）されてるので xampp 右部の shell で「mysqladmin -u root password」とコマンド打ってパスを設定
7. PHPMyAdmin にアクセスして問題ないか確認

1. インストール

$ composer create-project laravel/laravel --prefer-dist _laravel // prefer-dist = zipでダウンロードする。こっちのほうが高速

// 以下、忘れる前に作業用のルートディレクトリに移動
$ cd _laravel

2. .env ファイルと /config/ 以下を修正

// .env
**どっか既存のプロジェクトから転写 + 適宜改修**

// /config/app.php
'timezone' => 'Asia/Tokyo',
'locale' => 'ja',
'faker_locale' => 'ja_JP',

// /config/database.php
'collation' => 'utf8mb4_general_ci',

3. 公開フォルダ用のシンボリックリンクを設定

$ php artisan storage:link

4. (必要により) マイグレーション時に不要な personal_access_tokens_table の生成をやめる

// /app/Providers/AppServiceProvider.php
public function register()
{
    \Laravel\Sanctum\Sanctum::ignoreMigrations();
}

5. デバッグ用の telescope をインストール

$ composer require laravel/telescope
$ php artisan telescope:install
// ツールバーもインストール
$ composer require fruitcake/laravel-telescope-toolbar --dev

6. (必要により) 会員認証用の Laravel Breeze インストール

$ composer require laravel/breeze --dev
$ php artisan breeze:install
$ npm install

// 日本語化
$ composer require askdkc/breezejp --dev

// 使用時は以下コマンド
$ npm run dev

7. 確認のためサーバー立ててアクセス

$ php artisan serve

8. DB設計し終わったらマイグレーション

// DB生成 + シーダー挿入
$ php artisan migrate
$ php artisan db:seed

気が付けば2児の父（4歳・1歳）となった訳ですが、仕事柄けっこう育児に集中できるタイミングも多くて、緑色のうんちが茶色くなっていくさまや、ことばが見つからず癇癪を起こすさまや、ファンターネ全然しっくりきてないさまなど、いろいろ楽しませて＆苦しませてもらっています。

そんな楽しくも過酷な育児のなかで、うちの上の子の特性みたいなところで「文章や口頭で説明しても、いまいち頭に入ってこない」みたいなことがちょこちょこあって。

その代わりというか、歌が好きな子でいろんな歌をYouTubeや保育園やらで覚えては口ずさんでて、手を洗うときに手洗いの歌とか歌いながら一生懸命ゴシゴシしてるのを見て、もしかしてと思ってその日の夜の歯磨きの時、渋ってるところにYouTubeの歯みがきソングを見せたところ、一気にやる気になって歯磨きさせてくれたのです！

そういや保育園でも、ことばで説明するのと同時にイラストカードとか使って時間割とか伝えると、先が見通せるようになって不安がちな子もスムーズに動けるみたいな話を聞いたことがあるし、よっしゃお得意のリカテゴライズサービス作ったるでぇ！という流れで作成したのが、今回のウェブサービス「ウタミテ」です。

歌で生活習慣を身につける、育児サポートサイト「ウタミテ」

かなり久しぶりにイチから新規サービス作ったので、まさかPR TIMESに無料枠が無くなってるとは露知らず、めっちゃ頑張ってプレスリリース文を作っちゃいました。。。

このままお蔵入りにしちゃうのもアレなので、以下にプレスリリース全文掲載しておきます。

もし何かご入用でしたらご一報くださーい！

プレスリリース全文

＜報道関係者各位＞
プレスリリース
　　　　　　　　　　　　　　　　　　　　　２０２２年６月２７日
　　　　　　　　　　　　　　　　　　　　　　株式会社キキバーブ

==============================================================

　　　　　文章や口頭では伝わりにくいこどものために
　　　　　さまざまな生活習慣・決まりごとに関する
　　　　　「歌」の動画を集めた育児サポートサイト
　　　　　『ウタミテ』サービス開始のお知らせ

==============================================================

サイト制作やウェブサービス企画開発などを行う株式会社キキバーブ
（所在地：東京都 調布市、代表取締役：清水 健一）は、文章や口頭
では伝わりにくい特性を持つこどものために、さまざまな生活習慣や
決まりごとに関する「歌」の動画を集めた無料の育児サポートサイト
「ウタミテ」を6月16日にオープン致しました。

ウタミテ - 歌で身につける生活習慣
[URL] https://utamite.com/

■■ 制作の背景 ■■
こどもの中には、文章や口頭での説明だけでは意図が伝わりにくく
内容を汲み取りづらいという特性を持つ子がいます。

そのような特性を持つ子たちに対しては、イラストを使った説明や
実際の写真を見せながら教えるなどといった、視覚情報も活用した
教育が有効とされており、保育の現場でもイラストカードを使って
こどもたちに生活習慣や決まり事を教えたりしています。

また、コロナ禍においてこどもたちへの手洗いを推進するために、
かわいらしいアニメーションを用いた「手洗いのうた」であったり
順番を守る・あいさつをする・早寝早起きなど社会生活のルールに
ついても、動画サイトにはたくさんのこども向け動画が掲載されて
います。

ただそれらはあくまで動画サイト内の大量にあるコンテンツの中の
一つであり、必要な時にすぐ呼び出せるほどしっかりカテゴライズ
された状態であるとは言い難いのが現状です。

■■ サービス概要 ■■
『ウタミテ』は、YouTubeに掲載されているさまざまな生活習慣や
決まりごとに関する「歌」の動画を集めてカテゴライズした無料の
育児サポートサイトです。
子育てにおける様々な場面（歯みがき、手洗い、お風呂など）や、
ルールとして伝えたいこと（行儀、あいさつ、おかたづけなど）に
関する動画を、それぞれカテゴライズしてリスト化しました。

ひとつのカテゴリーにつき複数の動画をリストアップしているので
こどもがより興味を持つ動画を選ぶことが出来ます。

また、気に入った動画を後日また探すことなく再閲覧できるように
「お気に入り」として保存する機能を、会員登録の必要なく誰でも
すぐにご利用いただけます。

■■ サービス開始日 ■■
2022年6月27日

■■ スクリーンショット ■■
[トップページ] https://utamite.com/for_media/img/top_pc.png
[スマートフォン] https://utamite.com/for_media/img/top_sp.png

───────────────────────────────

＜ 本件についてのお問い合わせ先 ＞
株式会社キキバーブ
[URL] https://www.kiki-verb.com/
[MAIL] [email protected]
[担当] 清水

ウタミテ - 歌で身につける生活習慣

cd インストール先のディレクトリのひとつ上の階層
wget https://ja.wordpress.org/latest-ja.tar.gz --no-check-certificate
tar -zxvf latest-ja.tar.gz
rm -rf latest-ja.tar.gz

そうすると wordpress ってフォルダができてるのでリネームするなりそのまま使うなり。

Virtual Boxがエラーで動かなくなり、とはいえステータスは起動中のまま、止めも消しもできない場合の緊急停止コマンド

VBoxManage.exe startvm tabeloop_dev_default_1583414934558_88045 --type emergencystop

コマンドプロンプト立ち上げて下記

cd 対象のフォルダのパス && del /s /q /f /a .DS_STORE

気が付けばちゃんとした記事を丸2年以上も書いてないという体たらくですが、「便りがないのは元気な証拠」とばかりにわりかし元気にやっております。

さて、2011年に公開して2013年にリニューアルした、ご近所のフリーランス仲間を探せるっつーコンセプトの個人開発ウェブサービス「フリーランサーズ パーク」ですが、実はここ1年ほどソーシャルログインの調子が悪くて新規登録を停止してたんですね。

でも結構思い入れのあるサービスだったし、ちょうど Laravel を使ったウェブサービスの制作事例も欲しいと思っていたので、じっくり半年ほどかけてデザインから一新のリニューアルを行いました！

作り直すついでに、今までは「人を探す」くらいの機能しかなかったのを、「気になるユーザーに声をかける」「制作実績を発表する」「助けてほしい！とか手伝って！みたいなリクエストを掲載する」みたいな機能を追加実装して、よりコミュニケーションが築けるようなサービスを目指しました。

イマドキなら note や Qiita や Zenn なんかに投稿するような制作よもやま話を、昔ながらの WordPress 製の自サイトで公開する伝統芸。とくとご覧ください！

ご近所のフリーランス仲間を探せるウェブサービス「フリーランサーズ パーク」

「フリーランサーズ パーク」とは

ご存じ無い方も多いと思いますので、改めてこの「フリーランサーズ パーク」は、ご近所で頑張っているフリーランサー同士を結ぶ、仲間探しサービスでございます♪

あなたの郵便番号やスキルなどをご登録していただくと、「フリーランサーズ パーク」に組み込んだ Google Map 上に反映されるようになり、ご近所のフリーランサーを見つけられるという仕組みとなっています。

なお、「ご近所」とはいっても、厳密にご住所を記入していただく訳でもなく、各種アカウントから勝手に取得する訳でもなく、ただ単にご登録いただいた「郵便番号」からおおまかな緯度と経度を取得して、そこにランダムな数値を入れてバラけさせているだけなので、ご安心ください☆

具体的には、まず Google Maps API で郵便番号からのジオコーディング（住所や郵便番号などから、緯度と経度を取得するコト）を行っています。

で、コレだけだと同じ郵便番号の人は全く同じ緯度経度で登録されてしまい、地図上でマーカーが重なってしまうので、取得した緯度経度にランダムの値を付加して、なんとなーくバラけて見えるようにしている、という算段です。

住所情報が郵便番号だけなので、精密さには欠けますが、住所を特定される訳ではないので、安心してご利用くださいまし m(_ _)m

技術詳細

フレームワークに Laravel 7 を利用したので、自ずとその範囲内での話が中心にはなりますが。

以下はちょっとしたハマりどころだったり、結構時間がかかった点を備忘録がてらピックアップしたいと思います。

Bladeのレイアウト定義周り

凝り固まりまくった WordPress 脳では、しばらく Blade の extend の概念を理解するのに時間がかかりました。。

あと、もともと素の PHP ばっかり書いててテンプレートエンジン使う習慣があまりないので、ループとか条件式にわざわざ新しく Blade の書式を覚えるのがちょっとめんどくさいなーとも。

次に Laravel 使うときは、もしかしたら Blade は使わない方向で考えるかもです。

Google map API 及び Geocoding API の初期設定

ユーザーから受け取った郵便番号から住所を取得し、その住所の緯度経度をもとに地図上にユーザー情報を載せるというコンテンツが有るのですが、住所周りの処理には Google Geocoding API を、地図表示周りの処理には Google map API 使用しています。

当サービス立ち上げ当時はどちらも無料かつユーザー登録等の必要なく使用できたのですが、いまではユーザー登録の上いろんな初期設置をしないといけなくて、それが例のごとく Google の意味わからんヘルプやガイドラインに振り回されて、地味に時間を食いました。

API を叩く回数の上限設定や、使う IP の設定など、面倒でも忘れないようにしましょう！

Geocoding API のエラー処理

前述の住所周りの API は入力値に不備があったり通信に問題があったときなどそれなりエラーを返してくれるんですが、情報保存時の処理の流れが RegisterController の function register() のなかでバリデート→保存の流れになってて、それがそれぞれ別のメソッドになってるんですね。

それぞれ別なんですが、その都度 API 叩いてたら回数もったいないし、そもそも一回目の通信で問題なかったからと言って直後の通信が問題ない確証にもならないので、最初に API から得た情報をどうにかしてバリデートや保存の処理にも使い回したいんだけど、さてどうしたもんか。。

いろいろ調べた結果、一番シンプルな「初回の結果をセッションに保存して、それを使い回す」という方法で落ち着きました。

config/app.php に設定した日本語文字列が状況次第で読み込まれない or 文字化ける

これ、結局なんだったんだろうか。。

ローカル環境では問題なく日本語表記されてたんですが、本番環境にデプロイしたところ部分的に日本語の定数が読み込まれない（空文字になる）という現象に見舞われました。

また、メールの from 文の箇所ではそれが文字化けの症状になって現れて、キャッシュクリアしようが何しようが状況変わらず。。

幸い日本語で定数設定したのはサイト名くらいだったので、仕方ないから使用箇所にサイト名ベタ書きで対応しました。

本番環境への移行

上記を始め、本番にデータ持ってってから丸一日くらいあーだこーだ不具合が散見されてました。

Laravel インストールしたディレクトリにシンボリックリンクや .htaccess の設定をしてもなんかうまく行かなかったり（これはインストールするディレクトリの場所自体が間違ってた）、ユーザー登録やお問い合わせなどの「メールが送られる処理」でなぜかエラーが発生したり（よく調べたらエックスサーバーのメール設定の記述内容が間違ってた）、シンボリックリンク張ったのに strage の中に画像が保存されなかったり（一度既存のディレクトリを削除して新しく strage ディレクトリを生成→シンボリックリンク設定したら回復）、、、

こうやってまとめてみると、全部ただの凡ミスですね。。。

とまーそんな感じで新生「フリーランサーズ パーク」、ぜひお楽しみくださいっ！

フリーランサーズ パーク

// httpd-xampp.conf 削除
del D:\xampp\apache\conf\extra\httpd-xampp.conf

// phpディレクトリ 削除
rmdir D:\xampp\php

// httpd-xampp.conf 生成（バージョン名を記述）
mklink D:\xampp\apache\conf\extra\httpd-xampp.conf D:\xampp\apache\conf\extra\httpd-xampp.745.conf

// phpディレクトリ 生成（バージョン名を記述）
mklink /D D:\xampp\php D:\xampp\php-7.4.5

バージョンを指定してcomposerインストール

$ composer create-project laravel/laravel=6.* プロジェクト名

laravel-mix がエラーのときの追加インストール

$ npm install laravel-mix cross-env node-sass --save-dev

REST API用の Model と　Controller を一気に作る

$ php artisan make:model Banana -mcr

キャッシュクリア

$ php artisan cache:clear && php artisan config:clear && php artisan config:cache && php artisan route:clear && php artisan view:clear && php artisan clear-compiled && php artisan optimize

Laravel 6.x 系で Vue.js を利用する

$ composer update // 念の為
$ composer require laravel/ui:^1.0 --dev
$ php artisan ui vue
$ npm install && npm run dev

db:seed すると does not exist エラーが出る場合の解消法

$ composer dump-autoload

一旦全テーブルをdropしてからテーブル再構築＆seeder実行

$ php artisan migrate:fresh --seed