«« 今だからこそアナログテレビを復刻して、平成初期っぽさを満喫するには | 「心が叫びたがっているんだ。」は、冒頭に主人公の父親がきちんと謝っておけばもっと話はすっきりしていた?(ネタバレ) »»

HTML+Ajax←→PHPなWebアプリを効率よく組むにはどうすれば良い?

2015年9月12日

このエントリーをはてなブックマークに追加 Clip to Evernote
デザイナが作成したHTMLファイルをそのまんま使ってApacheのhttpdocs/httpsdocs上に配置して動作するWebアプリを組みたいが、試行錯誤中。


PHPは、HTML内へ直接プログラムが記載でき、設定によっては実行したらすぐブラウザー上にエラーが表示されるのが好き!

最初に自分が触れたウェブサーバー上で動くスクリプト言語はPerl。
でも、(大昔の話で、今では頓珍漢な話ならすみません)Perlはブラウザーから動作させてみた時に、エラーの出そうなところに print "Content-type: text/html"; とか書かないと、無愛想なCGIエラーが発生して何のことやらサッパリわからない。
当時そんな面倒くさい仕組みにウンザリしていた自分の心をバッチリ捉えました。

しかしーHTML内にPHPのソースコードを直接入れる作り方というのは、プログラマがデザイナーが上げたデザインを受け取った後、その都度サーバーと連動するコードを差し込んだりとかカスタマイズする必要があるわけで。
プログラマはそうなるとどこからがシステム部分で、どこからがデザイン部分なのか?という作業も含めて格闘することになり、ボトルネックとなって作業量が飛躍的に増加します。

このようなシステムの例として具体的には、(ファンの人すみません) OSCommerce などが挙げられますでしょうか。
※このブログを書くにあたって久々にソースコードを落としてきましたが、2015年9月現在もHTMLとPHPが混在しているのは相変わらずのようでー関係者に合掌。

やっぱソースコードとシステムは分離しせにゃならんよね。
ということで、ウェブアプリを組む際、PHP+Smartyでテンプレートを組み、一部に動的な部分をJavaScript(jQueryを多分に含む)で構築するやり方があります。

しかし自分は、これまた組んでいてしっくり来ない。
これってPerlにHTML::Templateモジュールを組み込んで構築するのとーエラー表示をさせるのに print "Content-type: text/html"; とか書かないで良いだけマシですが、なんか時代が巻き戻ったような?

そう!Smartyがないと、テンプレートだけでHTMLが表示できないのが気に入らない!
しかも動作するにはテンプレートフォルダーに入れる必要があるため、パスが変わってしまうのがイラッとする。
ですので、Smartyがない状態でページを作っていた場合、毎回Smartyのテンプレートとして使えるようパスを書き直すのが嫌だった。
あとSmartyも条件分岐を書きまくると、テンプレートの拡張子をhtmlに直して、単体としてブラウザーから見た時も、ソースがわけわからんようになって結局プログラマがメンテナンスすることになるのも無様で嫌だった。

ですので、Smartyは止め、デザイナが作成したHTMLファイルをそのまんま使ってApacheのhttpdocs/httpsdocs上に配置したい。
制御類は、その上で表面上は全部JavaScriptで制御させて、データベースなどとアクセスする必要がある時はjQueryでいうところの $.ajax() を活用して表示を直す仕組みにしたい!

ということで空き時間を使って、そういう仕組みなウェブアプリの作り方を試行錯誤しています。
しかし、どうもこんな書き方しかできない自分が物足りない。

例えば、自分的に今までのテンプレートシステムを塗り替えそう?で有力株だったAngularJSなんですが、自分の勉強が不足しているせいでうまく使いこなせない。

具体的には、ウェブアプリ内をクリック(タッチ)した後
→画面を遷移せずにサーバーへアクセスして
→リアクションのJSONファイルを受け取ったら
→その値を元にリロードせずに画面の内容を書き換える
...というやり方がよくわからない。

そのやり方について調べているよりも、とりあえず $("セレクター").html("修正内容");でしのいだほうが速い!と思って調べるのは後回し対処しています。
しかし、そうするとなんかJavaScriptのコードが長くなってわかりにくくなるんだよなあ。

JavaScriptを制御のメインとしたい自分の中で開発中のWebアプリ

うーん、もうちょっと良いコードをサクサク書きたい!

AngularJS アプリケーションプログラミング
技術評論社 (2015-08-19)
売り上げランキング: 3,358

↑いつものごとく、読んでないながらも良さげな本を選んでみました、実際のところはどうなのか気になります!


投稿者 kuze : 2015年9月12日 23:30


■このエントリーに関連した記事

■「実用ソフト&サイト」カテゴリの最新記事

«« 今だからこそアナログテレビを復刻して、平成初期っぽさを満喫するには | 「心が叫びたがっているんだ。」は、冒頭に主人公の父親がきちんと謝っておけばもっと話はすっきりしていた?(ネタバレ) »»


自己紹介
PHPやVBによるコーディングやシステムエンジニアを仕事にしています。
主にiPhoneアプリの紹介やWeb開発などのPC系の話題と、アニメやゲームなどのサブカルな話題を取り扱っています。

[PR]

Twitter
>> その他のtwitter

instagram

カテゴリ

最近のエントリー

最近掲載した画像
  • バーチャルYouTuberのキズナアイちゃんがどうやって動いているのか気になる
  • ニトリで購入した『ひじまでフラットになる座椅子「テリーGY」』は、手すりがやっぱりイイ
  • ニトリで購入した『ひじまでフラットになる座椅子「テリーGY」』は、手すりがやっぱりイイ
  • ニトリで購入した『ひじまでフラットになる座椅子「テリーGY」』は、手すりがやっぱりイイ
  • 音の正規化(ノーマライズ)は、無料でこなそうとしたら未だ面倒
  • Panasonicの冷蔵庫「NR-B149W-S」で静音を取り戻した!
  • クラタスvsメガボッツ戦見たけど、現実世界巨大ホビーロボについては日本文化じゃなくなるかも(ネタばれ)
  • (現在作業中)ブログをレスポンシブデザインに適応させるためにしていること
  • (現在作業中)ブログをレスポンシブデザインに適応させるためにしていること
  • (現在作業中)ブログをレスポンシブデザインに適応させるためにしていること
  • アパートの鍵穴が壊れたら、鍵屋を呼ばずに不動産屋を呼ぶべき
  • アパートの鍵穴が壊れたら、鍵屋を呼ばずに不動産屋を呼ぶべき

RSS
更新情報はRSSをご利用下さい
サイトマップ