Aloittelijan tiekartta verkkokehitykseen

Tässä aloittelijan etenemissuunnitelmassa esitetään kaikki verkkokehityksen perusteet. Käymme läpi jokaisen vaiheen - mietitään, mitä koodieditoria käytetään, mihin JavaScript-kehykseen tai taustakieleen voit valita. Ja sisällytämme myös linkkejä resursseihin, joissa voit oppia nämä taidot.

Tosiasia on, että jos olet vasta aloittamassa, kaikki mitä sinun tarvitsee tietää juuri nyt, ovat perusasiat. Sinun ei todellakaan tarvitse tietää kaikkia olemassa olevia tekniikoita, työkaluja tai kieliä heti alusta alkaen. (Ylität sillan, kun tulet siihen, uskokaa minua!)

Tämän oppaan lopussa sinulla on käsitys web-kehityksen perusteista, mitä taitoja sinun on tiedettävä ja mistä ne löytyy!

1: Mikä on verkkokehitys : Kuinka verkkosivustot toimivat, käyttöliittymä vs. käyttöliittymä, koodieditori‌‌

2: Perusliittymä: HTML, CSS ja JavaScript‌‌

3: Työkalut : Pakettien hallinta, rakennustyökalut, versionhallinta‌‌

4a: Lisäosa : Sass, reagoiva muotoilu, JavaScript-kehykset‌‌

4b: Perustausta: Palvelinten ja tietokantojen hallinta, ohjelmointikieli

Tässä tiekartassa suosittelen vaiheiden 1, 2 ja 3 suorittamista järjestyksessä. Sen jälkeen voit suorittaa vaiheet 4a tai 4b missä tahansa järjestyksessä, riippuen siitä, haluatko keskittyä enemmän käyttöliittymään vai käyttöliittymään.

Henkilökohtaisesti mielestäni on hyvä idea, että käyttöliittymän web-kehittäjät tietävät ainakin vähän taustaa ja päinvastoin. Ainakin molempien perusteiden tunteminen auttaa sinua selvittämään, pidätkö etupäästä tai taustapelistä paremmin?

Voit myös tarkistaa päivitetyn version tästä artikkelista blogissani!

1: Mikä on verkkokehitys?

Ennen kuin ryhdymme varsinaiseen koodaukseen, katsotaan ensin yleisiä tietoja siitä, mitä verkkokehitys on: miten verkkosivustot toimivat, ero käyttöliittymän ja taustan välillä sekä koodieditorin käyttö.

Kuinka verkkosivustot toimivat?

Kaikki verkkosivustot ovat alkeellisimmillaan vain joukko tiedostoja, jotka tallennetaan palvelimeksi kutsuttuun tietokoneeseen . Tämä palvelin on yhteydessä Internetiin. Tämän jälkeen voit ladata kyseisen verkkosivuston selaimella (kuten Chrome, Firefox tai Safari) tietokoneellesi tai puhelimeesi. Selaimesi kutsutaan myös asiakkaaksi tässä tilanteessa.

Joten joka kerta kun olet Internetissä, sinä (asiakas) haet ja lataat tietoja (kuten kissakuvia) palvelimelta sekä lähetät tietoja takaisin palvelimelle ( lataa moar kissakuvia! ) Tämä takaisin ja asiakkaan ja palvelimen välillä on Internetin perusta.

Web-kehittäjä on rakentanut kaiken, mitä voit käyttää selaimessasi. Joitakin esimerkkejä ovat pienyritysten verkkosivustot ja blogit yksinkertaisemmalla puolella aina erittäin monimutkaisiin verkkosovelluksiin, kuten AirBnb, Facebook ja Twitter.

Mitä eroa on käyttöliittymän ja taustapään välillä?

Termit "käyttöliittymä", "takapää" ja "täysi pino" -verkkokehittäjä kuvaavat mitä asiakas / palvelinasuhteen osaa työskentelet.

