jQuery проекти

За да ги усовршите техниките во веб развојот или во било која друга област, најдобриот пристап е преку учество во практични активности. Тоа овозможува не само да се научат концептите, туку и веднаш да се применат.

Усовршете ги претходно стекнатите знаења од курсот jQuery: основи и станете фронт-енд развивач работејќи на практични проекти. Курсот е составен од 10 интересни проекти со чија помош ќе ви бидат прикажанани најдобрите практики за фронт-енд развој.

Проект 1: HTML5 видео галерија

Во овој проект ќе развиеме интерактивна видео галерија за на веб, притоа работејќи во околина на програмирање со комбинација на HTML5 и Flash резерва, CSS, и JavaScript библиотеката со отворен код, jQuery. Овој курс ви покажува како да дизајнирате распоред на сајт и да конструирате код за плеер кој работи на повеќе веб прелистувачи, платформи и мобилни уреди. Ќе ви ги демонстрираме и техниките со кои ќе овозможите HTML5 видео на Android и ќе обезбедите постарите верзии на Internet Explorer предодредено да се префрлаат на Flash наместо HTML5.

Проект 2: Интерактивна мапа

Во овој проект ќе ви покажеме како да дизајнирате и креирате богата интерактивна мапа за веб сајт, работејќи во околина на програмирање и употребувјќи jQuery. Преоктот опфаќа креирање слики оптимизирани за веб со алатката за исечоци во Photoshop, имплементирање HTML и CSS за да се состави распоредот на страницата, и додавање интерактивност со JavaScript и брзата и концизна библиотека за код на jQuery.

Проект 3: Интерактивна анимирана временска лента

Научете како да креирате интерактивна и анимирана временска лента со jQuery. Во овој проект ќе ви покажеме како да креирате лизгачка временска лента со маркери за дата и поврзана содржина. Раскажете ја својата приказна, или приказната на вашата организација, со графички богата, интерактивна времеска лента.

Проект 4: Менија за навигација

Откријте како да додадете стилизирани паѓачки менија за вашиот веб сајт употребувајќи HTML, CSS, и JavaScript. Во овој краток проект ќе го погледнеме процесот на дизајнирање, ќе објасниме како да изградите основа за менија употребувајќи неподредена листа, како да воспоставите хиерархија со вгнездени подменија, да нанесете стил CSS правила, и да инкорпорирате функционалност на паѓачко мени употребувајќи jQuery додаток.

Проект 5: Вртелешка

Во овој проект ќе видите како да имплементирате и прилагодите анимација на интерактивна вртелешка со jQuery. Покриени се подготвување на слики и дополнителен текст за во вртелешката, креирање елементи содржатели со HTML и CSS, и активирање на вртелешката со JavaScript. Исто така ќе научите и како да додадете слики во елементите содржатели, да прилагодите дополнителен текст и да додадете анимирани транзиции помеѓу дополнителните текстови.

Проект 6: Совет на екран

Советите на екран ја подобруваат употребливоста на вашиот веб сајт обезбедувајќи инструкции и помош на посетителите. Во овој проект ќе научите како да конвертирате текст или графика во совет на екранот кој реагира на глувче. Туторијалот ќе ви демонстрира како да го напишете неопходното HTML и да го активирате советот со jQuery, да додадете позиционирање и ефекти.

Проект 7: Панел со јазичиња со лизгање

Интерфејсот на панелот со јазичиња е класична опција која треба да ја инкорпорирате во својот дизајн, но најчесто е статиччи елемент. Овој проект ќе ви покаже како да креирате динамички панел со јазичиња кој се лизга. Ќе употребуваме комбинација од HTML, CSS, и jQuery. Процесот ќе го започнеме од самиот почеток, од градење на елементи содржатели, до додавање стил на текст, јазичиња и панели, и додавање на клик настани за интереактивност на јазичињата. Ќе ви демонстрираме како да ја инкорпорирате техниката за прогресивно подобрување, за пшосетителите кои немаат JavaScript да може да и пристапат на содржината.

Проект 8: Анимирани премини

Во овој проект ќе додадеме интерактивност на една видео галерија употребувајќи ја JavaScript библиотеката jQuery. Работејќи во околина на програмирање, ќе ви покажеме како да ги анимирате дополнителните текстови и иконата за пуштање, да ги проширите малите сликички како филмски ленти и да ја менувате позадината на филмската лента за да се менува на премин со CSS.

Проект 9: Анимиран графикон со ленти

Во овој проект ќе креираме анимиран графикон со ленти или други графики со jQuery. Овој пристап е динамичен и му дозволува на дизајнерот да ја прилагодува големината на графиконот и да му дозволи на jQuery да ги пресмета новите позиции и големина на лентите врз основа на податоците поврзани со секоја од лентите. Исто така ќе погледнете како да дизајнирате графикон со HTML и CSS, како и да креирате ознаки и да прилагодувате задоцнувања jQuery.

Проект 10. НПП листа која се проширува

Најчесто поставуваните прашања (НПП) се популарен аспект на секој веб сајт. Во овој проект ќе ви покажеме како да креирате прашања кои имаат одговори кои се појавуваат и собираат под прашањето. Ќе научите како да изградите секција за НПП на вашиот сајт, употребувајќи прилагодлива комбинација на HTML, CSS, JavaScript, и jQuery. Дополнително, курсот демонстрира како автоматски да се поврзе нештото кон одредено прашање, и автоматски да се отвори одговорот, со што ќе добиете можност да им обезбедите директен одговор на прашањето на корисниците.

Кому му е наменет овој курс?

Овој курс им е наменет на:

• лица кои сакаат да станат веб дизајнери и веб девелопери
• дизајнери кои сакаат да ги прошират својот сет вештини
• студенти

Предзнаења

За следење на овој курс потребно е поседување знаења содржани во курсевите:

• HTML: основи
• CSS: основи
• JavaScript: основи
• jQuery: основи

Практичен дел

Во рамки на практичниот дел од курсот, студентот ќе добие задачи кои ќе треба да ги изработи и достави до својот ментор.

Сертификат

По успешното завршување на курсот, учесникот добива сертификат за успешно завршен курс. Под успешно завршување се подразбира навремено доставување на најмалку 80% од предвидените задачи.

Формат на курсот

Курсот се изведува на далечина, со користење на методологијата менторирано учење на далечина.

Вклучено во цената

• 30 дена пристап до материјалите за учење
• 4 x 15 мин. менторски сесии (1-на-1, online)
• сертификат за успешно завршен курс

Сподели

Биди другар, сподели со пријателите