Saját weboldal készítése
online jövedelemszerzési célból

A világháló létezése előtt korlátozott volt a lehetőség arra, hogy átlagos emberek globális szinten hatást gyakoroljanak a világra vagy hogy egy nemzetközi vállalkozást indítsanak. Akik tehetséggel és üzleti ötletekkel rendelkeztek ugyan, de pénzügyi forrásokkal nem, azok csak helyi közösségeket érhettek el. A magas költségek miatt a hétköznapi embereknek nem volt lehetőségük üzleti ötleteiket igazán naggyá - világszintű vállalkozássá - fejleszteni.

Korunk nagyszerű lehetősége, hogy bárki elkészítheti a saját weboldalát, és ezzel globálisan is ismertté teheti vállalkozását.

Egy webhely tulajdonosának lenni földrajzi értelemben korlátlan lehetőséget jelent az ügyfélszerzésére és sokféle vállalkozás létrehozását is lehetővé teszi.

Írhatsz egy blogot, készíthetsz egy híroldalt, eladhatsz valamit, szolgáltatást kínálhatsz, szórakoztathatsz, hirdethetsz, oktathatsz, összekapcsolhatod az embereket, stb. Akár olyan ötlettel is előállhatsz, ami senki másnak nem jutott még eszébe. Vagy egyszerűen létrehozhatsz weblapokat azok számára, akik szeretnék ha lenne weblapjuk. Bármilyen online vállalkozást létrehozhatsz, és mindenkit elérhetsz a Földön, komoly pénzügyi háttér és kapcsolatok nélkül is.

Az emberek gyakran alábecsülik egy saját weboldal lehetséges pozitív hatásait a saját életükre, figyelmen kívül hagyják, vagy fel sem ismerik a benne rejlő lehetőséget.

De miért van ez így?
Néha az ismeretek hiánya az ok. Máskor a negativitás vagy olyan okoskodókra való hallgatás, akik azt mondják: "Ezt valaki már megcsinálta előtted."

Mi azt mondjuk, hogy még senki számára sem késő létrehozni egy saját online vállalkozást. Jó esélyeid vannak arra, hogy egy sikeressé váló weboldalt létrehozz. Még a Facebook, az Instagram, a Google és más online nagyvállalkozások létezése előtt egyesek azt mondták nekünk: az interneten már minden van. Már nem lehet újat kitalálni rajta.

Azért vagyunk itt, hogy elmondjuk neked: a sikeres internetes üzleti vállalkozások létrehozásának ideje még nem ért véget. Még csak mostanában kezdődött.

Nem olyan bonyolult dolog létrehozni egy weboldalt, ahogyan azt sokan gondolják. Ha igazán akarod, meg tudod csinálni. Mi segíteni fogunk az elindulásban néhány hasznos információval.

Hogyan készítsd el saját weboldaladat?

Két fő módszer közül választhatsz.

1. Az első módszer a könnyebbik. Használhatsz egy előre legyártott weblapsablont és a saját ízlésedre alakíthatod. A legismertebb ilyen sablon típust úgy hívják: WordPress. Az alap WordPress sablonok használata ingyenes. A WordPress egy széles körben használt megoldás blogok létrehozására, de másfajta weblapokat is készíthetsz vele, nem csak blogokat. Ha ezt a módszert választod, kérjük látogasd meg a blogokról szóló lapunkat, ahol lépésről-lépésre elmagyarázzuk, hogy hogyan telepíts fel egy WordPress sablont. Ahogy az előbb említettük, akkor is követheted az ott található lépéseket, ha történetesen nem egy blogot, hanem valamilyen másfajta weboldalt szeretnél létrehozni. WordPress sablonokkal akár még saját webshopot is készíthetsz, amiről szintén van egy külön lapunk.
2. Egy weboldal létrehozásának másik módja egy kicsit bonyolultabb: készítsd el az alapoktól, írd meg a kódját. A weboldalak alapvető kódolási nyelvei a HTML és a CSS. Megtanulásuk időbe telik, de néhány hét vagy hónap alatt megismerheted az alapokat. Kezdőként sokat kell gyakorolnod a kódolást, hogy mesterré válj, de ez nem olyan nehéz, mint sokan elképzelik, főleg, ha valakit érdekel a téma. Ha megtanultad a HTML-t és a CSS-t, akkor ingyenesen elkészítheted saját webhelyedet, és értékes képességet is szerezhetsz vele, melyeknek a jövőben még hasznát veheted. Könnyen követhető lépésekkel és magyarázatokkal fogjuk végigjárni a webhely létrehozásának útját. Ha kérdésed merül fel a folyamat során, nyugodtan írj ránk a Facebook-oldalunkon. Megbeszélhetsz velünk bármilyen kérdést, vagy megkérdezhetsz más kezdő weboldal-készítőket is, olyanokat mint te vagy. Remélhetőleg egy kölcsönösen támogató közösséget építhetünk ki Facebook-oldalunkon.

