• 初歩的な話で申し訳ないです。
    ページアクセス時に、PHPでデータベースに接続し、データベースの内容をforEachでliタグで10件分生成したとします。

    そこに、「もっと見るボタン」でページ移動させずに非同期処理でさらにデータを取得したいと思うのですが、
    この場合は、サーバーを介さないわけですから、JSでPHPのforEachに代わる処理を書かないといけないのでしょうか?
    例えばJSのforeachとinnerHTMLなどを駆使して、DOMに挿入(生成)するのでしょうか?

    データベースに接続して、HTMLを生成する。という同じ機能なのにPHPとJSで言語が異なるのがムズムズしてしまい質問に至りました。普通ならそれで良いのですが、、
返信の受付は終了いたしました。
  • 同じ処理を両方で書きたくないなら、例えばphpの方だけでhtmlを生成するように決めておいて、jsではその出力をappendするだけにする。
    liタグの場合はまとめて挿入できないからforeachするしか無いかもしれないけど。

    それかそういった動的な部分が多いサイトでは、逆にphp(サーバー側)はjsonを出力するだけにして、js(フロント側)でvueとかreactってライブラリを使ってhtmlを生成するのが最近の流れ。

    どちらにしてもhtmlを生成するのをどちらかに統一したほうが良いね。
  • 返信先: @FYYH7/さん 拙い文章にここまで丁寧にありがとうございます。
    統一の旨、了解しました。

    >>逆にphp(サーバー側)はjsonを出力するだけにして、js(フロント側)でvueとかreactってライブラリを使ってhtmlを生成するのが最近の流れ。

    こちらについてですが、
    qiita.com/minato-naka/items/9241d9c7a7433985056d
    上記のようなフロー図がイメージでしょうか?
  • 理由は長くなるから説明しないけど、サーバーサイドで出力したhtmlをjs介して非同期で受け取るのはセキュリティの観点からやらない方がいいよ。
    既に出てるけど、phpはjsonを出力して、jsでそれをhtmlに変換するのが一般的。
    jsにはいろいろフレームワークがあるけれど、例の範囲の要件なら、フレームワークは全然いらない。むしろ、フレームワークは冗長すぎる。JSに関しては、このあたりのキーワードを調べれば解決できるよ。

    ・Fetch
    ・テンプレートリテラル
  • 返信先: @WNvONjさん ありがとうございます。
    ごちゃごちゃいじってる内にセキュリティ大丈夫なんだろうか?と気になっていたので、ハッキリ辞めた方がいいと言っていただけて助かります。
    頂いたキーワードでもっと知見深めていきます。
  • 返信先: @9UYyY0さん テンプレートリテラルがなかった頃はHandlebars.js使っていました。
    フレームワーク使わない場合のviewとの分離で結構便利でしたよ、まぁ今はあまり使いませんが...
  • 返信先: @9UYyY0さん そんな感じだね
  • この場合なら、めんどくさいから初期表示の10件?についてもJSで取得してHTML生成する設計にするかな