Chromium
Avagy hogyan programozzunk egy újságból
1349 Ft
20. 50/A
Fő Témánk: A Saját webloldalam!
Ebben a kiadásunkban segítünk az első webszervered elkészítésében,
Melyet biztonságosan elérhetsz bárhonnan;
Hasznos általunk ajánlott programokat ismerhetsz meg
Chromium™ újság a ChromiumNetwork© Tulajdona.
Módosítani, továbbadni, negatívan kritizálni,
szigorúan tilos és bűncselekményhez vezet.
Tartalomjegyzék
Weboldal készítés egyszerűen! .................................................. 2.
HTML alapok ................................................................................... 2.
HTML tag puska ............................................................................ 4.
Szépítés felsőfokon ..................................................................... 5.
CSS puska ....................................................................................... 6.
Fejlesztői szerver telepítése .................................................... ?.
Hasznos konfigurációk ................................................................. ?.
Bonyolult, de mégse… ................................................................... ?.
Ha már HTML legyen PHP ........................................................... ?.
Hogyan érjük el bárhonnan szerverünk .................................... ?.
Biztonság ......................................................................................... ?.
csúnya ez az IP legyen domain! .................................................. ?.
Weboldal Készítés egyszerűen!
Mielőtt belekezdenénk e szép weboldalba, tudnunk kell, hogy
egyébként mit is kellene csinálni.
Először is egy egyszerű „.html” fájlt kell létrehoznunk, hogy
ebbe írjuk azokat, amikkel el tudunk kezdeni programozni.
Ez itt egy érvényes html dokumentum melyet notepad++-ba
vagy akár Visual Studio Code-ba is megcsinálhatsz!
<!DOCTYPE html>
<html>
<head>
<title>Helló világ!</title>
<meta charset=”UTF-8”>
</head>
<body>
<h1>Helló világ!</h1>
</body>
</html>
Jó oké, de tulajdonképpen most mi ez, és hogy lesz ebből még
mindig egy weboldal?
A <!DOCTYPE html> „tag” megmondja a gépnek, hogy ez egy
html dokumentum, a <head> részbe szoktuk tenni például a
stíluslap forrását, hogy a gép beillessze azt a weboldalunkba,
vagy a böngésző fülecske nevét átállítsuk <title>,
meghatározzuk a kódolását a kódsorunknak <meta
charset=”UTF-8”> és persze (majdnem) minden taget be
zárunk a maga megfelelőjével (pl.: <h1> záró tagje </h1>) és egy
kis „/” szimbólummal. A <body>-ba szokott kerülni a lényeg,
maga az oldal tartalma például <h1>, <h2>,…<h9>; <p>; <div>, <br>.
Mindegyik tagnek van sajátossága és funkciója, ezt egy kicsi
táblázatba össze is foglaltuk a következő oldalon.
ments el valamilyen néven a .html oldalad (pl.: „hellovilag.html”)
és dupla katt rá, társítsd egy böngészővel és kész, látod az
oldalad, eléggé üresnek néz ki nemde? csak egy sornyi szöveg…
De láthatod a böngésződ lapfüleinél, hogy működött a <title>
tag és az oldalon a <h1> tag is. Ezt egészítsd ki, hogy ne legyen
annyira üres egy <p> taggel is a <h1> alá és írj bele valamit
(<p>Lorem Ipsum…</p>) és ha lemented újra, majd ráfrissítesz
a böngésződben, akkor a változtatásaid is ott lesznek.
Szépítés felsőfokon!
Eléggé semmilyen ez az oldal, másokéhoz képest nemde?
Ahhoz, hogy például a színét meg tudjuk változtatni kell
nekünk ismernünk egy másik programozási nyelvet, a CSS-t
[Cascading Style Sheet] lehet ezt használni egy <head>-ben
lévő <style> tagben és egy külön „.css” fájlkiterjesztéssel
rendelkező fájllal. Mi az utóbbit alkalmaztuk, ezt a mappánkba
készítettük el a „hellovilag.html” fájl mellé „stiluslap.css”
néven, hogy egyszerűen el tudjuk érni.
Háttérszín megváltoztatásához ki kell jelölnünk a <body> részt
a stiluslap.css fájlunkban, megnyitod a fájlt vagy notepad++-
ban vagy VSCode-ban és szépen elkezdük begépelni azt, hogy
„body {background-color: aquamarine}” és kész.
De miért nem változott az oldalunk háttere?
A kérdés egyszerű, a html-be meg kell adnunk a <head> részbe
azt, hogy onnan szedje az oldalunk a stíluslapot, ezt egy <link >
tag-el tudjuk megoldani: <link rel="stylesheet"
href="stiluslap.css">.
Fejlesztői szerver
e heti kiadásunk csak eddig tartott, mert a készítője egy
nagyon lusta ember volt de mindenképp be fogja fejezni a
napokban amikor van szabadideje mert nagyon élvezte ezt
elkészíteni.