"Etuosa" tarkoittaa, että olet tekemisissä pääasiassa asiakaspuolen kanssa. Sitä kutsutaan "käyttöliittymäksi", koska se näkyy selaimessa. Käänteisesti "takapää" on osa verkkosivustoa, jota et voi nähdä, mutta se käsittelee paljon logiikkaa ja toiminnallisuutta, joka on välttämätöntä, jotta kaikki toimisi.

Yksi tapa ajatella tätä on, että käyttöliittymän verkkokehitys on kuin ravintolan "talon etuosa". Se on osa, jossa asiakkaat tulevat katsomaan ja kokemaan ravintolaa - sisustus, istumapaikat ja tietysti syöminen ruokaa.

Toisaalta verkkopohjainen kehitystyö on kuin ravintolan "talon takana" -osa. Siellä hallitaan toimituksia ja varastoja, ja kaikki ruoan luomisprosessi tapahtuu. Kulissien takana on paljon asioita, joita asiakkaat eivät näe, mutta he kokevat (ja toivottavasti nauttivat) lopputuotteen - herkullisen aterian!

Hauskojen piirrosten lisäksi sekä etu- että takaosan verkkokehitys palvelevat erilaisia ​​mutta erittäin tärkeitä toimintoja.

Koodieditorin käyttäminen

Kun rakennat verkkosivustoa, tärkein työkalu, jota käytät, on koodieditori tai IDE (integroitu kehitysympäristö). Tämän työkalun avulla voit kirjoittaa verkkosivun muodostavan merkinnän ja koodin.

Siellä on melko paljon hyviä vaihtoehtoja, mutta tällä hetkellä suosituin koodieditori on VS Code. VS Code on kevyempi versio Visual Studiosta, joka on Microsoftin IDE. Se on nopea, ilmainen, helppokäyttöinen, ja voit muokata sitä teemoilla ja laajennuksilla.

Muita koodieditoreja ovat Sublime Text, Atom ja Vim.

Jos kuitenkin olet vasta aloittamassa, suosittelen tutustumaan VS-koodiin, jonka voit ladata heidän verkkosivustoltaan.

Nyt kun olemme käsittäneet joitain laajempia käsitteitä siitä, mitä verkkokehitys on, käsittelemme enemmän yksityiskohtia - aloittaen käyttöliittymästä.

2: Perusosa

Sivuston käyttöliittymä koostuu kolmesta tiedostotyypistä: HTML, CSS ja JavaScript. Nämä tiedostot ladataan selaimeen, asiakaspuolelle.

Katsotaanpa tarkemmin kutakin niistä.

HTML

HTML tai HyperText Markup Language on kaikkien verkkosivustojen perusta. Se on päätiedostotyyppi, joka ladataan selaimeesi, kun katsot verkkosivustoa. HTML-tiedosto sisältää kaiken sivun sisällön, ja se käyttää tunnisteita erityyppisen sisällön merkitsemiseen.

Voit esimerkiksi luoda tageja otsikoiden otsikkojen, kappaleiden, luetteloluetteloiden, kuvien ja niin edelleen luomiseen. Itse HTML-tunnisteisiin on liitetty joitain tyylejä, mutta ne ovat melko yksinkertaisia, kuten mitä näet Word-asiakirjassa.

CSS

CSS: n tai CSS-tyylitaulukoiden avulla voit muotoilla HTML-sisältöä niin, että se näyttää hyvältä ja hienolta. Voit lisätä värejä, mukautettuja fontteja ja asettelua verkkosivustosi elementtejä haluamallasi tavalla. Voit jopa luoda animaatioita ja muotoja CSS: n avulla!

CSS: ssä on paljon syvyyttä, ja joskus ihmisillä on taipumus kiillottaa sitä, jotta he voivat siirtyä sellaisiin asioihin kuin JavaScript. En kuitenkaan voi yliarvioida, kuinka tärkeää on ymmärtää, miten muotoilu muunnetaan verkkosivujen ulkoasuksi CSS: n avulla. Jos haluat erikoistua käyttöliittymään, on välttämätöntä, että sinulla on todella vankat CSS-taidot.

JavaScript

