Kurs tworzenia stron www dla początkujących - CSS, HTML, PHP, MySQL, JavaScript

Autor:admin| Poniedziałek, 20 lutego 2012 rok, godzina 20:26 | Czytany 97269 razy

Właściwie to kurs tworzenia stron to za dużo powiedziane, ale przedstawię w tym artykule podstawowe, przydatne informacje dla osób chcących zacząć przygodę z tworzeniem stron internetowych.
Osoby, które projektują strony www stosunkowo niedługi lub po prostu nie czują się w tym dobre, też znajdą tu informację czy czasem nie idą w złym kierunku.

http://webfly.pl/images/upload/2012_5/2k554e34df80.jpg

Na samym początku warto poznać same podstawy, czyli jaki język do czego służy (a raczej do czego powinien.. bo wiadomo, że Polak potrafi i jak zechce będzie serfował na desce od prasowania).

HTML

HTML służy do tworzenia szkieletu strony - warstwy logicznej (nagłówek, menu, stopka, treść, akapit itp) - nie powinno używać się HTML'a do kształtowania wyglądu strony, czyli kolorów tła, kroju czcionki, wymiarów czegokolwiek (bloków tekstu, czcionki, nagłówka itp). Należy sobie wbić raz na zawsze: HTML odpowiada za podział treści strony w logiczne części.

CSS

Kaskadowe arkusze stylu, czyli CSS służą do kształtowania wyglądu naszej strony. Czyli stworzyliśmy za pomocą HTML'a szkielet strony (nagłówek, menu, blok tekstu głównego, stopkę itp) i teraz za pomocą CSS możemy wywrzeć wpływ na wygląd tych elementów, czyli wielkość, marginesy, ułożenie (relacje między sobą) kolor itp. CSS możemy dołączyć (w zasadzie powinniśmy tak robić) do zewnętrznego pliku. Wskazywanie za pomocą CSS na konkretne elementy znaczników HTML'a odbywa się za pomocą klas (class="nazwa") i identyfikatorów (id="nazwa").

HTML i CSS służy do wykonywania stron statycznych. Jeżeli chcemy mieć stronę dynamiczną (CMS, forum, portal itp) z pomocą przychodzi nam PHP.

PHP

PHP jest to język programowania zbliżony do C/C++ działający po stronie serwera (czyli na naszym hostingu). Wg. mnie jest dość prosty, prostszy niż C/C++ (dlatego, że jego składnia jest znacznie uproszczona, np brak deklaracji zmiennych oraz posiada bardzo pokaźną bazę wbudowanych funkcji) niektórzy twierdzą, że przez takie uproszczenie łatwiej się programuje i łatwiej się popełnia błędy - być może to prawda, mi ciężko to ocenić (raczej koduje tylko w PHP).
Do czego nam się przyda PHP? Jeżeli chcemy stworzyć dynamiczną stronę, to piszemy skrypt właśnie w PHP, który np. "skleja" nam nagłówek, menu, treść i stopkę. W zależności od wyboru w menu skrypt doklei nam właściwą treść do nagłówka menu i stopki. To taki najprostszy przykład.
Warto dodać (dla tych zielonych zwłaszcza), że PHP na serwerze generuje kod HTML i wysyła go do przeglądarki. Tak więc nie da się podejrzeć kodu PHP jakiejś strony, zobaczymy tylko efekt tego skryptu, czyli wspomniany wygenerowany kod HTML. Dodatkowo wniosek z tego nasuwa się oczywisty - PHP jest generatorem HTML'a, w związku z tym sam w sobie nie służy do tworzenia stron i aby z niego zrobić użytek trzeba znać się na HTML'u.

MySQL

MySQL to rodzaj bazy danych SQL - jeden z najpopularniejszych (m.in. stosowany prze zemnie ;) ). Baza danych przychodzi nam z pomocą jeżeli mamy dość obszerną stronę, która cały czas się rozwija - przybywa jej treści. Czyli jest to np. forum, portal, blog itp. MySQL jest oparty na zapytaniach SQL (podobnie jak MS Access). Wszelkie dane MySQL możemy przedstawić właśnie w takich zapytaniach. Ale sama baza nam nic nie da. Aby korzystać z MySQL trzeba także korzystać z PHP. Za pomocą PHP łączymy się z naszą bazą danych, wysyłamy do niej zapytanie (np. "pobierz listę userów" - "SELECT * FROM tabela_userzy") pobieramy odpowiedź w postaci tablicy PHP i robimy z tym dalej co chcemy, np. wyświetlamy listę userów).