Tanuld meg lekódolni a saját weboldalad

Mi a legnehezebb része a webfejlesztés megtanulásának egy kezdő számára? Az hogy kitalálja, hol kezdje, mit tanuljon, és kinek a tanácsát hallgassa meg. A tapasztaltabb szakemberek gyakran olyan tanácsokat osztogatnak a kezdőknek, amiket a kezdők a tudásszintjükkel nem értenek, nem érthetnek még meg. A néhány hónapos vagy többéves tapasztalattal rendelkező fejlesztők általában elfelejtik, hogy ők honnan indultak, ezért szakszavakat, rövidítéseket használnak. Néhányan közülük nem szándékosan teszik ezt, de vannak, akik ezzel próbálnak felvágni és bizonyítani a szakértelmüket. Mi itt egy könnyen érthető és egyszerű nyelven fogjuk elmagyarázni, hogy hogyan lehet egy weboldalt létrehozni.

1. Vegyél egy számítógépet

   Először is szükséged lesz egy számítógépre, amid már gondolom van, ha olvasod ezt a cikket. Lehet ez egy laptop vagy egy asztali számítógép. Nincs szükséged szupermodernre, mivel nem egy önvezető autószoftvert fogsz gyártani, amely több erőforrást igényelne. Azt mondhatjuk, hogy minden olyan számítógép megteszi, amely internetkapcsolattal rendelkezik, 2 GB memóriával és ideális esetben dupla processzorral van ellátva. Legtöbbször csak kódszerkesztőt és internetböngészőt futtatsz majd rajta.

   

   Egy ilyen használt laptop körülbelül 25-40 ezer Forintba kerül. A hardverapro.hu-n találhatsz jókat, kedvező áron. Azt tanácsolom, hogy válassz egy Lenovo, Dell vagy HP márkát, mert ezek megbízhatóbbak, mint a többi. Ne vegyél 12 hüvelykes vagy annál kisebb képernyőset, mert kódolás közben ez már túl kicsi lenne tartósan nézni és dolgozni rajta. Röviden ennyi a lényege egy számítógép megvásárlásának.

2. Vásárolj egy domainnevet és tárhelyet (hosting-ot) hozzá

   Ha bármi más előtt vásárolsz egy domain nevet és tárhelyszolgáltatást, akkor kezdettől fogva saját domaineden gyakorolhatsz. A legjobban úgy tanul meg az ember bármit, ha kipróbálja és játszik vele.
   
   Keress egy jól hangzó és elérhető domain nevet. A domain név keresésben segítségedre lehet a Domainnév befektetés lapunk. A legjobb domainnév és egyúttal tárhelyszolgáltató cégek:

   
   
   

   Ezek könnyen követhető utasításokkal és barátságos használati feltételekkel rendelkeznek, ámbár angol nyelvűek. Más tárhelyszolgáltatót nem tudunk javasolni. A magyarországi tárhelyszolgáltatók gyakran nehezebben átlátható irányítófelülettel és szabályrendszerrel rendelkeznek, mint egy külföldi szolgáltató. Gyakran plusz pénzekért kaphatsz náluk biztonságos protokoll szolgáltatást (ez az, amikor https-sel kezdődik a domainneved), nehézkesen beállíthatók a domainneved egyéb tulajdonságai. Ettől függetlenül persze próbát tehetsz velük. Ha találsz egy jót, írd meg nekünk! Természetesen a külföldi cégek sem mind tökéletesek. Például a GoDaddy trükkös automatikus megújításokat állít be, és extra pénzért ad a domainjeihez tulajdonosi adat elrejtési opciót, míg ez más szolgáltatóknál ingyenes. Van rengeteg más külföldi domain név szolgáltató is, de tapasztalatom szerint a fent említett Hostgator és a Bluehost a legjobb ár-érték arányban. Gyorsak, megbízhatók, kedvező árral és barátságos feltételekkel rendelkeznek. Ha elakadsz, bármikor elérheted az ügyfélszolgálatukat és sok-sok beállítási útmutatójuk található meg az interneten.

   Ha megvásároltad a domain nevet, azt évente egyszer meg kell újítanod. A tárhelyért pedig havonta kell fizetned. Ha egy összegben befizetsz egy évet vagy többet, akkor általában kedvezményeket kapsz. A tárhely egy olyan helyet jelent egy távoli szerveren (számítógépen), ahol a webhelyed fájljai fognak helyet foglalni, ahol az összes kódod tárolásra kerül.

