読者です 読者をやめる 読者になる 読者になる

カンボジアで働いている人の備忘録

24歳、なんかカンボジアで起業したみたいです(他人事)

未経験でWEB関連の仕事に取り掛かった - 3日目

昨日はFTPサーバからファイルを取り込むはずが異常に時間が掛かりそうだったので、とりあえずPCを起動しっぱなしで家に帰った。

そして翌朝。どれぐらい進んだかな...まだ終わってねぇ。これはアカン。

予定変更。もそも一回目で気づくべきだったのだが、画像ファイルを取り込まないようにして取り込み直すことに。今回の修正箇所はGoogle Map周り、JavaScriptをいじるだけ。つまり画像ファイルがなくたってプログラムの動作上問題はないはず。

とりあえず「dreamweaver get 画像ファイル 含めない」とかいうワードで検索。お、それっぽいのがヒットした。

Adobe Dreamweaver * サーバーからのファイルの取得とサーバーへのファイルの送信

GETしたくないファイルに対してクロークとかいうのを設定すればいいのか。なるほど。時間の掛かりそうなファイルをクロークにぶち込んで再びGET実行。

...20分ぐらいでGET完了。画像ファイルないだけでこんなに早く終わるとは。最初っからキチンと調べとけば、こんな無駄な時間過ごさなくて済んだのに。まーいいか、勉強勉強。

ローカルで実行できる環境をつくろう

必要なファイルがローカル環境に揃った。さぁお次は...どうすりゃいいの?手元のPHPファイルのソースをいじって動作確認すれば終わりと思ってたんだけど、どうやら実際は違うっぽい。

理屈はよく分からんが、PHPはサーバーサイドで実行される言語だからサーバーを構築する必要があるらしい。なんのこっちゃ。ていうかMySQLとかのデータべースも繋げないといけないんだっけ。何がどう繋がって何から始めたらいいのやら。

悩んだって前に進めないので、とりあえずは「ローカルサーバを立ち上げる」ということを目標に、いろいろググりつつ試してみる。仕組みを理解しようにも知識が足りないだろうから、足りない部分はとにかく勘と推測で埋める方向で行こう。

いろいろ調べた結果、ローカルサーバを立ち上げるというのは「http://localhost/」というページにアクセスできる状態のことを指すらしい。それっぽい解説サイトを参考しながら、MAMPをいじくり回す。何回やってもForbiddenとか404が表示されて心が折れそうになる。

なんやかんやしている内に、MAMPhttpdフォルダがルートフォルダであることに気付く。そこにGETしたファイルをぶち込んで、Dreamweaverの設定を修正。Dreamweaverのライブビューが動作しなかったので、Chromeのアドレスバーに http://localhost/XXXXX/index.php と入力してジャンプ。

やったあああああああページが表示されたあああああああぁぁぁぁ!!!と思ったら、今度は「DBに接続できねーよカス」という別のエラーが。

キチンと表示されるのはまだまだ先か。クソ。それでも一歩前進したからまぁいいか。

データベースに接続しよう

さて、これもどうすればいいのかさっぱり分からん。とりあえず「DreamweaverCC2015 データベース」とかでググってみたが...欲しい情報が出てこない 。Dreamweaverには標準でデータベースに接続するためのアドオンがあるらしいのに、最新版ではそれが存在しないとか。マジで?どうすんのこれ。

何だか煮詰まってきたので方向転換。「PHP MySQL 接続」というキーワードで検索。どうやらどっかのタイミングで接続文字列を飛ばして、それが問題なければデータベースに接続できるらしい。該当するPHPソースコードを探す。見つけた。逆に言えば、この接続文字列が成立するようにデータベースを用意してあげれば動くんじゃね?と考えてみる。

手順を一つ一つこなす。まずMAMPのサーバーを起動すると、そこのスタートサイトにphpMyAdminのリンクがある。本番環境からデータをエクスポートし、ローカルサーバに通じているphpMyAdminにインポート。ユーザーも本番環境と同じように設定。そしてサーバーを起動。どうだ。

...あ、本番サイトと同じように表示された。

f:id:wn_trinity:20160305013005j:plain

喜びよりも先に、大きなため息が出る。やっとかよ。長ぇよ。独学で全部やれてる人たち頭おかしいよ(暴論)

PHPソースを改修しよう

やっとここまで来れたが、まだ始まってすらいない。こっから本番。と言っても、それほど難易度は高くないはず。Gmap3のデモサイトのソースをコピペするだけでいいはずだし。

demo : Demonstration uses jquery gmap3

...が、シンタックスエラーが表示される。は?

content: "<div class='cluster cluster-1'>CLUSTER_COUNT</div>",

どうやらこのHTMLタグのクォーテーションが悪さしているらしい。サンプルでエラーが出るって何なんだよちくしょう。とにかくエラーを消さないと。

content: '<div class=\'cluster cluster-1\'>CLUSTER_COUNT</div>',

いろいろ試した結果、以下の2点が引っかかってたっぽい。
* シングルクォーテーションとダブルクォーテーションの混在
* エスケープシーケンスの抜け

これで実行してみたところ、エラーが消えてGoogle Mapにクラスター化が適用された。あぁ疲れた。

Google Map マーカークラスター化の調整をしよう

一応クラスター化は適用したが、設定値がおかしいのか逆にマップが見づらいという状態に。

Gmap3のドキュメントを見ても各パラメータの説明が載っていなかったので、値の変更→マップ確認という数打ちゃ当たる作戦でいくしかなさそう。

今日はこれでタイムアップ。明日は昼過ぎまでプノンペンお掃除イベントに参加してくるので、あんまり作業は進まなさそうだなぁ。