W dzisiejszych czasach rozwój stron WWW jest bardzo szybki i sam HTML to już za mało. Coraz częściej konieczne jest połączenie HTML+CSS+PHP+MySQL. Ale to nie wszystko

JavaScript

JavaScript, w skrócie JS jest to język służący do pisania skryptów działających po stronie klienta - czyli w naszej przeglądarce. Skrypt jest przesyłany do przeglądarki na naszym komputerze i wykonuje jakąś akcję. W niektórych przypadkach jest dość dużym ułatwieniem. Prosty przykład: piszę teraz ten poradnik i chcę dodać pogrubienie, zaznaczam tekst w edytorze, klikam na przycisk pogrubienia, JS wykonuje akcję - dodaje odpowiedni bbcode do tekstu w edytorze.
To tylko mały przykład. Ale JS w połączeniu z innymi językami potrafi być potężnym narzędziem dodającym duża interaktywność na stronie i zmniejszający obciążenie serwera (np AJAX).

Podsumowując wszystko
Chcemy zacząć tworzyć www? Zacznijmy we właściwej kolejności, takiej jak podałem, czyli najpierw zaczynamy naukę od HTML, potem CSS, PHP, MySQL. Jeszcze zostaje JavaScript, zostawiłem na koniec, bo nie jest to niezbędne do tworzenia stron, ja np. korzystam z gotowych rozwiązań. Jak byśmy chcieli zacząć uczyć się JS to na pewno powinno to mieć miejsce po opanowaniu HTML' i CSS.

Tagi:

Komentarze:

Ten wpis nie był jeszcze komentowany.

Dodaj komentarz

Podobne wpisy:

Dobry edytor HTML, CSS, PHP, MySQL, JavaScript

Jako webmaster z kilkunastoletnim stażem korzystałem z dość małej ilości edytorów do tworzenia stron www . Mimo to z chęcią podzielę się swoimi spostrzeżeniami. Jeżeli chodzi o edytor HTML to należy na początku dokonać rozróżniania na dwa typy: edytor tekstowy - bezpośrednia edycja kodu HTML edytor WYSIWYG (ang. What You See Is What You Get co znaczy dosłownie To Co Widzisz Jest Tym Co Otrzymasz) Przy tworzeniu stron za pomocą edytora WYSIWYG nie musimy znać HTML'a, ...
Dlaczego nie warto robić stron opartych na tabelach

Opisze dość skrótowo zagadnienie budowy strony opartej na tabelach. Przedstawię wady takiego rozwiązania i zalety (o ile przyjdą mi jakieś do głowy podczas pisania). Określenie strona oparta na tabelach odnosi się do głównej konstrukcji strony jak i jej mniejszych elementów. W praktyce często objawia się to poprzez ukrycie obramowania tabeli i wielokrotne zagnieżdżanie ich w sobie. Tworzy się wtedy swoista siatka, na której można projektować stronę. Przykładowo główna ...
Nieetyczne pozycjonowanie stron - Black Hat SEO

Nieetyczne pozycjonowanie stron internetowych , na rynku anglojęzycznym nazywane Black Hat SEO jest bardzo popularną metoda podbijania stron w rankingu Google. W zasadzie samo pozycjonowanie już jest dość kontrowersyjne, bo sztucznie wpływa na pozycję strony w wyszukiwarkach. Tak więc określenie czy pozycjonowanie jest etyczne czy nie, jest dość płynne. Ale na pewno niektóre techniki jednoznacznie zaliczają się do tych spod czarnego kapelusza. Popularne metody stosowane w ...
Kurs Mindfulness MBCT - moja formalna przygoda z uważnością

