Начин на који данас можемо развијати апликације знатно је смањио сложеност развоја, и упркос укључивању нових технологија које на прву могу изгледати донекле компликоване, оне заправо помажу не само у изградњи бољих апликација, већ и у прилагођавању тренутним захтјевима употребљивости.
Једна од ових технологија коју можемо користити је АнгуларЈС, који је оквир МВВ (Модел-Поглед-Шта год) што се преводи као Модел-Виев-Вхатевер-воркс-фор иоу, засновано је на ЈаваСцрипт-у и омогућава нам да доставимо наше документе ХТМЛ статичке карактеристике динамичке функционалности и коришћење везивања да убризгавамо податке у наш ХТМЛ користећи сопствене директиве оквира.
Ангулар ради прилично добро, али имамо његову нову итерацију и омогућава нам да још више проширимо функционалност оквира, па да видимо како можемо почети да користимо Ангулар 2 за само 10 минута.
1. Добијање ТипеСцрипт -а и Ангулар -а 2
Да бисмо извршили ову имплементацију, радићемо на најоптималнији могући начин, за то ћемо користити Стројопис који је језик који омогућава проширење функционалности ЈаваСцрипт да се фокусира на коришћење класа и објеката.
Да бисте добили толико ТипеСцрипт Шта Угаони 2 потребно је да имамо Ноде.јс, као и његов менаџер пакета на нашем рачунару, ако их још увек немамо, можете погледати први кораци са Ноде.јс у овом водичу.
Кад једном имамо Ноде.јс и менаџер пакета НПМ можемо покренути команде да бисмо добили оно што нам је потребно:
нпм инсталл -г тсд@^0.6.0 тсд инсталл ангулар2 ес6-обећање рк рк-литеДодатно морамо инсталирати компајлер ТипеСцрипт пошто прегледач не препознаје .тс датотеке:
нпм инсталл -г типцрипт@^1.5.0-бетаЈедном изведени, требали бисмо путем конзоле видети инсталацију модула, компајлер и библиотеке оквира.
ЕНЛАРГЕ
Коначно, морамо само да инсталирамо локални сервер, да нашу апликацију покренемо на професионалан начин, за то у нашој конзоли и кроз НПМ извршавамо следеће:
нпм инсталл -г хттп -сервер
2. Израда наше апликације
Када добијемо све потребно за рад наше апликације, креирамо фасциклу у којој ћемо имати датотеке пројекта које можемо назвати угаона10мин, а унутра ћемо створити датотеку под називом апплицатион.тс и наш уобичајен индек.хтмл.
Прва ствар коју ћемо учинити је да додамо класе и компоненте у нашу датотеку апплицатион.тс, јер ово прво што морамо да урадимо је увоз Угаони 2 као што следи:
увоз {Цомпонент, Виев, боотстрап} из 'ангулар2 / ангулар2';Да бисмо проверили рад нашег компајлера који се налази у фасцикли нашег пројекта, извршићемо следеће:
тсц --ватцх -м цоммоњс -т ес5 --емитДецораторМетадата апплицатион.тсСа оним што би требало да добијемо од конзоле да је компилација успешно завршена и да такође чека промене у датотеци, то је због употребе параметра -ватцх.
ЕНЛАРГЕ
Сада креирамо нашу компоненту, где ћемо прогласити селектор који ћемо користити у нашем ХТМЛ коду, као и наш приказ где ћемо укључити шаблон у који ћемо унети промене.
@Компонента ({селецтор: 'ми-апп'}) @Виев ({темплате: ''})Како наш компајлер гледа промене и ми смо неке укључили, нормално је да видимо неку активност у нашој конзоли.
Сада морамо само да направимо декларацију наше класе и да иницијализујемо објекте унутар конструктора који ће бити они који ће се затим испразнити у приказу. На крају користимо функцију боотстрап () која ће бити задужена за исцртавање компоненти на нашој страници.
цласс миЦомпонент {наме: стринг; цонструцтор () {тхис.наме = 'Јонатхан'; }} боотстрап (миЦомпонент);Наш код за Типесцрипт смо већ завршили, а ако проверимо у нашој фасцикли, требало би да имамо ЈаваСцрипт који је резултат наше компилације .тс.
ЕНЛАРГЕ
3. Изградња ХТМЛ -а
Коначно, морамо изградити ХТМЛ, извршите дужни увоз, као и укључите селекторе које декларишемо у нашој .тс датотеци, за то ћемо укључити систем.јс, што ће нам омогућити да извршимо увоз наше датотеке, да видимо садржај нашег ХТМЛ -а:
Угао 2 за 10 минутаКада то учинимо, морамо само да покренемо наш сервер и покренемо нашу апликацију, за то заустављамо компајлер и извршавамо сервер следећом командом:
хттп-серверОво ће поставити сервер у лоцалхост: 8080 и омогућиће нам приступ нашој апликацији.
Видећемо податке дефинисане у нашој датотеци ТипеСцрипт су оне које су убачене у нашу апликацију, на овај начин одвајамо логику наше апликације и можемо имати чист ХТМЛ документ који рукује само селекторима које смо створили захваљујући Угаони 2, дајући нам апликацију која ради оптималније и ефикасније уз најмање могуће напоре.