Úvod do vývoja webových aplikácií

HTML 5 logo on an iPhone smartphone with app icons around it in a cloud
Vitajte na webe.

Back in môj deň (OK, pred môj deň), profesie webový vývojár bol nízky jeden. Je zaradený pod šteňa nenávidia, ale predovšetkým Yankees ventilátorom na stupnici profesijnej cti. Vzhľadom k tomu, zo všetkých značiek a transparentnosť dištančnými obrázkov sme použili, sme boli videní ako hrubé hackerov bez zmyslu pre estetiku.

Dobre, môžeme byť stále chýba zmysel pre estetiku, ale ako Web vyvinula tak má povolania webový vývojár. V týchto dňoch existuje nespočetné množstvo nástroje, ktoré môžete použiť, aby dobre napísaný, štandardy, v súlade, a krásna (OK, možno nie, že posledný) webové stránky. Väčšina veľkých internetových stránok, ktoré používate dnes (nepoctivé konektor: vrátane tohto) sú vytvorené pomocou týchto nástrojov.

Naše húf nástrojov na konci prehliadača nám umožnili vytvoriť veci na webe, ktoré boli nepredstaviteľné len 10 pred rokmi, ako je nespočetné množstvo sociálnych sietí vyhlasovať, že je najlepší spôsob, ako strácať čas, “horúci” tech začínajúcich vyhlasovať, že revolúciu niečo, čo už urobil tisíckrát, a Angry Birds klony tvrdí, že je len o málo horší ako originál. Všetko na webe. Takže možno tieto nástroje doteraz išli do najväčšie využitie.

Takže aké sú tieto úžasné nástroje, som hovoril o? Vedúci, ako boli (úprimne úžasné) jazyky tzv HTML5, CSS3, a JavaScript, ktoré som prezývka 3 jazdci na webocalypse. Tu je pohľad na každú z nich:

HTML

HTML (vhodne známy ako HyperText Markup Language; môžete vidieť, prečo ľudia, ktorí nechcú vyzerať zle, stačí použiť skratku) je jazyk používaný na rozvrhnutie webových stránok. Kliknite pravým tlačidlom myši na tejto stránke a kliknite na tlačidlo “Zobraziť zdroj”. To je HTML, ktorý používa túto stránku.

V podstate, HTML je banda tagy, ktoré prehliadač interpretuje a vyloží. Napríklad, pozrite sa na tento HTML kód:

<p>Neviem o vás, ale páči sa mi tlačidlami.</p>

<br>

<tlačidlo>Kliknite na mňa!</tlačidlo>

Tento kód HTML je text, zabalené v odseku (the <p> tag začína odsek, the </p> značka ukončuje odsek.) Je tu koniec riadku (the <br>) a potom tlačidlo môžete kliknúť na hrdlo ráči. Váš prehliadač položí ju na obrazovke pre vás.

Tak to je všetko v poriadku a dobre. Ale ak nemáte nič než HTML, you get a webpage that looks like it came straight out of the 1990’s. Nie moc dobre vyšiel z tohto desaťročia rovnako (účesy, hudba, atď) Ale počkajte! K dispozícii je viac!

CSS

Ďalšie skratka. Leto. CSS je skratka pre Cascading Style Sheets, ktorý je trochu nesprávne pomenovanie, pretože to nie je naozaj kaskády (čo to znamená… je to počítačový kód, nie vodopád!) CSS je jazyk používaný na štýle stránok. Tento, príliš, je interpretovaný svojom prehliadači.

CSS a HTML spolupracovať – HTML umožňuje rozloženie stránke je, CSS dáva svoj talent. Predstavte si, že stavia dom: HTML poskytuje fádny, ale nevyhnutný drevený rámec, CSS pridá neónové farby a nepredvídateľný nábytok.

CSS je celkom jednoduchý jazyk: pre určitý HTML tagu (ako odseky), môžete zadať hodnoty pre výučbu rôznych štýlov. Váš prehliadač bude čítať CSS a použiť ju na všetky zodpovedajúce HTML tagy na. Napríklad:

p {

farba: červený;

font-size: 16px;

}

Takže každý bod (veci v HTML <p> tagy) bude mať červený písmo a musí byť 16 pixelov. Ak ste si všimli,, to sú len niektoré z rovnakých štýlov, ktoré môžete použiť v aplikácii Microsoft Word a ďalšie aplikácie.

Takže teraz vaše webové stránky sú stanovené a vyzerajú pekne. Ale tu je to vec: to je všetko, čo robia. Sú tam len tak sedieť a pozerať sa celkom. Čo je skvelé a všetky, ale používatelia webu chcú viac. Chcú efektné animácie. Chcú pop-up okná (OK, Možno to urobili v roku 2002, ale ja som odbočil.) Chcú tlačidlá, ktorá bude robiť veci, keď na ne kliknete.

O tomto poslednom – to je otázka. Môžete urobiť <tlačidlo> vo formáte HTML, a môžete na neho celý týždeň, ale to nič nerobí v dohľadnej dobe. Ak chcete na tlačidlo, oh ja neviem, presunúť slona po obrazovke a napadnúť niečo, then you need something more.

JavaScript

JavaScript je nie skratka, ak ste boli zvedaví. Nazývali ju JavaScript, pretože to vyzeralo, že programovací jazyk Java, čo je divné, pretože to nie je. V každom prípade, JavaScript je a proper programming language that causes all the dynamic effects môžete vidieť na webe.

Rovnako ako každý programovací jazyk, JavaScript je sériu príkazov, ktoré tvoria premenné a používať funkcie. V pohode časť o JavaScriptu (dobre, as cool as a programming language can be) is that you can access those HTML elements (like paragraphs and buttons) and CSS styles (like font color and size) and change them. Look at this code:

var paragraph = $(‘p’);

paragraph.css(‘color’,’blue’);

This JavaScript code will find all the paragraphs on the page – the $ sign tells the browser to find all matching elements, and the ‘pmeans it needs to choose paragraphs (remember the <p> element from HTML?) Then you can store the paragraphs to a variable, and the command the browser to change their color CSS style to modrý.

Čo mi pripadá zaujímavé (znovu, to je všetko, z hľadiska “webdev”) je, ako elegantne tri jazyky spolupracovať. Ten posledný riadok JavaScriptu v styku s HTML na stránky a CSS slúžia k jeho štýl. Nie je to tak, tieto jazyky sú len rôzne súčasti tej istej veci – sú jedno a to isté, rôzne strany tej istej úžasné stroje.

Zvuk fascinujúce? Myslím, že áno. To je len časť krásu webe.

Vydalo

Neel Mehta

Harvard College. Web developer. Niekedy filozof. Baseball feťák.

One thought on “Úvod do vývoja webových aplikácií”

  1. wow was surprised to find out that u wrote it, good job it is a nice lead into this for me before i go to sawyer’s web programming packets.

Pridaj komentár