3. Tölts le egy ingyenes kódszerkesztő programot

   A következő lépés egy kódszerkesztő program letöltése. Használhatnád a Notepad programot is, amely általában minden operációs rendszer része. Jobb választás viszont egy speciális kódszerkesztő letöltése, amely kellemesebb háttérszíneket, színes szöveget, hasznos funkciókat tartalmaz.

   

   Sok hasonló program létezik. Azt tanácsoljuk, hogy használd az ingyenes, közösségi fejlesztésű Atom.io programot. Másik készítőknek is vannak ingyenesen letölthető verziói, mint példul a Notepad++, SublimeText, Brackets, Visual Studio Code, stb. Számunkra a Notepad++ nem túl kellemes ránézésre, a Brackets néhányszor lefagyott, a Visual Studio Code nagyon gyorsan elindul, és van többsoros kódcsere-funkciója, ami tetszik. Ugyanakkor néha görgetésnél a kód vízszintesen ugrál, ami kissé bosszantó. Ezenkívül a kód beírása közben automatikusan megváltoztatja a szöveget. Ez utóbbi viselkedés valószínűleg kikapcsolható valahogyan, de mi maradunk az Atom.io-nál. Ha valaki tud ennél jobbat, tudassa velünk.

   Az Atom.io letöltése és telepítése után további hasznos kiegészítő csomagokat telepíthetsz, de ezekről később beszélünk. Egyelőre elegendő az alapértelmezett telepítési csomag, mely már tartalmaz kiegészítőket. Az Atom.io felhasználói útmutató több száz oldalas, ezért ne próbáld meg elolvasni. Használat közben rá fogsz jönni, hogyan működik.