JavaScript on ohjelmointikieli, joka on suunniteltu toimimaan selaimessa. JavaScriptin avulla voit tehdä verkkosivustostasi dynaamisen, mikä tarkoittaa, että se reagoi käyttäjän tai muiden lähteiden erilaisiin syötteisiin.

Voit esimerkiksi rakentaa "Takaisin alkuun" -painikkeen, jota kun käyttäjä napsauttaa sitä, hän vierittää takaisin ylös sivun yläosaan. Tai voit rakentaa sääwidgetin, joka näyttää tämän päivän sää käyttäjän sijainnin perusteella maailmassa.

Varsinkin jos haluat kehittää taitojasi myöhemmin Reactin kaltaisella JavaScript-kehyksellä, ymmärrät enemmän, jos otat aikaa oppia ensin tavallinen vanilja JavaScripti. Se on todella hauska kieli oppia, ja siinä voi tehdä niin paljon!

Mistä oppia HTML, CSS ja JavaScript

Minulta kysytään usein, mitkä ovat parhaat paikat oppia koodausta, ja kerron heille yleensä joitain seuraavista lähteistä. Minulla on myös perusteellisempi luettelo parhaista kursseista, joilla voit oppia verkkokehitystä, blogissani - saatat löytää siitä hyödyllisen!

Huomaa : Jotkut alla olevista linkeistä (maksullisten kurssien ja kirjojen linkit) ovat kumppanilinkkejä, mikä tarkoittaa, että saan palkkion, jos ostat niiden kautta ilman lisäkustannuksia itsellesi. Se on yksi tapa, jolla voit tukea minua tällaisten hyödyllisten resurssien luomisessa!

freeCodeCamp

Yksi suosikkipaikoistani suositella on freeCodeCamp. Se on online-koodaus bootcamp, joka on voittoa tavoittelematon ja täysin ilmainen! Rakastan tätä vaihtoehtoa, koska jos olet aloittelija ja et ole täysin varma, onko koodaus sinulle, se on matalapaineinen, riskitön tapa nähdä, pidätkö siitä.

Yksi haittapuoli freeCodeCampille on, että vaikka heillä on uskomaton opetussuunnitelma, jossa on sisäänrakennettu koodausympäristö, heillä ei ole jäsenneltyjä videoita osana sitä.

Joten jos pidät todella oppimisesta videoista, tässä on muutama vaihtoehto:

Team Treehouse

Team Treehouse on ensiluokkainen online-oppimisalusta, joka on videopohjainen ja jolla on useita kappaleita, joita voit seurata. Heillä on jopa online-tekniikan tutkinto-ohjelma, joka on kuin online-käynnistysleiri, jonka voit suorittaa 4-5 kuukaudessa.

Valitettavasti Treehouse ei ole ilmainen, mutta niillä on erilaiset kuukausittaiset tai vuosittaiset suunnitelmat budjetistasi riippuen. Heillä on ilmainen 7 päivän kokeilu, jotta voit nähdä, pidätkö siitä, ja voin myös antaa sinulle sopimuksen, jossa voit saada 100 dollaria alennuksesta yhden vuoden heidän perussuunnitelmastaan. Jos olet melko varma, että haluat osallistua verkkokehitykseen, Team Treehouse on hyvä paikka oppia.

Jos olet enemmän kertaluonteisten videokurssien fani, on joitain ilmaisia ​​ja maksettuja vaihtoehtoja:

Wes Bos

Wes Bosilla on erinomaisia ​​kursseja Flexboxin, CSS Gridin ja JavaScriptin oppimisesta. Kävin juuri hänen CSS Grid -kurssinsa, ja se oli todella perusteellinen ja hauska. Wes on hieno opettaja!

Udemy

Udemy on online-oppimisalusta, jossa on paljon upeita kursseja. Yksi erityinen, josta saatat pitää, on Jonas Schmedtmannin edistynyt CSS- ja Sass-kurssi - tämä maksettu kurssi kattaa CSS-ruudukon, flexboxin, reagoivan suunnittelun ja muut CSS-aiheet!

