Készítette: Balázs Gergő [email protected] XAMPP é a z ...users.atw.hu/progressbar/xampp_es_hasznalata_windows_rendszereken.pdf · Készítette: Balázs Gergő [email protected]

Készítette: Balázs Gergő [email protected]

1

XAMPP é s haszna lata Windows réndszérékén

1. XAMPP letöltése:

- Letöltés az alábbi linkről:

- http://www.apachefriends.org/en/xampp.html

- Ezután kiválasztjuk az XAMPP for Windows opciót, majd az alábbi lehetőségek közül a legelsőt választjuk:

- A felugró oldalon pedig letöltjük a basic packagek közül az EXE-t, ebben benne van minden ami nekünk kell, így nem

kell külön telepíteni semmit sem:

http://www.apachefriends.org/en/xampp.html


2

2. XAMPP Telepítése

- Ha letöltöttük, indítsuk el a telepítést:

- Kiválasztjuk a célmappát, szerintem célszerű a Windows partíciójára telepíteni, azon belül is a gyökérbe, mert

onnan érhetők el és adhatók meg legegyszerűbben a későbbiek folyamán a fájlok, amikkel majd dolgozol:

- A telepítési folyamat el fog tartani egy darabig, addig érdemes feltenni mellette az Adobe Dreamweaver CS5-t

- Ha sikeres a telepítés, érdemes újraindítani a számítógépet, hogy minden fontos szolgáltatás elindításra kerüljön

- Újraindítás után nyissuk meg az XAMPP Control-Paneljét a Start>Minden Program>xampp for windows>xampp

Control Panel


3

- A következő ablak fog fogadni minket:

- Innen nekünk szükségünk van 2 modulra, Apache és MySql, telepítsük őket

- Pipáljuk be a mellettük lévő Svc (Service) négyzeteket:

- Ha ez megvan, indítsuk el a szolgáltatásokat, kattintsuk a Start gombra mindkét modulnál:

- Indításkor Windows Vista/7 eseten az UAC (User Account Control) engedélyt kérhet a rendszergazdai fiók

használatára, engedjük neki

- Ha minden jól ment, a következőt látjuk:

- Ezzel sikeresen működésbe hoztuk a lokális php szerverünket és sql adatbázisunkat, a következőkben megnézzük

miképpen lehet használni a rendszert.


4

3. XAMPP használata

- Nyissuk meg a böngészőnket és pötyögjük be az URL mezőbe a következő címet: 127.0.0.1

- Valami ilyesmit kell látnunk:

- Elsőként be kell állítanunk a root felhasználóhoz egy jelszót, hogy az adatbázisunkat majd biztonságban tudhatjuk,

illetve megkönnyítsük a Dreamweaverrel történő használatot

- Ehhez a baloldali naracssárga menüben válasszuk a Security opciót:


5

- Itt a következő linkre van szükségünk, kattintsunk rá:

- A MySQL Section-nél állítsunk be a ROOT-hoz egy tetszés szerinti jelszót, majd fogadjuk el:

- Ha kész, térjünk vissza a 127.0.0.1 –es címre, és a bal oldali menüpontok közül a Tools címke alatt válasszuk a

phpMyAdmint:

- Az alábbi kép fog fogadni minket:

- Itt válasszuk ki a Nyelvnél a Magyart, ha úgy tetszik, de nem feltétlen kell ragaszkodni hozzá


6

- Itt megadjuk az általunk választott jelszót és belépünk:

- Ha idáig eljutottunk, akkor bent vagyunk a szerverünk azon részén ahol tároljuk az adatbázisainkat, a mi feladatunk

először is, hogy létrehozzuk a saját adatbázisunkat, a MySQL localhost alatt található mezők kitöltésével:

- Az első üres mezőbe írjuk be az adatbázisunk nevét, legyen mondjuk esetünkben: pelda

- a következő leugró menü (illesztés) számunkra most lényegtelen, ezért nélkülözzük, ha megadtuk a nevet

kattintsunk a Létrehozásra:

Megjegyzés: Célszerű az ékezetes karaktereket mellőzni mind az adatbázis és a táblák nevében, táblán belül pedig a mezők címadásakor is,

mert az SQL nem szereti az ékezetes karaktereket. Lehetőség van ’TáblaNév’ ’MezőNév’ való megadásra, de lekérdezésekkor okozhat galibát

az ékezetek használata. Ha mód van rá, mellőzzük, űrlapok készítésénél egyébként is testre szabható, hogy miként jelenjen meg adatbázisunk

tartalma.


7

- Ha megvagyunk, belépünk az első adatbázisunk főoldalára, ahol nincs más tennivalónk, mint felvenni az első

táblánkat:

