HTML połączony z JS, PHP i SQL- Tworzenie całych aplikacji

Question

Cześć,

jak to jest, jak się już stworzy całą strukturę strony w HTML, żeby ona działa z JS, PHP i SQLem?
Chodzi mi o ogół, żeby zrozumieć jak to wszystko działa, nie o konkretne linijki kodu.

Załóżmy, że chce zarezerwować  film w kinie na konkretną godzinę. np 12:00.
Tworzę ten przycisk w HTML w index.html/index.php. Potem mam style.css i tam tworzę wygląd tego przycisku i co dalej? mam jeszcze pliki plik.js plik.php i w każdym z nich odwołuje się do tego przycisku? W pliku js robię onClick, a dalej jeszcze tworzę bazę danych i jakoś go łączę w z tym przyciskiem? Żeby po kliknięciu w niego przeniosło mnie do strony z wyborem miejsc i jeszcze żeby mi od razu zaczytało z bazy, które miejsca są wolne?
 

W każdym z tych pików odwołuję się do tego przycisku za pomocą jego ID ?
Jakieś to wszystko skomplikowane, tak to właśnie wygląda? Czy coś sobie wymyślam?  Bo raczej nie robi się tego wszystkiego w pliku głównym, to dopiero byłby bałagan
Oczywiście przycisk to tylko przykład, można pod to podstawić cokolwiek innego.

(Zdaję sobie sprawę z tego, że tym nie zajmuje się jedna osoba i że dzieli się to na front-end i back-end, ale i tak ciekawie mnie jak wygląda cały ten proces...część procesu.)

Dzięki za odpowiedzi i proszę o wyrozumiałość. Dla mnie to wszystko to jakaś abstrakcja, a bardzo mnie to interesuje

Answer 1

W html tworzysz formularz np z tym przyciskiem, w css i js określasz jego wygląd (tu się odwołujesz do id lub klasy), następnie formularz przesyłasz do pliku php metodą "POST" (dla ukrytych danych) lub "GET" (dla danych widocznych w adresie [np: example.com/plik.php?pole1=sadas]). PHP interpretuje konkretne pola za pomocą wartości "name" wstawionych w html i na ich podstawie jest w stanie wygenerować już gotową odpowiedź w formie html.

Dajmy na to konkretniejszy przykład (pomijając CSS i JS bo one są głównie od front-endu):

Gdy w formularzu HTML jest input  

<input type="text" name="imie">

po wysłaniu formularza php może odwoływać się do zawartości poprzez

$_POST['imie'] lub $_GET['imie'] (zależnie jaka metoda została ustalona w formularzu).

I w tym momencie php obsługuje całe połączenie z bazą danych i może wygenerować już konkretną odpowiedź.

Starałem się dość jasno to opisać. Jeśli chodzi o php to możesz pytać śmiało, css i html również się postaram.

Comments

Super, dzięki bardzo.
A to, że te informacje zapisują się w bazie danych i odwrotnie (są sczytywane z bazy) dzieje się za sprawą php czy sql ?

---

Witam,

SQL to tylko język zapytań (queries) do bazy danych. Można wykonać takie zapytanie z poziomu PHP, który jest w stanie połączyć się z bazą, a następnie wykonać zapytanie.

Answer 2

Po pierwsze łatwiej to trochę zrozumieć dzieląc aplikację na dwie części. De facto tak jest - nawet odpalając stworzoną lokalnie aplikację uruchamiasz np NPM (frontend) i MVN (backend).

Jak najczęściej bywa, część front (czyli komunikacja z przeglądarką/aplikacją - użytkownikiem + wygląd) to osobna aplikacja, skupiająca się na manipulacji danymi, które wprowadza/zmienia użytkownik. Ta część aplikacji zbiera info i wysyła do back endu za pomocą requestów.

Back end to druga aplikacja, która zajmuje się głównie komunikacją z bazą danych. Może także odbierać informacje, które zebrał frontend. Warto tutaj obrabiać dane, zabezpieczać aplikację (co można dodatkowo zrobić na froncie), przypisywać wartości z baz danych itp. Tutaj najczęściej np Java nie tylko posługuje się swoim językiem, ale w przypadku pobrania czegoś z bazy musi posilić się SQL'em.

Przykład:

js'em wysyłamy requesta metodą "POST" dla URL: "zaloguj" wraz z parametrami name i pass. Backend url ten ma zdefiniowany i tam dla VALUE= "zaloguj" sprawdzamy sobie za pomocą SQL'a czy takie dane (name i pass) istnieją na bazie.
 

Mam nadzieję, że też pomogłem :P