YouTube

YouTubessa on myös paljon ilmaisia ​​videoresursseja:

Traversy Medialla, luultavasti siellä olevalla suurimmalla verkkokehityskanavalla, on HTML Crash Course ja CSS Crash Course.

Web-suunnitteluun ja käyttöliittymään keskittyvällä kanavalla DesignCourse on myös HTML- ja CSS-opetusohjelma.

Ja freeCodeCampilla on oma YouTube-kanava, jossa on videoita, kuten Learn JavaScript -kurssi ja muita perusteellisia kursseja.

Kirjat ja artikkelit verkkokehityksestä

Jos olet enemmän lukeva henkilö, suosittelen lämpimästi seuraavaa:

Uskomattoman suosittuja Jon Duckett -kirjoja HTML: llä ja CSS: llä sekä JavaScript & jQueryllä. Nämä kirjat eivät ole ollenkaan tiheitä, valmiita oppikirjojasi. Ne ovat kauniisti suunniteltuja, todella kirjoitettuja ja niissä on paljon valokuvia ja kuvia, jotka auttavat opettamaan materiaalia.

Eloquent JavaScript on toinen kirja, josta pidän todella. Voit lukea sen ilmaiseksi heidän verkkosivuillaan tai ostaa paperikopion Amazonista, jos pidät fyysisistä kirjoista. Minulla on tämä itse, ja pidän siitä todella!

Jos haluat nähdä lisää kirjasuosituksia, tutustu postiini suositelluista kirjoista verkkokehityksen oppimiseen.

Viimeisenä mutta ei vähäisimpänä, joitain verkkosivustoja, joilla on upeita artikkeleita ja muita resursseja, ovat:

  • Mozilla Developer Network
  • CSS-temppuja
  • Smashing-lehti

3: Työkalut

Mennään nyt joihinkin muihin etupään tekniikoihin. Kuten mainitsimme, HTML, CSS ja JavaScript ovat etupään verkkokehityksen peruselementit. Niiden lisäksi on muutamia muita työkaluja, jotka haluat oppia.

Pakettien hallinta

Pakettien hallinta ovat online-kokoelmia ohjelmistoja, joista suurin osa on avointa lähdekoodia. Jokainen ohjelmisto, nimeltään paketti, on käytettävissäsi asennettavaksi ja käytettäväksi omissa projekteissasi.

Voit ajatella niitä kuten laajennuksia - sen sijaan, että kirjoitat kaiken tyhjästä, voit käyttää hyödyllisiä apuohjelmia, jotka muut ovat jo kirjoittaneet.

Suosituinta paketinhallintaa kutsutaan nimellä npm tai Node Package Manager, mutta voit käyttää myös toista johtoa nimeltä Lanka. Molemmat ovat hyviä vaihtoehtoja tietää ja käyttää, vaikka onkin parasta aloittaa npm: llä.

Jos haluat tietää lisää, voit lukea tämän artikkelin npm: n käytön perusteista.

Rakenna työkaluja

Moduulipaketit ja rakennustyökalut, kuten Webpack, Gulp tai Parcel, ovat toinen olennainen osa käyttöliittymän työnkulkua.

Perustasolla nämä työkalut suorittavat tehtäviä ja käsittelevät tiedostoja. Voit käyttää niitä kokoamaan Sass-tiedostosi CSS: ään, siirtämään ES6-JavaScript-tiedostosi alas ES5: een parempaa selaintukea varten, suorittamaan paikallista verkkopalvelinta ja monia muita hyödyllisiä tehtäviä.

Gulpilla , joka on teknisesti tehtävän juoksija, on joukko npm-paketteja, joita voit käyttää tiedostojesi kokoamiseen ja käsittelyyn.

Webpack on erittäin tehokas niputin, joka pystyy tekemään kaiken, mitä Gulp voi tehdä, sekä enemmän. Sitä on käytetty tonnia JavaScript-ympäristöissä, erityisesti JavaScript-kehyksissä (johon pääsemme vähän). Webpackin toinen alaosa on, että se vaatii paljon kokoonpanoa päästäksesi käyntiin, mikä voi olla turhauttavaa.