Pod koniec stycznia 2021 r. poczułem potrzebę odbycia kursu medytacji domowej Tak bym określił technikę uważności, która nie sięga tak głęboko jak Vipassana, nie potrzebuje odosobnienia by ją praktykować. Po poznaniu zasady działania może być śmiało praktykowana w domu. Konkretnie chodziło mi o kurs Mind Body Bridging , który poznałem w bardzo dla mnie wartościowej książce Powrót do zmysłów. Ciało - dusza. Książka ta wywarła na mnie ogromne wrażenie, ponieważ ...
Kurs Mindfulness MBCT - wnioski i refleksje na półmetku

Minął miesiąc mojego kursu Mindfulness MBCT . Otrzymałem do wypełnienia krótkie formularz z pytaniami. Tak, żeby zwrócić uwagę przebieg kursu. Z chęcią podzielę się swoimi odpowiedziami :) Jakie masz refleksje na temat swojej praktyki Zainteresowałem się kursem Mindfulness aby zwiększyć swoje kompetencję jako osoba prowadząca sesje medytacyjne. Podczas rozmowy z nauczycielką prowadzącą kurs uświadomiłem sobie, żeby wyzbyć się oczekiwań, nie patrzeć na kurs przez ...
Czym jest pozycjonowanie stron internetowych

Pozycjonowanie stron internetowych (SEO - Search Engine Optimization) jest wpływaniem na pozycję strony w wynikach wyszukiwarek internetowych. W obecnych czasach pozycjonowanie odnosi się głównie do wyszukiwarki Google i nie jest w tym nic dziwnego, ponieważ to właśnie ta wyszukiwarka generuje największy ruch w internecie. Pozycjonowanie stron internetowych ze względu na obrany sposób można podzielić na dwie grupy: White Hat SEO (biały kapelusz) jest to określenie na ...
Dzień przyjazdu na kurs - prośba o nauczanie medytacji - 10 dniowy kurs medytacji Vipassana

W dniu przyjazdu na kurs jest załatwianych sporo spraw formalnych i organizacyjnych. Uczestnik wypełnia formularz zgłoszeniowy. Zgadza się z zasadami panującymi podczas kursu, zobowiązuje się je przestrzegać i podpisuje się pod nimi. Zostawiamy telefon i kosztowności w depozycie. mamy okazję skorzystać z ostatniego posiłku w tym dniu. Później odbywa się zebranie organizacyjne, na którym jest omówiony przebieg kursu i różne, drobne kwestie organizacyjne. Po zebraniu, około ...
Koniec kursu, dzień wyjazdu i praktyka w domu - 10 dniowy kurs medytacji Vipassana

Ostatni dzień kursu bywa ciekawy. Z rana jest ostatnia medytacja i oficjalne zakończenie kursu. Otrzymujemy zwrot z depozytów naszych rzeczy - telefonów. Następuje ponowne podłączenie do Matrixa. Niektóre uwarunkowania zaczynają się aktywować, wypływać. Jest to doskonały moment, żeby robić to wszystko uważnie. Świadomie obserwować co się w nas dzieje, jakie pragnienia się pojawiają. Wspaniały moment, żeby rozwijać zrównoważony umysł. Wspaniała chwila by dalej kontynuować ...
Skrócona instrukcja warunkowa if

Nie raz szukałem w internecie zapisu skróconej instrukcji warunkowej if . Często się przydaje, zwłaszcza podczas przypisywania wartości dla zmiennej. W tym wypadku będzie to warunkowe przypisanie wartości dla zmiennej. Nie ma co za dużo pisać, takie sprawy najlepiej się objaśnia i obrazuje na przykładach. Standardowa instrukcja if : if ($warunek) { // wykonaj jeśli $warunek jest spełniony } else { // wykonaj jeśli $warunek nie jest spełniony } Nieco krótsza wersja instrukcji if : if ...
Zaokrąglone rogi dzięki CSS

Każdy by chciał mieć zaokrąglone rogi na swojej stronie internetowej. Praktycznie jak ich nie ma to strona nie nadaje się do oglądania Trzeba nadążać za trendami mody inaczej skończymy marnie Jeszcze jakiś czas temu było to dość kłopotliwe. Takie zaokrąglenia trzeba było wykonać przy użyciu plików graficznych. Na szczęście teraz jest dużo prostsza metoda. Z pomocą przychodzi nam CSS3. Aby zaokrąglić jakiś element, wystarczy dodać taki kod do swojego CSS: .element_z_zaokraglonymi_rogami { ...