Néha hetente több alkalommal is felvetődik a kérdés ügyfeleink részéről, hol és hogyan fejlesszék weboldalukat. Mi mindig azt javasoljuk, hogy a fejlesztés saját gépen történjen, mert egyrészt nem szeretné a mindenki számára elérhető weboldalt üzemképtelenné tenni, másrészt vannak esetek, amikor jobb ha nem a tárhely szerveren zajlik az oldal tesztelése. Saját gépen fejleszteni körülményes is lehet, mert ahhoz, hogy a Tárhelypark szerverekhez hasonló környezetet produkáljunk saját gépünkön, számos szoftvert telepíteni kell. Szerencsére most egy olyan megoldást mutatok be egy rövid cikksorozat első lépéseként, ahol nincs szükség hosszadalmas telepítésre, és aminek a végén mindenki saját fejlesztői környezetében tesztelheti weboldalát.
Mi az a fejlesztői környezet?
A fejlesztői környezet (developer system, developer environment, dev) egy olyan szoftverhalmaz, amit csak azért telepítünk fel, hogy a készülő szoftvert tesztelni és fejleszteni tudjuk, lehetőleg egyszerűen és gyorsan. Ez a környezet soha nem elérhető a látogatóknak, és soha nem is szabad összekeverni az éles, működésben levő rendszerünkkel, amit a felhasználóink látnak. Éles környezeten nem tesztelünk, nem próbálgatunk, csak azok a dolgok kerülnek oda, amiket már leteszteltünk a fejlesztői környezetben és jól működnek. Ennek az általános képnek természetesen vannak szintjei. A program bonyolultságától és attól függően mennyire stabil rendszert szeretnénk, lehetnek más környezetek is a képben, de ennek elemzésétől most az egyszerűség kedvéért eltekintek.
Milyen programokat kell telepítened?
A fejlesztői környezet bárhol kialakítható, de most a saját gépedre fogjuk telepíteni, hogy a fejlesztés és tesztelés egyszerű és gyors legyen. Már elő is készítettem egy feltelepített szervert, amit virtualizációval fogsz a gépedre feltelepíteni, így nem kell minden szoftvert egyesével telepítened.
A virtualizáció azt jelenti, hogy a saját operációs rendszereden (akár windows-on is) fogsz futtatni egy másik operációs rendszert, ami úgy fog viselkedni mintha egy másik számítógép lenne, de közben saját gépedet használhatod saját programjaiddal.
Jó tudni!
A telepítésbe bátran belevághatsz! A virtualizáció nem egy teljesen új operációs rendszer telepítés, jelenlegi operációs rendszeredet nem módosítjuk, nincs szükséged új partícióra sem, és a gépedet sem kell újraindítani. A telepítés kizárólag egy szoftvert telepít jelenlegi rendszeredre, amit utána akár törölhetsz is.
Ennek az az előnye, hogy bármikor kikapcsolhatod, így a saját gépeden nem fognak mindenféle adatbázis és webszerverek futni. A megvalósításhoz a VirtualBox-ot fogod használni, amit aztán a Vagrant konfigurációs rendszerrel fogunk konfigurálni és elindítani. Letöltések:
- VirtualBox: https://www.virtualbox.org/wiki/Downloads
- Vagrant: http://downloads.vagrantup.com/
A két programot fel kell telepíteni. A telepítés elvégezhető Windows-on, Linux-on és OSX-en is. Én OSX-en dolgozom, így lehetnek kisebb eltérések például windows-on. Ha minden jól van feltelepítve, akkor a következő parancsoknak működniük kell a parancssorban vagy terminálban (a verziószámok eltérhetnek):
Linux/OSX:
1 2 3 4 5 |
$ vagrant -v Vagrant version 1.2.7 $ VBoxManage -v 4.2.18r88780 |
Windows:
1 2 3 4 5 |
C:>C:HashiCorpVagrantbinvagrant -v Vagrant 1.3.5 C:>"C:Program FilesOracleVirtualBoxVBoxManage" -v 4.3.6r91406 |
A fejlesztői környezet előkészítése
A VirtualBox és Vagrant telepítése után szükséged van rá, hogy ezeket a rendszerek bekonfiguráld. Ez nem nagy dolog, előre létrehoztam a szükséges fájlokat, csak le kell töltened innen (http://bit.ly/1n6YmFw) egy újonnan létrehozott könyvtárba (kb. 550mb). Legyen az új könyvtár neve például a domain neved, én tarhelypark.hu-nak neveztem el. Ez lesz a fejlesztői környezeted könyvtára. Ha belépsz a könyvtárba, akkor a fájl letöltése után ez fogad:
Linux/OSX:
1 2 3 4 5 |
$ ls -la total 1094624 drwxr-xr-x 3 kepes staff 102 Nov 15 16:59 . drwxr-xr-x 6 kepes staff 204 Nov 15 16:58 .. -rw-r--r-- 1 kepes staff 560445759 Nov 14 10:39 centos65-php-dev.box |
Windows:
1 2 3 4 5 6 7 8 9 10 11 12 13 |
C:>mkdir tarhelypark.hu C:>cd tarhelypark.hu C:tarhelypark.hu>dir Volume in drive C has no label. Volume Serial Number is 6C46-898B Directory of C:tarhelypark.hu 2014.02.21. 15:10 . 2014.02.21. 15:10 .. 2014.02.21. 15:05 563 102 488 centos65-php-dev.box 1 File(s) 563 102 488 bytes 2 Dir(s) 209 649 590 272 bytes free |
A centos65-php-dev.box fájl az operációs rendszer képe (image fájl vagy box), amit a Vagrant-al fogsz telepíteni. Ebben a fájlban én már előre beállítottam egy olyan CentOS Linux operációs rendszert Apache, PHP és MySQL programokkal, ami nagyon hasonlít a Tárhelypark szervereinek környezetére.
Tehát a saját gépeden amin Windows, Linux vagy OSX van, fog futni egy CentOS Linux operációs rendszer, és a virtualizáció miatt azt fogja hinni, hogy egy saját különálló gépen fut. Elsőre ijesztő, de nem kell félni tőle. A virtualizáció a barátunk!
Telepítsük hát egyetlen utasítással új oprendszerünket, és utána a fájlt törölhetjük is, már nem lesz rá szükségünk.
Linux/OSX:
1 2 3 4 5 6 7 8 9 10 11 12 13 |
$ vagrant box add "CentOS-6.5-php-dev" ./centos65-php-dev.box Downloading or copying the box... Extracting box...te: 29.9M/s, Estimated time remaining: --:--:--) Successfully added box 'CentOS-6.5-php-dev' with provider 'virtualbox'! $ rm ./centos65-php-dev.box $ ls -la drwxr-xr-x 3 kepes staff 102 Nov 15 17:08 . drwxr-xr-x 6 kepes staff 204 Nov 15 16:58 .. $ vagrant box list CentOS-6.5-php-dev (virtualbox) |
Windows:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 |
C:tarhelypark.hu>vagrant box add "CentOS-6.5-php-dev" ./centos65-php-dev.box Downloading or copying the box... Extracting box...ate: 30.7M/s, Estimated time remaining: --:--:--) Successfully added box 'CentOS-6.5-php-dev' with provider 'virtualbox'! C:tarhelypark.hu>del centos65-php-dev.box C:tarhelypark.hu>dir Volume in drive C has no label. Volume Serial Number is 6C46-898B Directory of C:tarhelypark.hu 2014.02.21. 15:13 . 2014.02.21. 15:13 .. 0 File(s) 0 bytes 2 Dir(s) 209 625 137 152 bytes free C:tarhelypark.hu>vagrant box list CentOS-6.5-php-dev (virtualbox) |
Négy parancsot kellett kiadnod, ezek magyarázata:
- Hozzáadtad a Vagrant-hoz a kép fájlt
- Letörölted a letöltött fájlt, mert már amúgy is hozzáadtad, ne foglalja a helyet
- Listáztad a könyvtárat, üres
- Lekérdezted milyen box (operációs rendszer kép) van fenn a Vagrant-ban
Jó tudni!
A fentebbi Vagrant telepítési lépéseket nem szükséges többször elvégezni, a hozzáadott Box használható ezentúl a többi projektünknél is.
A környezet létrehozása
Mielőtt még telepítenéd saját weblapodat vagy új CMS-t rendszeredet, teszteljük le, hogy minden megfelelően működik-e! Ehhez egy egyszerű phpinfo() parancsot fogunk használni.
Először is a Vagrant-ot kell utasítanunk, hogy hozza létre nekünk a szükséges konfigurációs fájlokat.
Linux/OSX:
1 2 3 4 5 6 7 8 9 10 |
$ vagrant init "CentOS-6.5-php-dev" A `Vagrantfile` has been placed in this directory. You are now ready to `vagrant up` your first virtual environment! Please read the comments in the Vagrantfile as well as documentation on `vagrantup.com` for more information on using Vagrant. $ ls -la drwxr-xr-x 4 kepes staff 136 Nov 15 18:40 . drwxr-xr-x 6 kepes staff 204 Nov 15 16:58 .. -rw-r--r-- 1 kepes staff 4634 Nov 15 18:40 Vagrantfile |
Windows:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 |
C:tarhelypark.hu>vagrant init "CentOS-6.5-php-dev" A `Vagrantfile` has been placed in this directory. You are now ready to `vagrant up` your first virtual environment! Please read the comments in the Vagrantfile as well as documentation on `vagrantup.com` for more information on using Vagrant. C:tarhelypark.hu>dir Volume in drive C has no label. Volume Serial Number is 6C46-898B Directory of C:tarhelypark.hu 2014.02.21. 15:17 . 2014.02.21. 15:17 .. 2014.02.21. 15:17 4 752 Vagrantfile 1 File(s) 4 752 bytes 2 Dir(s) 209 619 759 104 bytes free |
Az első utasítás inicializálja a konfigurációs fájlt úgy, hogy az előbb létrehozott CentOS-6.5-php-dev nevű Box-ot használja. A második utasítással csak kilistázod mi is van most a könyvtárban.
Látszik, hogy létrejött egy Vagrantfile nevű konfigurációs fájl, ami azt tartalmazza, hogy a virtuális gép hogyan fog elindulni.
Most nyisd meg kedvenc szövegszerkesztődet és hozz létre egy phpinfo.php nevű fájlt ami egyetlen sort tartalmazzon:
1 |
<?php phpinfo(); |
A virtuális számítógép elindítása
Nincs más hátra, mint kipróbálni művünket. A virtuális gépet a vagrant up utasítással indíthatod el.
Linux/OSX:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 |
$ vagrant up Bringing machine 'default' up with 'virtualbox' provider... [default] Importing base box 'CentOS-6.5-php-dev'... [default] Matching MAC address for NAT networking... [default] Setting the name of the VM... [default] Clearing any previously set forwarded ports... [default] Creating shared folders metadata... [default] Clearing any previously set network interfaces... [default] Preparing network interfaces based on configuration... [default] Forwarding ports... [default] -- 22 => 2222 (adapter 1) [default] -- 80 => 8080 (adapter 1) [default] Booting VM... [default] Waiting for VM to boot. This can take a few minutes. [default] VM booted and ready for use! [default] Mounting shared folders... [default] -- /vagrant |
Windows:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 |
C:tarhelypark.hu>vagrant up Bringing machine 'default' up with 'virtualbox' provider... [default] Importing base box 'CentOS-6.5-php-dev'... [default] Matching MAC address for NAT networking... [default] Setting the name of the VM... [default] Clearing any previously set forwarded ports... [default] Creating shared folders metadata... [default] Clearing any previously set network interfaces... [default] Preparing network interfaces based on configuration... [default] Forwarding ports... [default] -- 22 => 2222 (adapter 1) [default] -- 80 => 8080 (adapter 1) [default] Booting VM... [default] Waiting for machine to boot. This may take a few minutes... |
Mi is történt itt most pontosan? Elindult a virtuális szervered, amit rögtön tesztelni is tudsz. Mivel ez egy webszerver, nyiss meg egy böngészőt, és a következő linken máris megjelenik a phpinfo oldal, amit fentebb létrehoztunk: http://localhost:8080/phpinfo.php
A működő gép 80-as HTTP portja a saját géped 8080-as portjára került átirányításra. Ez azért kell, mert általában a 80-as port a saját gépen foglalt másra. Ezért kell a linkben is feltüntetni a 8080-as portot.
Jó tudni!
Ha tűzfal van telepítve gépedre, akkor elképzelhető, hogy nem nyílik meg az oldal. Kapcsold ki a tűzfalat, vagy engedélyezd a 8080-as és 2222-es portokat!
Miért jó a fejlesztői környezet nekem?
A fentebbi telepítési leírásból még nem teljesen egyértelmű, de:
- Gyakorlatilag nem telepítettél és konfiguráltál szerver programokat, ezeket mind előre telepítettem neked, így pillanatok alatt elindult a gép ahhoz képest, mintha nekiláttál volna egyenként mindent telepíteni.
- Van egy saját szervered, amit akkor indítasz el amikor tetszik, és ha már nem kell leállítod vagy meg is szüntetheted. Ha legközelebb kell, majd megint elindítod.
- A weboldalt (jelenleg a phpinfo oldal) a saját gépeden szerkeszted a kedvenc szerkesztő programoddal. Mivel a könyvtárat „bedrótoztuk” a szerverbe, ezért a változások azonnal látszanak, nem kell feltöltés, FTP stb.
- A szerver programok, Apache, PHP, MySQL nem a te gépedre van telepítve, így ha a virtuális gépet leállítod, nem futnak, nem foglalják a memóriát
- A virtuális szerver nagyban hasonlít a tárhelypark szerverekhez, így sokkal egyszerűbb a fejlesztés
Néhány hasznos tudnivaló
A fejlesztői környezeted virtuális szerverét a következő parancsokkal tudod vezérelni:
- vagrant up: létrehozás, indítás
- vagrant suspend: altatás, a gép nem törlődik, de nem fut
- vagrant destroy: a gép teljes törlése
- vagrant ssh: ssh bejelentkezés a gépre
A virtuális gép root jelszava: tmppwd
Hogyan tovább?
A következő cikkekben egy új WordPress telepítést fogok bemutatni, aztán megnézzük, hogyan lehet egy már létező oldalt feltelepíteni a környezetbe. Ha ezzel megvagyunk, akkor néhány hasznos trükköt fogok mutatni, hogyan deríthetők ki egyes tipikus hibák az oldalon.