Paketti on uudempi paketti, kuten Webpack, mutta se on valmiiksi määritetty laatikosta, joten saat kirjaimellisesti käyntiin muutamassa minuutissa. Ja sinun ei tarvitse huolehtia niin paljon kaiken määrittämisestä.

Henkilökohtaisesti haluan käyttää Gulpia omissa käyttöliittymän työnkulkuissani, joissa haluan vain koota Sass- ja JavaScript-tiedostoni enkä tehdä liikaa muuta.

Hyödyllisiä linkkejä

Jos olet kiinnostunut Gulpista tai paketista, minulla on oppaita molemmille:

  • Gulp 4: n käyttäminen työnkulussa
  • Pika-aloitusopas pakettiin

Jos haluat lisätietoja Webpackista, tutustu seuraaviin YouTube-videoihin:

  • DesignCoursen Webpack-kaatumiskurssi
  • 10-osainen sarja Webpackissa, kirjoittanut Colt Steele

Versiohallinta

Versiohallinta (kutsutaan myös lähdekontrolliksi) on järjestelmä, joka seuraa kaikkia koodimuutoksia, jotka teet projektitiedostoissasi. Voit jopa palata edelliseen muutokseen, jos teet virheen. Se on melkein kuin äärettömät säästöpisteet hankkeellesi, ja haluan sanoa teille, se voi olla valtava hengenpelastaja.

Suosituin versionhallintajärjestelmä on avoimen lähdekoodin järjestelmä nimeltä Git. Gitin avulla voit tallentaa kaikki tiedostosi ja niiden muutoshistorian kokoelmiin, joita kutsutaan arkistoiksi.

Olet ehkä kuullut myös GitHubista, joka on Microsoftin omistama online-hosting-yritys, johon voit tallentaa kaikki Git-arkistot.

Gitin ja GitHubin oppimiseksi GitHub.com-sivustolla on joitain verkko-oppaita, jotka selittävät, miten pääset alkuun. Traversy Medialla on myös YouTube-video, joka selittää Gitin toiminnan.

4a: Lisäosa

Kun sinulla on käyttöliittymän perusteet, on vielä joitain välitaitoja, jotka haluat oppia. Suosittelen, että tarkastelet seuraavaa: Sass, reagoiva muotoilu ja JavaScript-kehys.

Sass

Sass on CSS: n laajennus, joka tekee kirjoitustyylistä intuitiivisemman ja modulaarisemman. Se on todella tehokas työkalu. Sassin avulla voit jakaa tyylisi useisiin tiedostoihin organisoinnin parantamiseksi, luoda muuttujia värien ja kirjasinten tallentamiseksi ja käyttää sekoituksia ja paikkamerkkejä tyylien uudelleenkäyttöön.

Vaikka käytät vain joitain perusominaisuuksia, kuten pesimistä, voit kirjoittaa tyylisi nopeammin ja vähemmän päänsärkyä.

Voit oppia lisää Sassista tässä Scotch.io-opetusohjelmassa sekä Dev Edin YouTube-videosta.

Reagoiva muotoilu

Reagoiva muotoilu varmistaa, että tyylisi näyttävät hyvältä kaikilla laitteilla - pöytätietokoneilla, tableteilla ja matkapuhelimilla. Reagoivan suunnittelun ydinkäytäntöihin kuuluu joustavan koon käyttäminen elementeille sekä mediakyselyjen käyttäminen tiettyjen laitteiden ja leveyksien tyylien kohdentamiseen.

Esimerkiksi sen sijaan, että asetat sisältösi staattiseksi 400 kuvapisteen levyiseksi, voit käyttää mediahakua ja asettaa sisällön leveydeksi 50% työpöydälle ja 100% mobiililaitteelle.

Verkkosivustojesi rakentaminen reagoivalla CSS: llä on välttämätöntä nykyään, koska mobiililiikenne on monissa tapauksissa nopeampaa kuin työpöydän liikenne.