4. Tanuld meg a HTML-t, CSS-t és JavaScript-et

   A HTML minden weboldal alap kódoló nyelve, és nem nehéz megtanulni. Az angol nyelvtudás nagy előny a programozás elsajátításakor, mivel a legtöbb és a legjobb oktatóanyagok ezen a nyelven érhetők el, és a programozási nyelvek is az angolra épülnek.

   A HTML kódolási nyelv mellett meg kell tanulnod a CSS szabályait is, amely stílusokat, színeket, betűméreteket és betűtípusokat ad a weboldaladhoz. Könnyen megérthető a lényege. Ezeken kívül ismerned kell a JavaScript programozási nyelvet, amely nem olyan egyszerű, mint a másik két említett nyelv. De ne aggódj, csak az alapokat kell megtanulnod.

   

   A HTML, a CSS és a JavaScript elegendő lesz egy alap- vagy középszintű webhely felépítéséhez. Ez a weblap is, amin olvasol minket lényegében ezen három nyelv segítségével épült fel.

   A HTML, CSS és JavaScript elsajátításának legjobb forrásai

   Ha a tanulásra fogsz tudni koncentrálni, akkor néhány hét vagy hónap elegendő lesz ahhoz, hogy elsajátítsd ezeknek a nyelveknek az alapjait. Ezek ismeretében képes leszel egy weboldalt összeállítani. Minél több időt töltesz a tanulással és gyakorlással, annál összetettebb webhelyeket tudsz majd felépíteni. Az alábbiakban megtalálod a szerintünk legjobb tanulási forrásokat.

   • Mike Dane ingyenes HTML, CSS és JavaScript oktatóanyagai

     Messze ezek a legjobb oktatóanyagok a kezdők számára. Rövidek, lényegre törőek, könnyen követhetők, ingyenesek. Itt található egy link a weboldalára: mikedane.com

   • A W3 Schools weboldala

     A W3 Schools egy könnyen követhető, jól szervezett webhely, ahol megtalálhatod az összes szükséges dolgot. A weboldal play-it funkciójának köszönhetően mindent kipróbálhatsz a gyakorlatban. Nem lesz szükséged a weboldalon lévő tudásanyag felére sem, mivel az minden apró részletre kiterjed. Ne próbálkozz az első témától az utolsóig végigmenni az oldalon, mert tényleg nem lesz mindenre szükséged, és ha mégis szükséged van valamilyen különlegesebb kódrészre, bármikor újra felkeresheted a webhelyet. Tanuld meg az alapokat Mike Dane videókból, majd nézd meg a W3 Schools weboldalán is a tanultakat, és próbáld ki a gyakorlatban.
     
     Egyesek szerint a W3 Schools nem jó tanulási forrás, mert állítólag hibákat tartalmaz, stb. De ha megkérdezel egy ilyen embert, aki kritizálja az oldalt, hogy hol van hiba konkrétan, nem fogja tudni megmondani. Ne foglalkozz ezekkel a kritikákkal. Egyesek úgy gondolják, hogy minden apró részletet hibátlanul kell megtanulniuk ahhoz, hogy jó programozóvá váljanak. Ők általában más forrásokból próbálnak tanulni, például a developer.mozilla.org weboldalról, amely valóban nagy mennyiségű tudásanyagot tartalmaz, de sajnos onnan nem lehet hatékonyan tanulni, mert könnyen elvész az ember a részletekben.

   • Udemy tanfolyamok

     Az Udemy.com-on oktatóanyagok gyűjteményét találod minden témában, beleértve a webfejlesztést is. Azt állítják, hogy ez a világ legnagyobb tanfolyamszolgáltatója, több mint 100 000 online video oktatóanyaggal. Biztosak vagyunk benne, hogy megtalálod a számodra megfelelőt. Kiemelhetünk egy kurzust onnan - hogy legyen honnan elindulni - egy egyszerű és érthető videósorozatot a HTML-ről, CSS-ről és JavaScript-ről. A tanfolyam szerzője Rob Percival, a címe pedig The Complete Web Developer Course. Nem állítjuk, hogy minden hibátlan abban az oktatóanyagban, de nagyon jó.
     
     Gyakran találhatsz kedvezményes kuponokat, melyekkel letölthetsz Udemy tanfolyamokat 10 dollár körüli összegből. Ha keresel, az interneten megtalálhatsz sok Udemy videót ingyenesen is. Próbálj rájukkeresni a Google-vel. Próbálj meg fájlmegosztó szolgáltatásokban is keresgélni, ha tagja vagy ilyennek.

   • Könyvek

     Abban az esetben, ha inkább a hagyományos tanulási módszert részesíted előnyben, néhány hasznos könyvet tudunk ajánlani.

     • Jon Duckett: HTML & CSS Design and Build Websites
     • Jon Duckett: JavaScript and JQuery - Interactive Front-End Web Development
     • Michael Morrison: Head First JavaScript

     A számítástechnikával kapcsolatos szakkönyvek elég drágák, ezért ha spórolni szeretnél, próbálj rákeresni a könyvek címére a Google keresőjében. Néha megtalálhatod a letölthető e-book verzióját a könyveknek.

   Ha eddig a pontig eljutottál, akkor már rendelkezel egy domain névvel és tárhelyszolgáltatással, tudod az alapokat és elkészíthetsz egy weboldalt HTML, CSS és JavaScript használatával. Megvan a szükséges ismereted, hogy átlásd a témát, és kitaláld, melyik irányba szeretnél továbbmenni. Tanulhatsz több másik programozási nyelvet, lehetsz front-end vagy back-end fejlesztő, vagy új webhelyeket hozhatsz létre. Ezekről a dolgokról később egy új cikkel tervezünk jelentkezni.

   A fentiekben adott tanácsok rövidnek és túl egyszerűnek tűnhetnek, de hidd el, még így is hetek vagy hónapok kellenek ahhoz, hogy rájöjj, hogyan építsd fel weboldalad kódolással. Reméljük, hogy az itt nyújtott tanácsok rengeteg időt takarítanak meg neked, hiszen azok többszáz órás keresésbe, kutatásba, kudarcokba és próbákba kerültek nekünk. Ha más utat választasz, más forrásokat részesítesz előnyben, vagy más módon tanulsz, az is rendben van. Ha találsz jó minőségű tananyagot, oszd meg velünk is!
   
   Még egy dolgot megemlítenénk itt. Ne csüggedj, ha jobban belemerülsz a webfejlesztés témájába, és úgy érzed, hogy a tananyag túl bonyolult a számodra. Mindannyian éreztünk hasonlót. De tudd, hogy nem kell mindent egyszerre elsajátítanod, csak az alapokat. Később megtapasztalod a webfejlesztők úgynevezett imposztor (szélhámos) szindrómáját is. Ez egy olyan érzés, amelyet néha minden webfejlesztő megtapasztal. Azt érzed ilyenkor, hogy nincs elég tudásod, és csak úgy teszel, mintha lenne. Mintha csak imitálnád, hogy te webfejlesztő vagy. Ez az érzés azért jöhet elő, mert a webfejlesztés témájában szinte korlátlan az ismeretek mennyisége. Újabb és újabb megoldások és programozási nyelvek jelennek meg, és nehéz lépést tartani velük. Mindig azt érezheted, hogy sohasem tudsz eleget. Ezzel az érzéssel együtt kell élned.