W jaki sposób najlepiej pobrać itemy z bazy na stronę?

Question

Witam, mam w bazie tabelę "turnieje" - zdjęcie, nazwa, data, ilość osób, cena, nagroda.

Mam też na stronie podstronę turnieje, gdzie chcę, żeby pobierały się wszystkie turnieje i były wyświetlone.

I teraz kilka pytań.

1. Skoro są zdjęcia to chyba najlepiej byłoby to zrobić asynchronicznie, a może poprostu mogę umieścić ten kod gdzieś na końcu, dzięki czemu załadowanie tych itemów zacznie sie robić dopiero jak wczyta się strona?

2. Min-height panelu do wyświetlania jest 200px. Czy jeśli zaczną się one wczytywać w to miejsce i zaczną przekraczać 200px to height zacznie się zwiększać, czy ze względu na to, że byłoby to asynchronicznie, height się nie zwiększy, bo już za późno.

3. W jaki sposób najlepiej to zrobić, nakierowanie jak to mniej więcej powinno wszystko wyglądać.

Używam, html,css,js i w backendzie nodejs

Comments

Jak zapisujesz zdjęcia? W bazie danych? Czy może w bazie danych masz tylko url do zdjęcia ? :)

Answer 1

Osobiście proponuję jeżeli są one zapisane w postaci URL, po prostu wypisać je w znacznikach <img/> i w src umieścić ich źródło (no chyba że inaczej zapisujesz zdjęcia). Ja użyłbym do tego połączenia PHP -> DBMS ale nie wiem czy znasz PHP.

<?php
// podłączenie bazy danych przez PDO lub MySQLi, ja użyję MySQLi

$polaczenie = new mysqli($host, $user, $pass, $dbname);

$rezultat = $polaczenie->query("SELECT [...] FROM [...] WHERE [...]");

$ile = $rezultat->num_rows;

//wypisanie danych

for($i = 0; $i<$ile; $i++)
{
$row = $rezultat->fetch_assoc();
$source = $row['...'];

echo "<img src=\"".$source."\" />";
}
$rezultat->free_result();
$polaczenie->close();

Kod powyżej powinien (jeżeli nie popełniłem żadnego błędu) wypisać wszystkie zdjęcia i zamieścić je na stronie. Nie sprawdzałem sprawności ale pewnie miałeś styczność z PHP więc jak coś to sam poprawisz. W miejscach trzech kropek bądź [...] musisz wstawić swoje dane dot. bazy itd.

Jeżeli chodzi o asynchroniczność to wystarczy że np. na początku kodu wpiszesz żeby wstrzymał się na chwilę (sleep(int seconds)). Ewentualnie mógłbyś się pokusić o zamieszczenie kodu w osobnym pojemniku i tam sprawić by JS poczekał na załadowanie dokumentu, chociaż uważam że to już udziwnianie kodu. 

Jeżeli chodzi o wysokość panelu to nie powinno być problemu, bo pamiętajmy że interpreter czyta stronę linijka po linijce więc kod CSS będzie przeczytany pierwszy (jeżeli leży na górze strony).

Mam nadzieję że pomogłem. W razie pytań - pytaj!