Lisätietoja responsiivisesta suunnittelusta ja verkkosivustojesi reagoimisesta on tässä artikkelissa. Teen myös live-koodausvirtoja YouTube-kanavallani, missä rakennan verkkosivuston tyhjästä ja katsojat voivat esittää minulle kysymyksiä reaaliajassa!

JavaScript-kehykset

Kun sinulla on vanillisen JavaScriptin perusteet, sinun kannattaa ehkä oppia yksi JavaScript-kehyksistä (varsinkin jos haluat olla täyden pinon JavaScript-kehittäjä).

Näissä kehyksissä on valmiiksi rakennettuja rakenteita ja komponentteja, joiden avulla voit rakentaa sovelluksia nopeammin kuin alusta alkaen.

Tällä hetkellä sinulla on kolme päävaihtoehtoa: React, Angular ja Vue.

React (teknisesti kirjasto), on Facebookin luoma ja se on tällä hetkellä suosituin kehys. Voit aloittaa oppimisen siirtymällä React.js-verkkosivustolle. Jos olet kiinnostunut premium React -kurssista, sekä Tyler McGinninsillä että Wes Bosilla on upeita kursseja.

Angular oli ensimmäinen iso kehys, jonka Google loi. Se on edelleen erittäin suosittu, vaikka React on ylittänyt sen viime aikoina. Voit alkaa oppia Angularia heidän verkkosivuillaan. Gary DesignCoursella on myös Angular crash -kurssi YouTubessa.

Vue on uudempi kehys, jonka on luonut entinen Angular-kehittäjä Evan You. Vaikka se on pienempi kuin React ja Angular, se kasvaa nopeasti ja sitä pidetään myös helppona ja hauskana käyttää. Voit ottaa sen käyttöön Vue-verkkosivustolla.

Mitä puitteita sinun pitäisi oppia?

Saatat ihmetellä nyt: "Ok, no, mikä kehys on paras?"

Totuus on, että ne kaikki ovat hyviä. Verkkokehityksessä ei ole melkein koskaan yhtä ainoaa vaihtoehtoa, joka on 100% paras valinta jokaiselle henkilölle ja tilanteelle.

Valintasi määräytyy todennäköisesti työsi tai yksinkertaisesti sen mukaan, kumman pidät eniten. Jos päätavoitteesi on saada työpaikka, kokeile tutkia, mitkä puitteet näyttävät olevan yleisimpiä mahdollisissa työpaikkailmoituksissa.

Älä huoli liikaa siitä, mikä kehys valita. On tärkeämpää, että opit ja ymmärrät niiden taustalla olevat käsitteet. Lisäksi kun olet oppinut yhden kehyksen, on helpompi oppia muita (samanlaisia ​​kuin ohjelmointikielet).

Siirrytään nyt viimeiseen osioon: back-end-verkkokehitykseen!

4b: Perustausta

Verkkokehityksen tausta tai palvelinpuoli koostuu kolmesta pääkomponentista: palvelin, palvelinpuolen ohjelmointikieli ja tietokanta.

Palvelin

Kuten jo alussa mainitsimme, palvelin on tietokone, johon kaikki verkkosivustotiedostot, tietokanta ja muut komponentit on tallennettu.

Perinteiset palvelimet toimivat käyttöjärjestelmissä, kuten Linux tai Windows. Niitä pidetään "keskitetyinä", koska kaikki - verkkosivustotiedostot, taustakoodi ja tiedot tallennetaan yhdessä palvelimelle.

Nykyään on olemassa myös palvelimettomia arkkitehtuureja, mikä on hajautetumpi asennustyyppi. Tämän tyyppinen sovellus jakaa nämä komponentit ja houkuttelee kolmannen osapuolen toimittajia käsittelemään niitä kaikkia.

Nimestä huolimatta tarvitset kuitenkin jonkinlaisen palvelimen ainakin verkkosivustotiedostojesi tallentamiseksi. Joitakin esimerkkejä palvelimettomista palveluntarjoajista ovat AWS (Amazon Web Services) tai Netlify.

