# Усвојите API ## Преглед API-ји отварају бескрајне могућности за креативан веб развој! У овом задатку, изабраћете спољашњи API и направити екстензију за прегледач која решава прави проблем или пружа корисну функционалност корисницима. ## Упутства ### Корак 1: Изаберите свој API Изаберите API са ове куриране [листе бесплатних јавних API-ја](https://github.com/public-apis/public-apis). Размотрите следеће категорије: **Популарне опције за почетнике:** - **Забава**: [Dog CEO API](https://dog.ceo/dog-api/) за насумичне слике паса - **Време**: [OpenWeatherMap](https://openweathermap.org/api) за податке о тренутном времену - **Цитати**: [Quotable API](https://quotable.io/) за инспиративне цитате - **Вести**: [NewsAPI](https://newsapi.org/) за актуелне наслове - **Занимљивости**: [Numbers API](http://numbersapi.com/) за занимљиве чињенице о бројевима ### Корак 2: Испланирајте своју екстензију Пре него што почнете са кодирањем, одговорите на ова питања за планирање: - Који проблем ваша екстензија решава? - Ко је ваша циљна група корисника? - Које податке ћете чувати у локалној меморији? - Како ћете се носити са неуспесима API-ја или ограничењима у броју захтева? ### Корак 3: Направите своју екстензију Ваша екстензија треба да садржи: **Обавезне функције:** - Унос у форми за све потребне параметре API-ја - Интеграцију API-ја са одговарајућим руковањем грешкама - Локалну меморију за корисничке преференције или API кључеве - Чист, одзиван кориснички интерфејс - Стања учитавања и повратне информације за корисника **Захтеви за код:** - Користите модерне JavaScript (ES6+) функције - Примените async/await за API позиве - Укључите одговарајуће руковање грешкама са try/catch блоковима - Додајте смислене коментаре који објашњавају ваш код - Придржавајте се доследног форматирања кода ### Корак 4: Тестирајте и усавршите - Тестирајте своју екстензију са различитим уносима - Руковање граничним случајевима (без интернета, неважећи одговори API-ја) - Осигурајте да ваша екстензија ради након поновног покретања прегледача - Додајте кориснички пријатељске поруке о грешкама ## Додатни изазови Подигните своју екстензију на виши ниво: - Додајте више API крајњих тачака за богатију функционалност - Примените кеширање података како бисте смањили API позиве - Креирајте пречице на тастатури за уобичајене радње - Додајте функције за извоз/увоз података - Примените опције за прилагођавање корисника ## Захтеви за предају 1. **Функционална екстензија за прегледач** која успешно интегрише изабрани API 2. **README датотека** која објашњава: - Који API сте изабрали и зашто - Како инсталирати и користити вашу екстензију - Сви потребни API кључеви или подешавања - Снимци екрана ваше екстензије у акцији 3. **Чист, коментарисан код** који прати модерне JavaScript праксе ## Рубрика | Критеријум | Изузетно (90-100%) | Добро (80-89%) | Задовољавајуће (70-79%) | Почетно (60-69%) | |------------|--------------------|----------------|-------------------------|------------------| | **Интеграција API-ја** | Беспрекорна интеграција API-ја са свеобухватним руковањем грешкама и управљањем граничним случајевима | Успешна интеграција API-ја са основним руковањем грешкама | API ради, али са ограниченим руковањем грешкама | Интеграција API-ја има значајне проблеме | | **Квалитет кода** | Чист, добро коментарисан модеран JavaScript који прати најбоље праксе | Добра структура кода са довољно коментара | Код ради, али му је потребна боља организација | Лош квалитет кода са минималним коментарима | | **Корисничко искуство** | Полирани интерфејс са одличним стањима учитавања и повратним информацијама за корисника | Добар интерфејс са основним повратним информацијама | Основни интерфејс који функционише адекватно | Лоше корисничко искуство са конфузним интерфејсом | | **Локална меморија** | Сложена употреба локалне меморије са валидацијом и управљањем подацима | Правилна имплементација локалне меморије за кључне функције | Основна имплементација локалне меморије | Минимална или нетачна употреба локалне меморије | | **Документација** | Свеобухватан README са упутствима за подешавање и снимцима екрана | Добра документација која покрива већину захтева | Основна документација која недостаје неке детаље | Лоша или недостајућа документација | ## Савети за почетак 1. **Почните једноставно**: Изаберите API који не захтева сложену аутентификацију 2. **Прочитајте документацију**: Детаљно разумите крајње тачке и одговоре вашег изабраног API-ја 3. **Испланирајте свој интерфејс**: Нацртајте изглед ваше екстензије пре кодирања 4. **Често тестирајте**: Градите постепено и тестирајте сваку функцију како је додате 5. **Руковање грешкама**: Увек претпоставите да API позиви могу да не успеју и планирајте у складу с тим ## Ресурси - [Документација за екстензије прегледача](https://developer.mozilla.org/docs/Mozilla/Add-ons/WebExtensions) - [Водич за Fetch API](https://developer.mozilla.org/docs/Web/API/Fetch_API/Using_Fetch) - [Туторијал за локалну меморију](https://developer.mozilla.org/docs/Web/API/Window/localStorage) - [Парсирање и руковање JSON-ом](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/JSON) Забавите се док правите нешто корисно и креативно! 🚀 --- **Одрицање од одговорности**: Овај документ је преведен помоћу услуге за превођење уз помоћ вештачке интелигенције [Co-op Translator](https://github.com/Azure/co-op-translator). Иако настојимо да обезбедимо тачност, молимо вас да имате у виду да аутоматизовани преводи могу садржати грешке или нетачности. Оригинални документ на изворном језику треба сматрати меродавним извором. За критичне информације препоручује се професионални превод од стране људи. Не преузимамо одговорност за било каква погрешна тумачења или неспоразуме који могу настати услед коришћења овог превода.