- Adjuk meg a táblánk nevét, valamint a mezők számát, pontosan annyit, ahány attríbutumot fog tartalmazni a 3.

normálformában lévő táblánk, legyen mondjuk a név ’felhasznalok’, a mezők száma pedig 4, majd kattintsunk az

indításra


8

- Átkerülünk a következő oldalra, ahol meg kell adni az attribútumok tulajdonságait: mező neve, típusa, hossza,

alapértelmezett értéke, indexet és még sok egyéb dolgot, amiből nekünk csak a felsoroltak kellenek. Töltsük ki a

mezőket a következő módon:

- Mező: Itt adjuk meg a mezőnk nevét, ami megadja, hogy milyen adatokat fog tartalmazni az oszlopunk

- Típus: A tárolt adataink típusától függően kell kiválasztanunk, szöveg esetén TEXT, számok esetén INT, dátum

esetén DATE és így tovább

- Hossz: A mezőben megadható szám vagy szöveg hossza, számjegyekben kifejezve, pl. irányítószám esetén nem

érdemes 4 számjegynél hosszabbra hagyni a mező méretét mivel Magyarországon 4számjegyű minden

irányítószám

- Index: a képen nem látszik, de a következő tulajdonságai vannak: PRIMARY, INDEX, UNIQUE, FULLTEXT. FULLTEXT

és UNIQUE-ról most nem kívánok szólni, számunkra a lényeg a UNIQUE és a PRIMARY. Az index segítségével állítod

be egy táblán belül a kulcsokat, UNIQUE jelentése egyedi, tehát esetünkben erre van szükség az Azonosito

mezőben, mert ez fogja egyértelműen azonosítani a felhasználóinkat. PRIMARY jelentése elsődleges, több kulcs

esetén megadhatjuk, hogy mely kulcsot használjuk elsődlegesként, bővebben lásd az előadás jegyzetben.

- Ha megadtunk mindent, akkor kattintsunk a mentésre.


9

- Létrehoztuk a felhasznalok táblánkat, amiben a következő adatokat tudjuk tárolni: felhasználó neve, jelszava és e-

mail címe:

- Tanulmányozzuk kicsit a mezőnevek melletti műveleteket:

- 1. ikon: Különböző értékek tallózása – itt tudod lekérni a mezőhöz tartozó értékeket

- 2. ikon: módosítás – itt tudod szerkeszteni a mező tulajdonságait, amiket az előzőekben megadtunk (megjegyzés: a

kulcs megadására itt már nincs lehetőség, csak a mező törlésével és újra-hozzáadásával tudunk új kulcsot

megadni!)

- 3. ikon: Törlés – itt tudjuk törölni azt a mezőt, amire nincs szükségünk. Törlés után egy megerősítő oldalra kerülünk

a véletlen törlések elkerülése végett

- 4. ikon: Elsődleges – elsődleges kulcs kijelölését végezhetjük el a használatával

- 5. 6. és 7. ikon: Ezek aszerint érhetők el, ahogyan beállítottuk az egyes mezők tulajdonságait


10

- Most pedig vigyünk fel néhány demó adatot, amit a későbbiekben tesztelés céljából le tudunk kérni majd egy php

oldalra Dreamweaver segítségével, ezt már nem fogom részletezni, ehhez útmutatást a http://www.ebookz.hu

oldalon található Adobe Dreamweaver php & mysql segédlet nyújt útmutatást.

- Kattintsunk bal oldali oldalsávon az adatbázisunk nevére: pelda (1), így visszakerülünk az adatbázis főoldalára, ahol

láthatjuk a benne található táblákat:

- A Műveletek oszlopból válasszuk a 4. ikont (Beszúrás) ami tovább ugrik a következő oldalra:

http://www.ebookz.hu/


11

- Itt triviális mit kell tennünk, az Érték oszlopokba felvisszük az felvenni kivánt adatokat, értelemszerűen INThez

számot, TEXThez szöveget. pl.:

- 1. felhasználó

- Azonosito: 1

- felhasznalonev: admin

- jelszo: adminjelszo

- emailcim: [email protected]

- 2. felhasználó

- Azonosito: 2

- felhasznalonev: user1

- jelszo: user1jelszo

- emailcim: [email protected]

- Ha kész, kattintsunk valamelyik Érték oszlop alatt található Indítás gombra és ha jól végeztük dolgunkat, a

felhasznalok táblára klikkelve megjelenik a 2 felvitt demóadatunk:

- Ezek paraméterei később módosíthatók a korábban már megismert módon, és törölhetők is.(Az ikonokat

feltételezem, megismerjük)

- Ezzel készen is volnánk első használható adatbázisunkkal. Átvettük hogyan hozhatunk létre adatbázist, táblát és