Palvelimettomat asetukset ovat suosittuja, koska ne ovat nopeita, halpoja eikä sinun tarvitse huolehtia palvelimen ylläpidosta. Ne sopivat erinomaisesti yksinkertaisille staattisille verkkosivustoille, jotka eivät vaadi perinteistä palvelinpuolen kieltä. Hyvin monimutkaisissa sovelluksissa perinteinen palvelimen asennus voi kuitenkin olla parempi vaihtoehto.

Jos haluat lisätietoja palvelimettomista asetuksista, Netlifyllä on informatiivinen blogiviesti, joka vie sinut läpi kaikki vaiheet staattisen verkkosivuston määrittämiseksi käyttöönotolla.

Ohjelmointikieli

Palvelimella sinun on käytettävä ohjelmointikieltä kirjoittaaksesi sovelluksesi toiminnot ja logiikat. Palvelin kokoaa koodisi ja välittää tuloksen takaisin asiakkaalle.

Suosittuja verkkokieliä ovat PHP, Python, Ruby, C # ja Java. Siellä on myös palvelinpuolen JavaScript-Node.js-muoto, joka on ajoaikaympäristö, joka voi suorittaa JavaScript-koodin palvelimella.

On myös kehyksiä, joita voit käyttää jokaisella palvelinpuolen kielellä. Aivan kuten käyttöliittymän JavaScript-kehykset, nämä taustakehykset ovat hyödyllisiä työkaluja, jotka tekevät verkkosovellusten rakentamisesta paljon nopeampaa.

Tarkastellaan luettelo yleisimmin käytetyistä verkkokehityksen ohjelmointikielistä:

C #

C # kehitettiin Microsoftin kilpailijana Java: lle. Sitä käytetään verkkosovellusten tekemiseen .NET-kehyksen, pelikehityksen kanssa, ja sitä voidaan käyttää jopa mobiilisovellusten luomiseen.

Oppimispaikat C #: #C # Programming Yellow Book, kirjoittanut Rob Miles‌‌C # perusteet Udemyyn

Java

Java on yksi suosituimmista ohjelmointikielistä, ja sitä käytetään verkkosovelluksissa sekä Android-sovellusten rakentamiseen.

Paikat oppia Java: ‌‌Yliopiston MOOC‌‌Täydellinen Java Developer Course on Udemy

Node.js

