Frontend

Ինչն օգտագործվեց բազմաչափ ձևերով աշխատելու համար — հաստատման համար, ինչ խնդիրներ հանդիպեցին, ինչպես փորձարկեցին?

Ինչպես լուծել հաճախորդի վրա ավելորդ տվյալների հարցումների խնդիրը, երբ տվյալները արդեն բեռնված են սերվերում SSR-ի միջոցով?

Ինչպես օպտիմալացնել պատկերների բեռնման գործընթացը այն քարտերում, որոնք տեսանելի են viewport-ում: Ինչպես լուծել race condition խնդիրը արագ բովանդակության փոփոխության ժամանակ (օրինակ, YouTube Shorts)?

Դուք հիշեցիք Docker, CI/CD, GitHub Actions, GitLab — կարող եք բացատրել, թե ինչ եք անում, ինչ պայպլայններ, ինչ էր կոնտեյներզում?

Կատարեք սերվերի կողմի վավերացման համապատասխան դաշտերի համար։

Ինչպե՞ս կարելի է տվյալները սերվերում կեշավորել՝ օգտագործողների բեռնումը արագացնելու համար։

Կիրառեք TypeScript-ի տիպավորումը customMap ֆունկցիայի համար, որը ընդունում է ցանկացած տիպի զանգված և փոխարկիչ ֆունկցիա, որը վերադարձնում է այլ տիպ։ Փոխարկիչ ֆունկցիան պետք է ընդունի երեք արգումենտ (ինչպես callback-ը Array.map-ում):

Ինքնակառավարության ցուցակի աշխատանքը ինչպես է գործում: Ինչպես է դա տեխնիկապես իրականացվում JavaScript-ի միջոցով?

#React գրանցման ձևանմուշ 1. բացատրեք, թե ինչպես է աշխատում StateProvider-ը, կիսվեք ձեր մտքերով հարցազրուցակցի հետ: 2. նայեք /src/api/mock-ին, բացատրեք, թե ինչպես է այն աշխատում: 3. ստուգեք SubmitButton-ի գույնը և ուղղեք այն: 4. իրականացնել հաճախորդի ձևի վավերացում Signup կոմպոնենտում: (\*) հիշեք առաջադրանքի թիվ 9-ը: Կանոններ: - Օգտանուն, Էլ.փոստ, Գաղտնաբառ և կրկնվող Գաղտնաբառ դաշտերը պետք է ունենան առնվազն 6 նիշ; - Գաղտնաբառը պետք է համապատասխանի կրկնվող Գաղտնաբառին; - Վավերացումը պետք է կատարվի "SignUp" կոճակին սեղմելուց հետո; - Անվավեր արժեքներով դաշտերը պետք է նշվեն (props error և helperText): 6. API-ի պատասխանն կարող է ունենալ սխալ, որը պետք է ցուցադրվի օգտվողին համապատասխան դաշտի մոտ: 7. համոզվեք, որ 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( `Օգտանուն "${userName}" արդեն վերցված է: Խնդրում ենք փորձել ուրիշը:` ) ); } }, 500); }); }, }; export default api; ```

Կայ էջում նվագարկիչ կա։ Պետք է այնպես անել, որ երբ մեկ տաբում սթոփ կոճակը սեղմվի, նվագարկումը կանգնի նաև մյուս տաբում։ Ինչպե՞ս կիրառես կապը տաբների միջև։

Ի՞նչ ֆրեյմվորկներ կամ գործիքներ եք օգտագործում: Օգտագործում եք արդյոք AI գործիքներ ձեր աշխատանքի մեջ?

Ինչպե՞ս էին փոխանակվում ֆայլերը զրույցում՝ պարզապես POST-հայցով կամ մեծ ֆայլեր էին։

Ինչպե՞ս էին մատակարարվում տարբերակները, ինչպես էին փորձարկվում, որքան հաճախ էին դուրս գալիս։

#React գրանցման ձևանմուշ 1. Ներկայացրեք, թե ինչպես է աշխատում StateProvider-ը, կիսվեք ձեր մտքերով հարցազրուցողի հետ: 2. Տեսեք /src/api/mock, բացատրեք, թե ինչպես է դա աշխատում: 3. Ստուգեք SubmitButton-ի գույնը և ուղղեք այն: 4. Իրականացրեք հաճախորդի ձևի վավերացում Signup կոմպոնենտում: (* ) Հիշեք 9-րդ առաջադրանքի համար: Կանոններ: - Օգտանուն, Էլեկտրոնային հասցե, Գաղտնաբառ, Հետևյալ Գաղտնաբառ դաշտերը պետք է ունենան առնվազն 6 նիշ; - Գաղտնաբառը պետք է համապատասխանի Հետևյալ Գաղտնաբառին; - Վավերացումը պետք է կատարվի "Գրանցվել" կոճակին սեղմելու ժամանակ; - Անվավեր արժեքներ ունեցող դաշտերը պետք է նշվեն (error և helperText props); 6. API-ի պատասխանն կարող է ունենալ սխալ, որը պետք է ցուցադրվի օգտվողին համապատասխան դաշտի մոտ: 7. Համոզվեք, որ UserName կոմպոնենտը ցույց է տալիս նոր օգտանունը հաջող ուղարկումից հետո: 8. Իրականացրեք նոր SignupSuccess կոմպոնենտը: Այն պետք է ցուցադրվի գրանցման ձևի փոխարեն: 9. Իրականացրեք սերվերային վավերացում համապատասխան դաշտերի համար:

Մեր մոտ շատ մեծ ֆրոնտենդ է մոնոռեպոյում, որի վրա միաժամանակ աշխատում են շատ տարբեր թիմեր։ Մենք չենք կարող անցնել միկրո-ֆրոնտենդ։ Ինչպե՞ս նվազեցնել այն ռիսկը, որ տարբեր թիմերը կազդեն միմյանց աշխատանքի վրա։

Ստեղծեք STOP նշանը (կարմիր շրջան՝ սպիտակ գծով և երկկողմ եզրով) միայն մեկ div և CSS օգտագործելով (պսևդո էլեմենտները թույլատրվում են):

Ի՞նչ ես սովորաբար անում, երբ զգում ես, որ զարգացումը ընթանում է և դու մի փոքր ուշանում ես ժամկետներից: Կա թողարկման ամսաթիվ, բայց դու հասկանում ես, որ չես հասցնի ավարտել գործը ժամանակին։

Կատարեք promiseWithResolver (հետաձգված խոստում) ֆունկցիան, որը վերադարձնում է օբյեկտ, որի դաշտերը resolve և promise են։

Ինչպե՞ս սովորում ես ծրագրավորման մասին նոր բան և վերջին անգամ ինչն է քեզ հիշվում:

Կարո՞ղ է եղել, որ մեկ արտադրանքի ֆունկցիայում շատ դաշտեր վերադարձվեն, իսկ մյուսում՝ միայն երկու՞