Tarkib
- 01. Hangouts vaqti keldi
- 02. $ ('nur'). FadeIn ();
- 03. Sizning qo'llaringiz brauzer uchun yaratilgan
- 04. Geympadingiz bilan boshqariladigan 3D o'yinlar
- 05. iPad-da Flash-ni ishga tushirish
- 06. Smartfoningiz uchun dasturlar yozish
- 07. Ruby va Python-ni brauzeringizda ishga tushirish
- 08. OS dan mustaqil ish stoli dasturlarini yozish
- 09. Veb-serverni boshqarish
- 10. Veb-skrining va skrinshotlar
- Kutmoq! Yana ...
JavaScript 1995 yilda tug'ilganidan buyon uzoq yo'lni bosib o'tdi. Tushunmovchilik, suiiste'mol va jaholatga to'la ishonchli yo'l. Ammo vaqtlar o'zgardi, chunki so'nggi besh yil ichida JavaScript ko'proq e'tiborga sazovor bo'ldi. Ko'proq e'tiborni jalb qilgan holda, ko'plab ishlab chiquvchilar aslida JavaScript-ni ishlatishadi, uni turli xil maqsadlarda ishlatishadi va uning go'zalligidan bahramand bo'lishadi. Agar so'rasangiz, klassik "Ugly Duckling" hikoyasi.
Keyingi maqolada biz odatiy "brauzerda" mavjud bo'lganlardan farqli o'laroq JavaScript-ga tegishli 10 ta ish holatini topamiz.
01. Hangouts vaqti keldi
Facetime-ga o'xshash video aloqaning 80-yillardagi tasavvurini eslaysizmi?
Deyarli hamma joyda mavjud bo'lgan keng polosali internet va Skype deb nomlangan kichik dasturiy ta'minotning og'ir ishlatilishi tufayli bu 20 yil davom etdi.
Adobe-ning Flash va Google-ning ijtimoiy tarmoq yaratishga urinishlari bilan biz brauzerimizda videoaloqa imkoniyatlariga ega bo'ldik. Flash kabi uchinchi tomon plaginini ishlatmasdan ushbu qobiliyatlarga ega bo'lish yaxshi emasmi?
Yaxshiyamki, brauzer sotuvchilari ham xuddi shunday deb o'ylashdi va o'z dasturlarida "getUserMedia" API-ni tatbiq etishdi. Bu kameralar yoki mikrofonlar kabi qurilmalarga brauzeringizdan to'g'ridan-to'g'ri kirish uchun birinchi qadam edi.
Bunday dasturning orqa qismida server sifatida Node.js-dan foydalanib, video signalni havo orqali bir yoki bir nechta mijozga etkazish juda oson. Baxtimizga, buni yozish paytida faqat Chrome va Opera API-ni qo'llab-quvvatlamoqda, ammo boshqalar tezda yetib boradi.
Ikki tomonlama aloqa uchun toza yondashuv - bu hozirgi vaqtda WebRTC deb nomlangan Chrome. WebRTC tufayli mijozlar o'zaro tenglashtirilgan aloqa kanallarini ochib, mijozni to'g'ridan-to'g'ri mijoz bilan bog'lab qo'yishdi.
Ko'ngil ochish uchun Sindre Sorxusning 121 baytda bajarilgan Photo Booth dasturini ko'rib chiqing!
var video = document.getElementsByTagName ('video') [0],
navigator.getUserMedia ('video', successCallback, errorCallback);
funktsiya muvaffaqiyatiCallback (oqim) {
video.src = oqim;
}
function errorCallback (xato) {
console.log (xato);
}
02. $ ('nur'). FadeIn ();
Arduino mikrokontroller platformasi "qutidan tashqarida" JavaScript-ni ishlatish uchun namunali namunadir. Arduino platformasi bilan tanish bo'lmaganlar uchun, veb-saytidan juda mashhur taklif:
"Arduino - bu moslashuvchan, ishlatilishi oson bo'lgan apparat va dasturiy ta'minotga asoslangan ochiq manbali elektronika prototiplarini yaratish platformasi. Bu rassomlar, dizaynerlar, qiziquvchilar va interaktiv ob'ektlar yoki muhit yaratishga qiziquvchilar uchun mo'ljallangan."
Arduino o'zi faqat C-da yozilgan kodni qo'llab-quvvatlaydi, bu hali ham katta ahamiyatga ega emas. Bir nechta C satrlari bilan (boshqalar siz uchun bu ishni qilishgan), Arduino ketma-ket port protokoli orqali USB porti orqali buyruqlarni qabul qilishi mumkin.
Ammo JavaScript orqali qanday qilib ketma-ket portga kirish mumkin? Brauzerdan emasligi aniq.
Node.js qutqarish uchun!
Jamiyat advokati Kris Uilyamsning sa'y-harakatlari tufayli bizda tugun ketma-ket port kutubxonasi mavjud, u erda biz eski SP protokoli orqali ma'lumotlarni yuborishimiz mumkin. Bu birinchi yutuq edi, kutubxonaga asoslanib, boshqa odamlar Arduino imkoniyatlari uchun mavhumroq yondashishdi. Masalan, tugun-arduino va duino kutubxonalari.
JS tomonidan boshqariladigan Arduino dasturining hozirgi kungacha bo'lgan eng issiq va ajoyib kutubxonasi jonny-five. Bocoup-ning blogida Arduino platformasi va ko'plab plaginlar bilan qilgan ba'zi bir qaynoq ishlarini tekshiring. Shuningdek, Nikolay Onken va Yorn Zaffererdan olingan "JSConf" videosi sizga ozgina kod bilan bugungi kunda mumkin bo'lgan narsalarni aylantirishi mumkin.
03. Sizning qo'llaringiz brauzer uchun yaratilgan
Minority Report-ning kelajakdagi istiqboli (ular chirkin mashinalar emas, balki kompyuterlarni o'z qo'llari bilan boshqaradigan) har kuni yaqinlashadi. Ushbu yo'nalishda katta qadam Microsoft-ning boshqaruvchisi Kinect kamroq o'ynashga urinishi bo'ldi. Siz o'ylashingiz mumkin bo'lgan ajoyib o'yin, lekin bu JavaScript-ga nima aloqasi bor ?!
Microsoft-ning Kinect SDK-ni chiqarishi bilan ko'plab odamlar Kinect uchun brauzerdan foydalanish ko'prigidan o'tdilar. Avvalo ChildNodes-ning to'liq ishlaydigan kinect.js kutubxonasini yaratgan yigitlari, bu sizning brauzeringizda Microsoft-ning Kinect-dan foydalanishga imkon beradi.
Men ularning demolari va videolarini tekshirishni maslahat beraman, bu portlash. Ammo kinect.js kutubxonasining muhim bir kamchiligi shundaki, mijozning orqasida WebSocket server dasturi ishlashi kerak (bu aslida Kinect -> C # -> JS elimidir).
MIT shuhratining bir nechta talabalari bu devorni yiqitish uchun "DepthJS" deb nomlangan echim ustida ishlamoqdalar,
Chrome va Safari uchun Kinect-dan foydalanishni ta'minlaydigan brauzer plaginida, hatto har qanday shaklda Kinect-dan foydalanish uchun optimallashtirilmagan saytlarda ham. Hozirda DepthJS rivojlanishning dastlabki bosqichida, ammo albatta kuzatib borishga arziydi.
04. Geympadingiz bilan boshqariladigan 3D o'yinlar
Siz bugungi kunda Flash-dan tashqari brauzer o'yinini o'ynashga urinib ko'rganmisiz? Grafik imkoniyatlari ajoyib, ayniqsa Quake kabi o'yin klonlarini ko'rsangiz.
Ammo bu narsalarni o'ynatganda siz doimo klaviatura va (asosan) jirkanch sichqonchaga bog'lanib qolasiz. Bu katta kamchilik, xususan, aksion o'yinlari uchun ularni brauzerdan qaytarib turadi.
Agar siz Xbox tekshirgichingizni shaxsiy kompyuteringizga ulab, sevimli brauzer o'yinini o'ynashni boshlasangiz yaxshi bo'lmaydimi? Bu endi kelajakdagi tasavvur emas, Gamepad API-ga salom!
Agar sizning stolingiz atrofida geympad bo'lsa, uni hozir ulang va Gamepad API-dan foydalanadigan ba'zi o'yinlardan zavqlaning. Kirish elementlarini dasturlash ham bu pirojniy qismidir, ushbu kod parchasini tekshiring yoki undan ham yaxshisini o'zingiz boshqaring:
div id = "gamepads"> / div>
skript>
gamepadConnected (voqea) {
var gamepads = document.getElementById ("gamepads"),
gamepadId = event.gamepad.id;
gamepads.innerHTML + = "Gamepad ulangan (id =" + gamepadId + ")";
}
window.addEventListener ("MozGamepadConnected", gamepadConnected, false);
/ skript>
Agar siz brauzerlarning 3D imkoniyatlari haqida ko'proq bilmoqchi bo'lsangiz, uning ustiga o'rnatilgan Three.js va Jens Arpsning ochiq manbali 3D simulyatorli dvigatel Ascent-ni ko'rib chiqing. Mark Xammil ehtiyot bo'ling, biz sizga qanot qo'mondonining yana bir davomi uchun kerak bo'lishi mumkin!
05. iPad-da Flash-ni ishga tushirish
Ochiq standartlarni sevadigan va Apple muxlisi sifatida shuni tan olishim kerakki, iPad-ga va iPod-ga Flash-ni o'rnatmaganligi uchun Apple-ga minnatdorchilik bildirmoqchiman, bu haqiqatan ham HTML5, CSS3 va JavaScript kabi ochiq texnologiyalarni o'zlashtirish harakatini boshladi.
Agentlik xodimi sifatida aytishim kerakki, bu bizning mijozlarimiz uchun juda yomon holat.
Ularning aksariyati eski IE7 yoki IE8 da Flash va zamonaviy brauzerlarda hamda HTML5 orqali iDevices-da ishlaydigan interaktiv tarkibga ega bo'lish uchun boshlagan oddiy reklama yoki kampaniya uchun ikki marta to'lashlari kerak.
Eski brauzerlarning xususiyatlarini polyfilling o'z chegaralariga ega, asosan nomlangan ishlash. Xo'sh, o'sha Flashless iDevices-da Flash-ni ishga tushirish imkoniyati mavjud emasmi?
Albatta u erda bitta va u JavaScript-da qurilgan.
Tarix parchasi: 2010 yilda Tobias Shnayder Gordon nomli kichik kutubxonani chiqardi
bu SWF fayllarini to'g'ridan-to'g'ri brauzerda ishlashiga imkon berdi. Bu faqat Flash versiyasi 2gacha bo'lgan funktsiyalardan foydalanadigan reklama kabi kichik Flash fayllari uchun juda yaxshi ishladi, ammo yuqori darajadagi funksiyalar umuman kiritilmagan.
Tobias ueberJS UXEBU kompaniyasiga qo'shilganda, ular yangi g'oya bilan chiqishdi.
Shunday qilib, Bikeshed tug'ildi. Bikeshed o'zi JavaScript-ning animatsion ramkasidir, lekin shu bilan birga kompilyator bo'lishini istagan barcha narsalarga Flash-ni o'rnatish uchun JavaScript-dir (u adapterga asoslangan, shuning uchun siz xohlagan narsangiz uchun adapter yozishingiz mumkin, ammo standart xatti-harakatlar Flash-ni JavaScript-ga kompilyatsiya qilmoqda) . Bu Flash 10 va ActionScript 3-ga mos keladi. Kompilyatordan tashqari uning ko'plab xususiyatlari haqida ko'proq bilish uchun veb-sahifasini ko'rib chiqing.
06. Smartfoningiz uchun dasturlar yozish
Mobil telefonlar uchun tabiiy dasturlarni yozish - bu tosh yo'l. Bu qaysi platformani qo'llab-quvvatlamoqchi ekanligingizdan boshlanadi. Agar sizning arizangiz iPhone va iPad-da, Android-da ishlaydigan mobil qurilmada, Windows Mobile, Blackberry qurilmalarida, webOS-ga asoslangan pla ... va hokazolarda ishlasa.
Ushbu platformalarning har biri o'z API-lariga ega va asosan turli dasturlash tillaridan foydalanadi.
Agar siz brauzer urushlaridan omon qolgan bo'lsangiz, shuni aytsam, bu kurashish qiyinroq usul. Ishlab chiquvchi ushbu platformalarning hammasi uchun o'z vaqtida va byudjetida dastur yaratishi deyarli mumkin emas.
Xo'sh, nima qilish kerak? Ko'proq ishlab chiquvchilarni yollaysizmi? Ilovalar uchun ko'proq pul olinsinmi? Yoki sizning kod bazangiz har bir qurilmada ishlashiga ishonch hosil qilish uchun yaxshiroq yondashuvni topasizmi? Ko'pchiligingiz kabi, men so'nggi yondashuvni afzal ko'raman.
Ammo ushbu ilovalar nimada qurilishi kerak? Ushbu platformalarning barchasi nimaga o'xshash? Javobni bilishingiz mumkin, bu veb-brauzer va shuning uchun JavaScript-ni qidiruvi.
Bu avvalgi PhoneGap nomi bilan mashhur bo'lgan Apache Cordova g'oyasi.
Cordova - bu har bir mobil muhitning API-larini qisqartiradigan va barchasini boshqarish uchun toza JavaScript API-ni ochadigan JavaScript-ni ramkasi. Bu sizga bitta kod bazasini saqlashga imkon beradi, siz uni yaratasiz va turli xil mobil qurilmalarda joylashtirasiz.
Siz bir marta qurgan va hamma joyda ishlaydigan kick ass mobil dasturlarini yaratish uchun Cordova-dan qanday foydalanishni bilish uchun mana bu manbalarni ko'rib chiqing.
07. Ruby va Python-ni brauzeringizda ishga tushirish
Mozilla, mashhur Firefox brauzerining orqasida, juda ko'p sonli ishchilar ishlaydi, bu aniq. Ulardan biri Alon Zakay Mozilla tadqiqot guruhining muhandisi bo'lib, u "Emscripten" nomli g'alati vositani yaratdi.
Emscripten sizga LLVM bit kodini olishga imkon beradi - bu C / C ++ asosidagi kutubxonalardan JavaScript-ga yaratilishi mumkin. Buni kutubxonalarni bit kodiga kompilyatsiya qilish va keyin bit kodini olish va JavaScript-ga o'zgartirish orqali amalga oshiradi. Toza, lekin aslida bu bilan nima qilishim mumkin, o'zingizga savol berishingiz mumkinmi?
Sizga qarshi savolim bor: "CoffeeScript va prototipdan foydalanish - bu Ruby brauzerida ishlashga eng yaqin bo'lgan" iborasini eshitganmisiz? Yo'q? Xavotir olmang, chunki bu endi to'g'ri emas.
Emscripten yordamida siz Ruby manbalarini olishingiz, ularni JavaScript va voilà-ga o'zgartirishingiz, brauzeringizda haqiqiy Ruby-ni ishlatishingiz mumkin! Ammo bu faqat Rubyga taalluqli emas, masalan, Python ham yozilgan.
Yoki Broadway brauzeridagi h.264 dekoderini tekshiring. Bu aslida C ++ kutubxonasi!
Brauzeringizda ishlaydigan bir nechta dasturlash tillarini (shu jumladan Ruby va Python) ko'rish uchun replace.it-ga o'ting!
08. OS dan mustaqil ish stoli dasturlarini yozish
Biz ilgari Apache Cordova yordamida bir nechta mobil platformalarni nishonga olish haqida gaplashdik. Ajablanarlisi shundaki, JavaScript-dan nafaqat mobil platformalarni maqsad qilish uchun, balki eski do'stimiz bilan ish stoli kompyuterimiz bilan ham kurashish mumkin.
Dastlabki echimlar Appcelerator-ning Titanium Desktop Suite va Adobe-dan keng foydalaniladigan Air platformasidan foydalangan.
Ammo biz hammamiz ochiq manba sevuvchilar sifatida biz ko'proq ochiq va Node.js texnologiyasiga intilamiz. App.js bilan tanishing! app.js - bu ochiq veb-texnologiya va Node.js-ga asoslangan ish stoli dasturi, bu bizga fayl tizimiga kirish, oynalarni boshqarish va boshqalar bilan haqiqiy ish stoli dasturlarini yozish imkonini beradi. Biz Node-ning barqaror o'zaro faoliyat platformasi API-lariga ishonishimiz va dasturiy ta'minot interfeysimizni HTML va CSS bilan yaratishimiz mumkin. Xuddi shu erda ushbu ro'yxatdagi eng issiq yangi narsalar kabi.
app.js bu juda yosh loyihadir va shu sababli hozirgacha faqat Windows va Linux-ni qo'llab-quvvatlaydi, ammo pochta jo'natmalariga ko'ra, Mac-ni qo'llab-quvvatlash o'z yo'lida.
09. Veb-serverni boshqarish
Bugungi kunda sizning veb-saytingiz JavaScript-ga asoslangan veb-brauzer orqali xizmat ko'rsatayotganini aytganda, hech kimni hayratga solmaysiz. Agar siz ikki-uch yil oldin o'ylab ko'rsangiz va veb-ishlab chiquvchilarga aynan shu narsani aytgan bo'lsangiz, ehtimol ular sizni kulishgan yoki undan ham yomoni.
Ammo Node.js-ning ajoyib muvaffaqiyati bilan bu baxtga hozircha juda uzoqdir. Node.js asenkron tabiati tufayli nafaqat odamlarni hayratga soladi, balki juda ko'p parallel ulanishlar muammosiga duch kelganda ishlashda wunderkind hisoblanadi. Uning ishlashi nafaqat portlash, balki oddiy API ham ko'plab ishlab chiqaruvchilarni jalb qiladi. Tugun dunyosidan "Salom Dunyo" misolini ko'rib chiqamiz, bu nafaqat ekran misolida "Salom Dunyo" nashridir, balki http veb-serveridir!
var http = talab ('http');
http.createServer (funktsiya (req, res) {
res.writeHead (200, {'Content-Type': 'text / plain'});
res.end ('Salom Dunyo n');
}). tinglang (1337, ’127.0.0.1’);
Agar siz ushbu soddalikka uchib ketmasangiz, men sizga yordam berolmayman.
Tugun mashhurligining (yoki shov-shuvlarning) eng yaxshi qismlaridan biri shundaki, Microsoft kabi yirik kompaniyalar uni aslida Azure Cloud Services-da qo'llab-quvvatlamoqda!
10. Veb-skrining va skrinshotlar
Shunday qilib, nihoyat, eng muhimi, QUnit sinovlarini buyruq satrida boshsiz bajarishga ruxsat berganim uchun shaxsan menga yoqadigan loyihani ko'rib chiqaylik. PhantomJS - toza JavaScript (yoki CoffeScript) asosidagi API-ga ega WebKit-ga asoslangan boshsiz brauzer.
Ammo JavaScript va DOM-ni sinab ko'rish Phantom uchun yagona foydalanish emas. Meni chindan ham hayratga soladigan narsa - bu veb-saytlarni qirib tashlash va uning skrinshotlarini olishga imkon berish qobiliyatlari!
Ha, siz to'g'ri o'qiyapsiz, Phantom yordamida siz turli xil grafik formatdagi veb-sahifalarni chiqarishingiz mumkin va, albatta, go'dakdan shirinlik o'g'irlash kabi oson.
Keling, buni aniq bajaradigan skriptni ko'rib chiqaylik:
var page = yangi WebPage ();
page.open ('http://google.com', function (status) {
page.render ('google.png');
phantom.exit ();
});
Skrinshot qilishingiz kerak bo'lgan narsa shu va u JavaScript-ga asoslanganligi sababli, jQuery-dan foydalanishingiz va uni skrinshot qilishdan oldin sahifadagi tarkibni boshqarishingiz mumkin!
Kutmoq! Yana ...
Shunday qilib, umid qilamanki, men ushbu vositalarning har birini kashf etganimda, men kabi hayratda qoldingiz. Ushbu maqola bugungi kunda JavaScript-ni iloji bor narsaning sirtini chizib qo'ydi. To'liq JS Cloud9-da yozilgan IDE-lar yoki u bilan qilingan yuqori darajadagi xavfsizlik kabi narsalar juda ko'p (Sizning kredit kartangiz JavaScript-da yaratilgan).
Umid qilamanki, sizga ilhom baxsh etadi, biroz vaqt ajrating va bu erda aytib o'tilgan ba'zi loyihalar bilan o'ynaysiz, yoki hatto ushbu vositalardan bir qismini olib, atrofiga yangi narsalar qurasiz. Ularning aksariyati bu erda ochiq manba va u erda ishlab chiquvchilar bor, ular o'zlarining ishlarini yaxshilashda yordam berishlarini qidirmoqdalar, hatto bu vositalardan foydalanish, xatolarni aniqlash va ularga xabar berish orqali ham.