Node.js on erittäin suosittu tekniikka (Stack Overflow'n vuoden 2019 kehittäjäkyselyn mukaan). Yksi asia on huomata: se ei ole teknisesti palvelinpuolen kieli - se on Java-muoto, joka toimii palvelimella Express.js-kehyksen avulla.

Node.js: n oppimispaikat: ‌‌Node.js-opetusohjelma ohjelmoimalla Moshilla‌‌Learn Node by Wes Bos

PHP

PHP on kieli, joka hallitsee WordPressiä, joten tämä voi olla hyvä valinta, jos luulet työskenteleväsi pienyritysten verkkosivustojen kanssa, koska monet heistä käyttävät WordPressiä. Voit myös rakentaa verkkosovelluksia Laravel-kehyksellä.

Paikat oppia PHP: mm Johdatus PHP: hen mmtuts‌‌PHP kirjoittanut Edwin Diaz Udemyssa

Python

Python on kasvamassa suosiotaan, varsinkin kun sitä käytetään tietojenkäsittelyssä ja koneoppimisessa. Sitä pidetään myös hyvänä, koska sen syntakse on yksinkertaisempi kuin jotkut muut kielet. Jos haluat rakentaa verkkosovelluksia, voit käyttää Django- tai Flask-kehyksiä.

Paikat oppia Pythonia: ‌‌Colt Steelen moderni Python 3 -käynnistysleiri Udemyssä‌‌LearnPython.org

Rubiini

Ruby on toinen kieli, jolla on syntaksia, jota pidetään fu-oppimisessa. Voit rakentaa verkkosovelluksia Ruby on Rails -kehyksen avulla.

Paikat oppia Ruby: HOdin-projekti‌‌Ruby on Rails -opetusohjelma, Michael Hartl

Aivan kuten JavaScript-kehyksissä, ei ole parasta ohjelmointikieliä. Valintasi tulisi perustua joko henkilökohtaiseen mielenkiintoosi ja mieltymyksiisi sekä potentiaalisiin työpaikkoihin - joten tee vähän tutkimusta siitä, mikä voisi olla hyvä valinta sinulle .

Tietokannat

Kuten nimestä käy ilmi, tietokannat ovat paikka, johon tallennat verkkosivustosi tietoja. Useimmissa tietokannoissa käytetään kieltä nimeltä SQL (lausutaan "jatko"), joka tarkoittaa "strukturoitua kyselykieltä".

Tietokannassa tiedot tallennetaan taulukoihin, ja rivit ovat kuin monimutkaisia ​​Excel-asiakirjoja. Sitten voit kirjoittaa kyselyitä SQL: ään tietojen luomiseksi, lukemiseksi, päivittämiseksi ja poistamiseksi.

Tietokanta suoritetaan palvelimella käyttämällä palvelimia, kuten Microsoft SQL Server Windows-palvelimilla ja MySQL Linuxille.

On myös NoSQL-tietokantoja, jotka tallentavat tiedot JSON-tiedostoihin perinteisten taulukoiden sijaan. Yksi NoSQL-tietokantatyyppi on MongoDB, jota käytetään usein React-, Angular- ja Vue-sovellusten kanssa.

Joitakin esimerkkejä tietojen hyödyntämisestä verkkosivustoilla ovat:

Jos verkkosivustollasi on yhteydenottolomake, voit rakentaa lomakkeen siten, että joka kerta kun joku lähettää lomakkeen, hänen tietonsa tallennetaan tietokantaan.

Voit myös kirjautua sisään tietokantaan ja kirjoittaa logiikan palvelinpuolen kielelle kirjautumisten tarkistamiseksi ja todentamiseksi.

Joitakin resursseja SQL: n perusteiden oppimiseen ovat:

  • Jose Portillan täydellinen SQL Bootcamp Udemyssä
  • SQLBolt

Joitakin vinkkejä sinulle ...

Kiitos lukemisesta! Toivon vilpittömästi, että tämä opas auttaa sinua aloittamaan verkkokehityksen oppimisen.

Muutama vinkki, jotka minulla on, jos olet itseopettama reitti:

  1. Älä yritä oppia kaikkea kerralla. Valitse yksi taito oppia kerrallaan.
  2. Älä hyppää opetusohjelmasta toiseen. Kun opit, on ok tarkistaa eri resurssit nähdäksesi, mikä pidät eniten. Mutta jälleen kerran, valitse yksi ja yritä mennä läpi sen.
  3. Tiedä, että verkkokehityksen oppiminen on pitkäaikainen matka. Huolimatta tarinoista, jotka olet ehkä lukenut ihmisistä, jotka siirtyvät nollasta verkkopalvelutyön laskeutumiseen 3 kuukaudessa, pyrisin enemmän 1-2 vuoteen, jotta pääsen työvalmiiksi, jos aloitat alusta.
  4. Pelkkä videokurssin katselu tai kirjan lukeminen ei tee sinusta automaattisesti asiantuntijaa. Aineiston oppiminen on vasta ensimmäinen askel. Todellisten verkkosivustojen ja projektien (jopa vain itsellesi tarkoitettujen) rakentaminen auttaa sinua todella vahvistamaan oppimistasi.

Onnea, kun aloitat verkkokehityksen oppimisen! Jos olet kiinnostunut enemmän, tutustu tähän artikkeliin blogissani: Opi verkkokehitystä ehdottomana aloittelijana.

Haluatko seurata minua?

Lähetän minivinkkejä verkkokehitykseen Instagramissa ja Twitterissä ja luon koodausopetusvideoita YouTubeen!