Yadda ake Ƙirƙirar Babban Aikin HTML5 a Ubuntu Amfani da Netbeans
A cikin wannan jerin ci gaban yanar gizo na wayar hannu mai lamba 4, za mu bi ku ta hanyar kafa Netbeans azaman IDE (wanda kuma aka sani da Haɗin Ci gaban Muhalli) a cikin Ubuntu don fara haɓaka aikace-aikacen yanar gizo na HTML5 masu dacewa da wayar hannu da amsa.
Masu zuwa sune jerin jigo 4 game da ci gaban yanar gizo na HTML5 Mobile:
Kyakkyawan yanayin aiki (kamar yadda za mu gani daga baya), ƙaddamarwa ta atomatik don harsuna masu tallafi, da haɗin kai tare da masu binciken gidan yanar gizo, a ra'ayinmu, wasu daga cikin Netbeans, mafi bambanta fasali.
Bari mu kuma tuna cewa ƙayyadaddun HTML 5 ya kawo fa'idodi da yawa ga masu haɓakawa - don suna wasu misalan: lambar mai tsabta godiya ga sabbin abubuwa da yawa), abubuwan da aka gina a cikin bidiyo da damar sake kunna sauti (wanda ya maye gurbin buƙatar Flash), daidaitawar giciye. tare da manyan masu bincike, da ingantawa don na'urorin hannu.
Kodayake da farko za mu gwada aikace-aikacen mu akan injin haɓakar gida namu, a ƙarshe za mu matsar da gidan yanar gizon mu zuwa sabar LAMP kuma mu mai da shi kayan aiki mai ƙarfi.
Tare da hanyar, za mu yi amfani da jQuery (sanannen ɗakin karatu na Javascript na giciye wanda ke sauƙaƙa rubutun gefen abokin ciniki), da Bootstrap (samuwar HTML, CSS, da JavaScript don haɓaka gidajen yanar gizo masu amsawa). Za ku ga labarai masu shigowa yadda suke da sauƙi don saita aikace-aikacen abokantaka ta wayar hannu ta amfani da waɗannan kayan aikin HTML 5.
Bayan kun shiga cikin wannan ɗan gajeren jerin, za ku iya:
amfani da kayan aikin da aka siffanta anan don ƙirƙirar ainihin aikace-aikacen HTML5 masu ƙarfi, da
ci gaba da koyan ƙwararrun ci gaban yanar gizo.
Koyaya, da fatan za a lura cewa duk da cewa za mu yi amfani da Ubuntu don wannan jerin, umarnin da hanyoyin suna da inganci ga sauran rarrabawar tebur (Linux Mint, Debian, CentOS, Fedora, kuna suna).
Don wannan, mun zaɓi shigar da software masu dacewa (Netbeans da Java JDK, kamar yadda za ku gani a cikin minti daya) ta amfani da tarball (.tar.gz) a matsayin hanyar shigarwa.
Abin da ake faɗi - bari mu fara da Sashe na 1.
Shigar da Java JDK a cikin Ubuntu
Wannan koyawa tana ɗauka cewa kun riga kun sami shigarwar tebur na Ubuntu a wurin. Idan ba haka ba, da fatan za a koma zuwa Matei Cezar kafin ci gaba.
Tun da sigar Netbeans da ke akwai don zazzagewa daga ma'ajiyar hukuma ta Ubuntu ta ɗan tsufa, za mu zazzage fakitin daga gidan yanar gizon Oracle don samun sabon salo.
Don yin wannan, kuna da zaɓi biyu:
Zaɓi 1: Zazzage dam ɗin da ya haɗa da Netbeans + JDK, ko
Zaɓi 2: Shigar da kayan aikin biyu daban.
A cikin wannan labarin za mu zaɓi #2 saboda wannan ba wai kawai yana nufin zazzagewa ne wanda ya ɗan ƙarami ba (kamar yadda za mu shigar da Netbeans kawai tare da tallafi don HTML5 da PHP) amma kuma zai ba mu damar samun mai sakawa JDK mai zaman kansa idan muna buƙatar shi. wani saitin da baya buƙatar Netbeans ko haɗa ci gaban yanar gizo (mafi yawan alaƙa da sauran samfuran Oracle).
Don sauke JDK, je zuwa shafin yanar gizon Fasaha na Oracle kuma kewaya zuwa sashin Java → Java SE → Zazzagewa.
Lokacin da ka danna hoton da aka haskaka a ƙasa, za a nemi ka karɓi yarjejeniyar lasisi sannan za ka iya zazzage nau'in JDK da ake buƙata (wanda a cikin yanayinmu shine kwalta don injin 64-bit). Lokacin da mai binciken gidan yanar gizon ku ya sa, zaɓi adana fayil ɗin maimakon buɗe shi.
Lokacin da zazzagewar ta cika, je zuwa ~/ Zazzagewa kuma cire kwal ɗin zuwa /usr/local/bin:
$ sudo tar xf jdk-17_linux-x64_bin.tar.gz -C /usr/local/bin
Shigar da Netbeans a cikin Ubuntu
Don shigar da Netbeans tare da goyan bayan HTML5 da PHP, je zuwa umarnin wget don saukewa kamar yadda aka nuna.
Daga sa'an nan, bi umarnin kan allo don kammala shigarwa barin tsoffin dabi'u:
kuma jira shigarwa don kammala.
Ƙirƙirar Tsarin HTML5 na asali a cikin Ubuntu
Don buɗe Netbeans, zaɓi shi daga menu na Dash:
Don ƙirƙirar sabon aikin HTML5 ta amfani da ainihin samfurin da Netbeans ke bayarwa, je zuwa Fayil → Sabon aikin → HTML5 → Aikace-aikacen HTML5. Zaɓi suna mai siffata don aikin ku kuma a ƙarshe danna Gama (kada ku haɗa da samfurin rukunin yanar gizo na waje ko ɗakunan karatu na javascript a wannan lokacin):
Daga nan za a kai mu zuwa Netbeans UI, inda za mu iya ƙara manyan fayiloli da fayiloli zuwa Tushen Mu kamar yadda ake buƙata. A cikin yanayinmu, wannan yana nufin ƙara manyan fayiloli don fonts, hotuna, fayilolin Javascript (rubutun), da zanen salo na cascading (salo) don taimaka mana mafi kyawun tsara abubuwan mu a cikin labarai masu zuwa.
Don ƙara babban fayil ko fayil, danna-dama akan Tushen Yanar Gizo sannan zaɓi Sabon → Jaka ko fayil ɗin HTML.
Yanzu bari mu gabatar da wasu sabbin abubuwan HTML5 kuma mu gyara jikin shafin:
da
yana wakiltar babban abun ciki na takarda, inda aka nuna babban jigo ko ayyuka.
Ana amfani da
don abubuwan da suka ƙunshi kansu, kamar hotuna ko lamba, don suna wasu ƴan misalai.
yana nuna taken ga wani abin , don haka dole ne a sanya shi cikin alamun .
An tanada
. Yanzu kwafi snippet code mai zuwa zuwa fayil ɗin index.html a cikin Netbeans.
NASIHA: Kada ku kwafa da liƙa daga wannan taga zuwa yanayin ci gaban ku, amma ku ɗauki lokaci don rubuta kowane tag don ganin fasalin aikin Netbeans na atomatik, wanda zai zo da amfani daga baya.
!DOCTYPE html>
<html>
<head>
<title>TODO supply a title</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body>
<header style="background-color: #6699CC">THIS IS A HEADER</header>
<main>
<article>
<p>This is some sample text.</p>
<p>Another line of sample text for this HTML 5 article</p>
<aside>
<figure>
<img src="https://www.w3.org/html/logo/downloads/HTML5_Logo_256.png" alt="HTML 5 logo" />
<figcaption>Figure 1: The HTML 5 logo</figcaption>
</figure>
<h2>Web development basics series at linux-console.net</h2>
<h3><a href="http://dev.w3.org/html5/html-author/">This is HTML 5!</a></h3>
<p>Some text here</p>
</aside>
</article>
</main>
<footer style="background-color: #CC6699">THIS IS A FOOTER</footer>
</body>
</html>
Kuna iya duba shafin ta zaɓar mai binciken gidan yanar gizo (zai fi dacewa Firefox, kamar yadda yake cikin hoton da ke ƙasa) kuma danna gunkin Play:
Kuna iya duba ci gaban ci gaban ku zuwa yanzu:
Takaitawa
A cikin wannan labarin, mun sake nazarin wasu fa'idodin rubuta aikace-aikacen yanar gizon ku ta amfani da HTML 5 kuma mun kafa yanayin haɓakawa tare da Netbeans a cikin Ubuntu.
Mun koyi cewa wannan ƙayyadaddun harshe ya gabatar da sababbin abubuwa kuma ta haka ya ba mu damar rubuta lambar tsabta da kuma maye gurbin abubuwan da ke fama da yunwa kamar fina-finai na Flash tare da ginanniyar sarrafawa.
A cikin labaran da ke zuwa, za mu gabatar da jQuery da Bootstrap ta yadda ba za ku iya amfani da waɗannan sarrafawa kawai ba kuma ku kalli shafukanku da sauri, amma kuma ku sa su zama abokantaka ta hannu.
A halin yanzu, jin kyauta don gwaji tare da wasu sarrafawa a cikin Netbeans, kuma sanar da mu idan kuna da tambayoyi ko sharhi ta amfani da fom ɗin da ke ƙasa.
