Satura rādītājs
Mūsdienās HTML5 izstrāde ir standarts, jo tā darbojas pārlūkprogrammā vai mobilajās ierīcēs, izmantojot hibrīda lietojumprogrammas. Ja lietojumprogramma vai vietne darbojas pārlūkā Chrome, Firefox vai citā pārlūkprogrammā un ir pielāgota mobilo ierīču ekrāna izšķirtspējai, tāpēc bez lielām izmaiņām mums ir pieejama arī mobilā lietojumprogramma Android vai IOS.
Viens no vissvarīgākajiem bezmaksas programmēšanas rīkiem ir Netbeans, jo tas ļauj jums izveidot tradicionālas vietnes vai vietējās vai hibrīdās mobilās lietojumprogrammas.
[color = # 006400] Lejupielādēt spraudni [/ color] [color = # 006400] HTML5 izklaides pakotne [/ krāsa]
PALIELINĀT
Tālāk mums jāinstalē spraudnis, lai to paveiktu:
- Rīki
- Iespraust
- Lejupielādētā cilne
- Mēs noklikšķinām uz pogas Pievienot spraudni
- Mēs meklējam lejupielādēto failu ar paplašinājumu nbm.
PALIELINĀT
Pēc instalēšanas mēs varam izmantot komponentus no HTML rīku paletes.
Mēs izveidosim HTML5 projektu, lai redzētu tā funkcijas un komponentus.
Mēs gatavojamies:
- Fails
- Jauns projekts
- Mēs izvēlamies HTML5 lietojumprogrammu, lai izveidotu tukšu vai tukšu projektu
Nākamajā ekrānā tas lūgs mums piešķirt savam projektam nosaukumu un direktoriju, kur to saglabāt, pēc tam mēs noklikšķiniet uz pogas Tālāk. Šeit mums būs vairākas iespējas, piemēram: Nelietot veidni (bez vietnes veidnes)
Izvēloties veidni (Select Template), varat izvēlēties no veidnes, kas atrodas datora direktorijā, vai norādīt veidnes .zip faila atrašanās vietu URL. Varat ierakstīt .zip faila URL vai noklikšķināt uz Pārlūkot, lai norādītu atrašanās vietu vietējā sistēmā. Veidojot projektu, pamatojoties uz vietnes veidni, faili, bibliotēkas un projekta struktūra tiek kopēti projektu direktorijā, piemēram, bezmaksas veidņu vietnē.
PALIELINĀT
Mēs ņemsim pirmo veidni, kuras saite uz zip failu ir šāda:
http: //cdn.freehtml5… imcreatives.zip
Mēs izvēlamies iespēju
Atlasiet Veidne un nokopējiet saiti tekstlodziņā Veidne. Pēc tam mēs noklikšķiniet uz Tālāk.
PALIELINĀT
Tad nākamajā ekrānā mēs varam pievienot bibliotēkas, ja tas ir nepieciešams mūsu attīstībai, un Netbeans tās pievienos mūsu projektam.
PALIELINĀT
Mēs redzam, ka tā atpazina vairākas Javascript bibliotēkas, un mēs arī paši pievienojām Jquery.
Pēc tam mēs noklikšķinām uz Pabeigt, un Netbeans parūpēsies par veidnes izpakošanu un visu projekta failu pasūtīšanu.
PALIELINĀT
Rīkjoslā mums ir nolaižamais atlasītājs, lai pārbaudītu lietojumprogrammu dažādās ierīcēs, piemēram, pārlūkprogrammās, mobilajās ierīcēs, SmartTV un emulatoros, piemēram, Apache Cordoba operētājsistēmai Android, tāpēc mums ir jāinstalē Android SDK un AVD pārvaldnieks. AVD pārvaldnieks nodrošina grafisku lietotāja interfeisu, kurā varat izveidot un pārvaldīt Android virtuālās ierīces (AVDS), kas nepieciešamas Android emulatoram.
PALIELINĀT
Šajā gadījumā mēs izvēlamies Firefox, pēc tam mēs noklikšķinām uz zaļās bultiņas, lai palaistu projektu, un rezultātā veidne darbojas lokāli.
PALIELINĀT
Vēl viens veids, kā izveidot projektu ar veidnēm, ir izmantot veidnes no vietnes www.initializr.com. Initializr ir HTML5 veidņu ģenerators, lai palīdzētu jums sākt darbu ar jaunu, uz HTML5 balstītu projektu. Tas ģenerē pielāgojamu veidni ar tīru un viegli saprotamu kodu, tajā ir arī visi nepieciešamie pamatelementi un sastāvdaļas.
PALIELINĀT
No Netbeans mums tikai jāizvēlas izmantojamās veidnes veids, un tas automātiski ģenerēs projekta kodu un struktūru.
Piemēram, mēs jaunam projektam izvēlamies Boostrap tipa veidni.
PALIELINĀT
Mēs noklikšķinām uz Tālāk un atkal tas ļaus mums izvēlēties un pievienot vairāk Jquery bibliotēku, ja mums tās ir vajadzīgas, un pēc tam noklikšķiniet uz Pabeigt.
Mēs redzēsim, kā ir izveidota HTML5 projekta struktūra, un labajā pusē mēs redzēsim paleti ar iepriekš instalētā spraudņa komponentiem.
PALIELINĀT
Mēs vadām projektu tāpat kā iepriekš vai arī nospiežot taustiņu F6. Rezultāts būs vienkārša veidne, lai sāktu mūsu projektu.
PALIELINĀT
Tālāk mēs pārbaudīsim veidni
Atsaucīgs no Initializr ar tām pašām iepriekšējām darbībām, un mēs redzēsim rezultātu, kad tas tiks izpildīts pārlūkprogrammā.
PALIELINĀT
Ja mēs vēlamies pārbaudīt savu lietojumprogrammu pārlūkā Google Chrome, mums jāinstalē spraudnis, kas savieno Netbeans ar Chome.
PALIELINĀT
Mums ir jāpiekļūst mūsu Google kontam, izmantojot mūsu Gmail, lai atļautu spraudņa instalēšanu pārlūkā Google Chrome, tad mēs varam bez problēmām palaist un apskatīt lietojumprogrammu.
Viena no Google Chrome izmantošanas priekšrocībām ir tā, ka, ar peles labo pogu noklikšķinot uz ekrāna, mēs varēsim piekļūt elementu inspektoram, un mums būs daudz utilītu, lai pārskatītu mūsu lietojumprogrammu, no kurām viena simulē lietojumprogrammu dažādās mobilajās ierīcēs un izšķirtspējā.
PALIELINĀT
Piekļūstot šai ikonai, mēs varam simulēt savu lietojumprogrammu mobilajos tālruņos un klēpjdatoros, piemēram, Ipad, Iphone, LG, Samsumg, Notebook.
Piemēram, mēs simulējam savu lietojumprogrammu, kas darbojas ar iPhone 6 ar 30 Mb / s Wi-Fi savienojumu
Tālāk apskatīsim HTML5 paletes komponentus. Izveidosim tukšu vai tukšu HTML5 projektu. Mēs pievienojam Jquery 2.0.3 bibliotēku un izveidojam projekta struktūru. Komponentu palete, ja tā nav redzama ekrānā, ir iespējota no Windows izvēlnes> Ide Tools Palette
Mūsu failā index.html koda sadaļā
Mēs velkam komponentu Datu saraksts un nometam to, mēs redzēsim, ka koda bloks tiks automātiski izveidots kā piemērsValsts:
Ja mēs palaižam savu lietojumprogrammu, mēs redzēsim, kā darbojas nolaižamā izvēlne; rakstīšanas laikā ir atļauts pat filtrēt jutīgumu, tas automātiski filtrēs sarakstu, kurā ir nolaižamā izvēlne
Nomainīsim Netbeans ģenerēto kodu un izvilksim atlasītos datus no datu saraksta, Jquery atsaucoties uz katra elementa ID
Valsts: skatiet valsti
Mēs palaižam lietojumprogrammu un redzam, ka tā atgriež rezultātu ar atlasītās valsts nosaukumu:
Mēs varam arī nosūtīt datu sarakstu ar veidlapu un uztvert atlasītos datus un saglabāt tos datu bāzē
Nepieciešamā paletes sastāvdaļa ļauj mums pievienot veidlapā elementu kā obligātu, piemēram, šādu kodu ar diviem obligātajiem obligātajiem laukiem:
Vārds: e -pasts
Izpildot šo kodu, mēs redzam, ka veidlapu nevarēs nosūtīt, ja abi lauki nebūs aizpildīti.
SecinājumsŠajā apmācībā mēs esam redzējuši dažus rīkus, kas palīdzēs mums ātrāk izstrādāt un pārbaudīt lietojumprogrammas HTML5 un Jquery, pat bez gandrīz jebkura sarežģīta koda ieprogrammēšanas. Turpmākajās apmācībās mēs turpināsim progresēt gan tradicionālo, gan mobilo HTML5 un Jquery lietojumprogrammu izstrādē.Vai jums patika šī apmācība un palīdzējāt tai?Jūs varat apbalvot autoru, nospiežot šo pogu, lai sniegtu viņam pozitīvu punktu
