Frontend

Как да решите проблема с излишните заявки за данни на клиента, когато данните вече са били заредени на сървъра чрез SSR?

Как да оптимизираме зареждането на изображения в картите, които са видими във viewport? Как да решим проблема с race condition при бързо превключване на съдържанието (например YouTube Shorts)?

Какво беше използвано за работа с многомерни форми — за валидиране, какви проблеми срещаха, как ги тестваха?

Споменахте Docker, CI/CD, GitHub Actions, GitLab — можете да разясните точно какво правехте, какви пайплайни, какво имаше в контейнерите?

#React формуляр за регистрацију 1. Објасните како ради StateProvider, поделите своје мисли са интервјуером. 2. Погледајте /src/api/mock, објасните како ради. 3. Проверите боју SubmitButton и исправите је. 4. Имплементирајте валидацију формулара на страни клијента у компоненту Signup. (\*) Имајте у виду задатак број 9. Правила: - Поља Корисничко име, Емаил, Лозинка и Поново Лозинка треба да имају најмање 6 карактера; - Лозинка треба да одговара Поново Лозинка; - Валидација треба да се изврши након клика на "SignUp" дугме; - Поља са неважећим вредностима треба да буду означена (props error и helperText); 6. Одговор API може имати грешку која треба да се прикаже кориснику у близини одговарајућег поља. 7. Уверите се да компонентa UserName приказује ново корисничко име након успешног слања. 8. Имплементирајте нову компонету SignupSuccess. Она треба да се приказује уместо формулара за регистрацију. 9. Имплементирајте серверску валидацију за одговарајућа поља. --- Код из mock.ts: ```typescript const fakeResponse = (userName) => ({ code: 200, user: { id: 42, userName, }, }); let a = 0; const api = { '/signup': function (userName: string, email: string, password: string) { a++; return new Promise((resolve, reject) => { setTimeout(() => { if (a % 2 === 0) { return resolve(fakeResponse(userName)); } else { return reject( new Error( `Korisničko ime "${userName}" je već zauzeto. Molimo pokušajte s drugim.` ) ); } }, 500); }); }, }; export default api; ```

Реализирайте сървърна валидация за съответните полета.

Как можете да кеширате данни на сървъра, за да ускорите зареждането на потребителите?

С кои рамки или инструменти работите? Използвате ли AI инструменти в работата си?

На страницата има плеър. Трябва да се направи така, че при натискане на стоп на една раздела, възпроизвеждането да спира и на друга раздела. Как би реализирал комуникацията между разделите?

Как работи виртуализацията на списъка? Как е реализирано технически чрез JavaScript?

Реализирайте типизацията на TypeScript за функцията customMap, която приема масив от всякакъв тип и функция-преобразувател, която връща друг тип. Функцията-преобразувател трябва да приема три аргумента (като callback в Array.map).

Реализирайте функцията promiseWithResolver (отложено обещание), която връща обект с полетата resolve и promise.

Как се доставяха версиите, как се тестваха, колко често излизаха?

Как изобщо научаваш нещо ново за програмирането и какво ти е останало в паметта последно?

Имаме много голям фронтенд в монорепо, по който работят много различни екипи едновременно. Не можем да преминем към микрофронтенд. Как да минимизираме риска различните екипи да влияят на работата един на друг?

Създайте знака за СПИРАНЕ (червен кръг с бяла лента и двойна рамка) само с един div и CSS (разрешени са псевдоелементи).

Какво обикновено правиш, ако чувстваш, че разработката върви и си малко изостанал от сроковете? Има дата на пускане, но разбираш, че няма да успееш да завършиш задачата навреме.

#React регистрационна форма 1. Обяснете как работи StateProvider, споделете мислите си с интервюиращия. 2. Вижте /src/api/mock, обяснете как работи. 3. Проверете цвета на SubmitButton и го коригирайте. 4. Имплементирайте клиентска валидация на формуляра в компонента Signup. (* ) Имайте предвид номер 9 на задачата. Правила: - Полетата Име на потребител, Имейл, Парола, Повторете паролата трябва да имат поне 6 символа; - Паролата трябва да съвпада с Повторете паролата; - Валидацията трябва да се извършва при кликване върху бутона "Регистрация"; - Полетата с невалидни стойности трябва да бъдат маркирани (props error и helperText); 6. Отговорът на API може да има грешка, която трябва да бъде показана на потребителя близо до съответното поле. 7. Уверете се, че компонентът UserName показва новото потребителско име след успешно изпращане. 8. Имплементирайте новия компонент SignupSuccess. Той трябва да се показва вместо формуляра за регистрация. 9. Имплементирайте сървърна валидация за съответните полета.

Как се обменяха файловете в чата — просто с POST заявка или имаше големи файлове?

const customMap = (array, transform) => { // нещо като array.map(transform); }; const stringResults = customMap([1, 2, 3], item => item.toString()); const lengths = customMap(["здравей", "свят"], item => item.length);