11 KiB

Raw Blame History Unescape Escape

Задатак за рефакторисање кода и документацију

Циљеви учења

Завршавањем овог задатка, вежбаћете основне вештине развоја софтвера које професионални програмери користе свакодневно. Научићете како да организујете код ради лакшег одржавања, смањите дуплирање кроз апстракцију и документујете свој рад за будуће програмере (укључујући и себе!).

Чист и добро документован код је од суштинског значаја за пројекте веб развоја у стварном свету, где сарађује више програмера и где се кодови временом развијају.

Преглед задатка

Ваш app.js фајл за банкарску апликацију значајно је порастао са функционалностима за пријаву, регистрацију и контролни панел. Време је да рефакторишете овај код користећи професионалне праксе развоја како бисте побољшали читљивост, одрживост и смањили дуплирање.

Упутства

Трансформишите свој тренутни app.js код применом три основне технике рефакторисања:

1. Издвајање конфигурационих константи

Задатак: Направите секцију за конфигурацију на врху вашег фајла са поново употребљивим константама.

Смернице за имплементацију:

Издвојите основни URL серверског API-ја (који је тренутно више пута хардкодован)
Направите константе за поруке о грешкама које се појављују у више функција
Размотрите издвајање путања рута и ID-јева елемената који се често користе

Пример структуре:

// Configuration constants
const API_BASE_URL = 'http://localhost:5000/api';
const ROUTES = {
  LOGIN: '/login',
  DASHBOARD: '/dashboard'
};

2. Креирање унифициране функције за захтеве

Задатак: Направите поново употребљиву функцију sendRequest() која елиминише дуплирање кода између createAccount() и getAccount().

Захтеви:

Обрадите и GET и POST захтеве
Укључите одговарајуће руковање грешкама
Подржите различите URL крајње тачке
Прихватите опционалне податке тела захтева

Смернице за потпис функције:

async function sendRequest(endpoint, method = 'GET', data = null) {
  // Your implementation here
}

3. Додавање професионалне документације кода

Задатак: Документујте свој код јасним и корисним коментарима који објашњавају "зашто" иза ваше логике.

Стандарди документације:

Додајте документацију функција која објашњава сврху, параметре и повратне вредности
Укључите коментаре унутар кода за сложену логику или пословна правила
Групишите повезане функције заједно са заглављима секција
Објасните било који неочигледан образац кода или решења специфична за претраживач

Пример стила документације:

/**
 * Authenticates user and redirects to dashboard
 * @param {Event} event - Form submission event
 * @returns {Promise<void>} - Resolves when login process completes
 */
async function login(event) {
  // Prevent default form submission to handle with JavaScript
  event.preventDefault();
  
  // Your implementation...
}

Критеријуми успеха

Ваш рефакторисани код треба да демонстрира ове професионалне праксе развоја:

Изузетна имплементација

✅ Константе: Сви магични стрингови и URL-ови су издвојени у јасно именоване константе
✅ DRY принцип: Заједничка логика захтева је консолидована у поново употребљиву функцију sendRequest()
✅ Документација: Функције имају јасне JSDoc коментаре који објашњавају сврху и параметре
✅ Организација: Код је логички груписан са заглављима секција и конзистентним форматирањем
✅ Руковање грешкама: Побољшано руковање грешкама коришћењем нове функције за захтеве

Адекватна имплементација

✅ Константе: Већина поновљених вредности је издвојена, са мањим хардкодованим вредностима које су остале
✅ Факторизација: Основна функција sendRequest() је креирана, али можда не обрађује све граничне случајеве
✅ Коментари: Кључне функције су документоване, иако неке објашњења могу бити потпунија
✅ Читљивост: Код је генерално добро организован са неким просторима за побољшање

Потребна побољшања

❌ Константе: Многи магични стрингови и URL-ови остају хардкодовани широм фајла
❌ Дуплирање: Значајно дуплирање кода остаје између сличних функција
❌ Документација: Недостају или су недовољни коментари који не објашњавају сврху кода
❌ Организација: Код нема јасну структуру и логичко груписање

Тестирање рефакторисаног кода

Након рефакторисања, уверите се да ваша банкарска апликација и даље функционише исправно:

Тестирајте све корисничке токове: Регистрација, пријава, приказ контролне табле и руковање грешкама
Потврдите API позиве: Уверите се да ваша функција sendRequest() ради и за креирање и за преузимање налога
Проверите сценарије грешака: Тестирајте са неважећим акредитивима и грешкама у мрежи
Прегледајте излаз конзоле: Уверите се да нису уведене нове грешке током рефакторисања

Упутства за предају

Предајте свој рефакторисани app.js фајл са:

Јасним заглављима секција које организују различите функционалности
Конзистентним форматирањем и увлачењем кода
Комплетном JSDoc документацијом за све функције
Кратким коментаром на врху који објашњава ваш приступ рефакторисању

Додатни изазов: Направите једноставан фајл за документацију кода (CODE_STRUCTURE.md) који објашњава архитектуру ваше апликације и како различите функције раде заједно.

Веза са стварним светом

Овај задатак одражава тип одржавања кода који професионални програмери редовно обављају. У индустријским окружењима:

Прегледи кода процењују читљивост и одрживост као у овом задатку
Технички дуг се акумулира када код није редовно рефакторисан и документован
Сарадња у тиму зависи од јасног, добро документованог кода који нови чланови тима могу да разумеју
Исправке грешака су много лакше у добро организованим кодовима са одговарајућим апстракцијама

Вештине које овде вежбате - издвајање константи, елиминисање дуплирања и писање јасне документације - су основне за професионални развој софтвера.

Одрицање од одговорности:
Овај документ је преведен помоћу услуге за превођење вештачке интелигенције Co-op Translator. Иако настојимо да обезбедимо тачност, молимо вас да имате у виду да аутоматски преводи могу садржати грешке или нетачности. Оригинални документ на његовом изворном језику треба сматрати ауторитативним извором. За критичне информације препоручује се професионални превод од стране људи. Не преузимамо одговорност за било каква погрешна тумачења или неспоразуме који могу произаћи из коришћења овог превода.

11 KiB Raw Blame History Unescape Escape