hogyan adhatunk hozzá adatokat. Másra itt nem is nagyon lesz szükség, a munka javarésze a megfelelő adatok

felvitele után Dreamweaverben fog zajlani. Található pár példa adatbázis amik az XAMPP-al települtek, ezeket

érdemes nézegetni. A következőkben még arról lesz szó, hogyan kapcsolódjunk adatbázisunkhoz Dreamweaver

segítségével, ha használni szeretnénk majd a web fejlesztés folyamán.

mailto:[email protected]

mailto:[email protected]


12

4. Kapcsolódás Adatbázishoz Dreamweaverben

- Bízom benne mielőtt ennek a fejezetnek nekifogunk, előtte sikeresen telepítve lett az Adobe Dreamweaver CS5

- Indítsuk el a programot, majd első feladatunk az lesz, hogy létrehozunk magunknak egy Site-ot:

- Kattintsunk a Dreamweaver Site… -ra, majd adjunk meg egy tetszés szerinti nevet az oldalunknak:

- Site Name: Az oldal neve, tetszés szerinti


13

- Local Site Folder: Itt adjuk meg, hová mentse le a fájljainkat, ez most mindenképpen az xampp könyvtárába kell

mentenünk, máskülönben nem tudjuk majd elérni localhostról az alkotásunkat. XAMPP-on belül is válasszuk a

htdocs könyvtárat, ahogy a neve is adja, itt keresi a (ht=hyper text, html=hyper text marking language) html, php

dokumentumainkat, amikor megadod majd böngésződben az elérési utat hozzá, ami a következőképpen néz ki:

127.0.0.1/oldalnev/fajlnev.php, azaz mi esetünkben 127.0.0.1/peldasite/fajlnev.php lesz.

- kattintsunk bal oldalt a Servers pontra, itt megadjuk, hogy Helyben szeretnénk tesztelni az oldalunkat:

- Pluszjelre kattintva megnyílik egy ablak, adjuk meg neki az alábbi beállításokat:

- Ha ez megvan, mentsük őket a Save gombbal, majd a Remote oszlopban található pipát vegyük ki, a Testing

oszlopot pedig pipáljuk be. Ha ez is megvan, akkor szintén Save. Ezzel kész a weboldalunk, amit localhost-on tudunk

majd futtatni és tesztelni.

-


14

- Most hozzunk létre egy üres php fájlt, hogy beállíthassuk az adatbázisunkat amit nemrég készítettünk: File>New>

PHP:

- Jobb oldalt nyissuk le a Bindigs, Server Behaviors, Databases fület:


15

- Válasszuk ki a Databases fület és kattintsunk a képen is látható plusz jelre, ott pedig a MySQL Connection-re, és

adjuk meg az alábbi adatokat:

- Connection name: A kapcsolat neve, tetszőleges

- MySQL server: a szerver ahol az adatbázis található, mi esetünkben ez a saját számítógépünk (localhostunk), enek

megadása kétféleképpen lehetséges: vagy localhostot írsz, vagy 127.0.0.1 –et, mind a kettő ugyanazt eredményezi.

- User name: jelen esetben root, de lehetőség van phpmyadminban az adatbázisunkhoz új felhasználók

létrehozására, mivel nincs szüksége minden felhasználónak admin jogokra az adatbázis szerkesztéséhez, így

elkerülhető, hogy valamilyen ártalmas php kóddal törölje mondjuk az egész adatbázisunkat.

- Password: Az előzőekben beállított password, amivel belépünk phpmyadminba.

- Database: az adatbázis neve, amivel dolgozni szeretnénk, ezt szintén létrehoztuk már korábban, pelda néven, így

elég ha csak ezt beírod, de selectre kattintva válogathatsz a többi adatbázis közül is, amennyiben jól adtad meg a

szerver címét.

- Az adatok megadása után tesztre kattintva ellenőrizheted a felvitt paraméterek helyességét, amennyiben jól

dolgoztál, „Connection was made succesfully” üzenetet kapsz, ha nem, akkor nézd át mit írhattál el.

- Végeztünk, OK-t nyomunk, és a kapcsolatunk szépen létrejön. Innentől kezdve használhatjuk az adatbázisunkat az

oldalunk megalkotása közben. Azt, hogy ezt miképpen kivitelezhető, (adatok felvitele, módosítása, törlése stb..) az

ebook.hu videóiból lesz lehetőség megtanulni.

- Ez a Lecke itt véget ért.

A továbbiakban sok sikert, és remélem sikerült hasznát venned eme rövid kis útmutatómnak.

Documents

Készítette: Balázs Gergő [email protected] XAMPP é a z ...users.atw.hu/progressbar/xampp_es_hasznalata_windows_rendszereken.pdf · Készítette: Balázs Gergő [email protected]