Pereiti prie turinio
Susisiekite
Programuotojas iš nugaros prie šviesaus stalo su monitoriumi, telefonu ir planšete

Inžinerija

Front-end kūrimo paslaugos

Greitos ir prieinamos jūsų SaaS platformos ar internetinės programėlės sąsajos, sukurtos moderniomis technologijomis ir su dizaino sistema, kuri toliau auga ir po paleidimo. Jas kuria įkūrėjai ir patyrę inžinieriai, su kuriais kalbatės tiesiogiai.

Pasikalbėkite su įkūrėjais

Sąsajos, kurios išlieka greitos, aiškios ir lengvai keičiamos, kai jūsų produktas auga

Front-end yra ta jūsų produkto dalis, kurią žmonės iš tikrųjų liečia. Jei ji lėta, painu ar neveikia jų įrenginyje, visa kita nebesvarbu. Kuriame sąsajas, kurios greitai įsikelia, tinka visiems ir veikia bet kokio dydžio ekrane – nuo pigaus Android telefono iki plataus stalinio kompiuterio monitoriaus.

Kalbatės su įkūrėjais, kurie kuria jūsų projektą, o ne su pardavėju, o darbui vadovauja patyręs inžinierius – nuo pirmojo komponento iki paleidimo. Dirbtinis intelektas padeda greičiau atlikti įprastas užduotis, o kiekvieną kodo eilutę inžinierius peržiūri prieš ją išleidžiant.

Kuriame iš komponentų su aiškiomis ribomis, todėl naujas funkcijas galima įdiegti nieko neperrašant. Repozitorijos, dizaino failai ir diegimo paskyros priklauso jums nuo pirmos dienos – niekas nesusieta su mumis.

Paslaugos nauda

Ką gerai sukurtas front-end duoda jūsų verslui

Gerą front-end inžineriją jūsų naudotojai dažniausiai pastebi tik iš to, kad viskas veikia greitai, aiškiai ir būtent tame įrenginyje, kurį jie laiko rankoje.

  1. 01

    Pritaikyta bet kokiam ekranui ir situacijai

    Žmonės pradeda užduotį telefone, o baigia nešiojamajame kompiuteryje, dažnai su nestabiliu ryšiu. Maketus, paspaudžiamas sritis ir įkėlimo būsenas kuriame visoms šioms situacijoms, kad patirtis išliktų vientisa, kad ir kur ja naudotųsi.

  2. 02

    Patyrusių inžinierių sprendimai, paspartinti DI

    Programavimo asistentai sukuria šabloninį kodą, projekto karkasą ir pirmuosius testų juodraščius. Taip mūsų inžinieriai gali skirti laiko būsenos valdymui, kraštutiniams atvejams ir naudotojų keliams, kurie jūsų verslui svarbiausi.

  3. 03

    Pigūs ir saugūs eksperimentai

    Kai funkcijos kuriamos kaip savarankiški moduliai, įjungiami jungikliais, idėją galite išbandyti su dalimi naudotojų, įvertinti rezultatus ir, jei nepasiteisina, švariai ją pašalinti, neliesdami likusio produkto.

  4. 04

    Naudotojai, kurie apsieina patys

    Aiškūs procesai, protingos numatytosios reikšmės ir naudingi klaidų pranešimai leidžia klientams atlikti užduotis nesikreipiant į pagalbos tarnybą. Tai sumažina pagalbos tarnybos krūvį ir suteikia žmonėms priežastį sugrįžti.

  5. 05

    Turinys, kurį supranta ir mašinos

    Semantinis žymėjimas ir struktūrizuoti duomenys padeda paieškos sistemoms, ekrano skaitytuvams ir DI asistentams teisingai suprasti jūsų puslapius, todėl jūsų produktas išlieka matomas ir patikimas, net keičiantis tam, kaip žmonės ieško informacijos.

  6. 06

    Greitis, kuris išlaiko žmonių dėmesį

    Nustatome našumo ribas puslapio dydžiui ir Core Web Vitals rodikliams ir tikriname jas po kiekvieno pakeitimo. Greiti puslapiai draugiškesni lėtų įrenginių naudotojams ir suteikia mažiau priežasčių išeiti.

Ką darome

Rankos dėlioja kelis šviečiančius išmaniuosius telefonus ant šviesaus medinio stalo

Mūsų front-end kūrimo paslaugos

  • Individualus front-end kūrimas

    Internetinės programėlės, klientų portalai, valdymo skydai, rezervavimo ar apmokėjimo procesai su sudėtinga būsena – sukurti iš komponentų bibliotekos ir optimizuoti greitam atvaizdavimui tikruose įrenginiuose.

  • Front-end perėmimas ir gelbėjimas

    Jei esamas JavaScript kodas tapo trapus, pradedame nuo peržiūros, stabilizuojame rizikingiausias vietas, apgaubiame jas testais ir grąžiname išleidimų kontrolę jums – be viso kodo perrašymo iš karto.

    Daugiau apie paslaugą

  • Modernizavimas ir mikro front-end

    Senstančias sąsajas palaipsniui perkeliame į modernią technologiją, o labai dideles programėles, kai atskiroms komandoms to tikrai reikia, skaidome į savarankiškai diegiamas dalis, kad kompiliavimas ir išleidimai vyktų greičiau.

    Daugiau apie paslaugą

  • Dizaino sistemos ir komponentų bibliotekos

    Storybook dokumentuoti dizaino žetonai, komponentai ir šablonai, kuriais dalijasi dizaineriai ir inžinieriai, todėl šimtai ekranų išlieka nuoseklūs, o nauji sukuriami per valandas, ne per savaites.

    Daugiau apie paslaugą

  • Prieinamumo ir saugumo peržiūros

    Auditai pagal WCAG, testavimas klaviatūra ir ekrano skaitytuvais, taip pat dažnų naršyklės pusės rizikų – nesaugių skriptų, nutekančių žetonų ir pasenusių priklausomybių – patikra, pateikiant pagal prioritetą surikiuotą taisymų sąrašą.

    Daugiau apie paslaugą

  • Technologijų pasirinkimas

    Sąžininga rekomendacija dėl technologijos, atvaizdavimo būdo ir įrankių, atsižvelgiant į jūsų produktą, jūsų komandos įgūdžius ir žmones, kuriuos norėsite samdyti, – užrašyta kartu su visais privalumais ir trūkumais.

Du žmonės ant popieriaus piešia sąsajos maketus šalia nešiojamojo kompiuterio ir lipnių lapelių

Norite sąsajos, kuri veikia akimirksniu ir su kuria malonu dirbti? Pasikalbėkite su įkūrėjais, kurie ją sukurs.

Susisiekite su mumis

Technologijos

Front-end technologijos, su kuriomis dirbame

Renkamės populiarius, gerai palaikomus įrankius, todėl jūsų produktą lengva prižiūrėti ir lengva rasti jam specialistų. Štai ką naudojame ir kada.

React ir Next.js

Mūsų numatytasis pasirinkimas daugumai produktų. React turi didžiausią ekosistemą ir specialistų bendruomenę, o Next.js iš karto suteikia serverio pusės atvaizdavimą, statinį generavimą, maršrutizavimą ir vaizdų optimizavimą. Tinka rinkodaros svetainėms, SaaS valdymo skydams ir turiniui gausiems produktams, kurie turi būti matomi paieškoje ir kartu veikti kaip programėlė.

Vue ir Nuxt

Dėl nesudėtingo mokymosi ir tvarkingos struktūros Vue – puikus pasirinkimas komandoms, kurios nori judėti greitai arba jau jį išmano. Nuxt suteikia Vue projektams tuos pačius serverio pusės atvaizdavimo ir maršrutizavimo privalumus. Taip pat plečiame ir modernizuojame esamus Vue projektus, įskaitant perėjimus tarp pagrindinių versijų.

Angular

Didelėse, ilgai gyvuojančiose verslo programose, prie kurių dirba daug žmonių, Angular griežta struktūra, priklausomybių injekcija ir integruoti įrankiai padeda išlaikyti didelį kodą nuoseklų. Kuriame naujas Angular programas ir padedame komandoms etapais atnaujinti senesnius AngularJS ar Angular projektus.

TypeScript visur

Kiekvieną pradedamą projektą rašome TypeScript. Tipai sugauna ištisas klaidų klases, kol jos nepasiekė naudotojų, daro refaktorinimą saugesnį ir veikia kaip gyva dokumentacija – tai ypač svarbu, kai vėliau kodą perima jūsų komanda ar naujas partneris.

Stiliai ir dizaino sistemos

Stiliams – Tailwind CSS arba CSS moduliai, dizaino žetonai, bendri su Figma, o Storybook – kiekvienam komponentui dokumentuoti ir atskirai testuoti. Rezultatas – biblioteka, kuria gali pasitikėti ir dizaineriai, ir inžinieriai.

Testavimas ir įrankiai

Vitest ir Testing Library komponentams, Playwright pilniems naudotojų keliams skirtingose naršyklėse, vizualinės regresijos patikros, kodo tikrinimas ir formatavimas CI procese, taip pat Lighthouse patikros, kurios pažymi našumo ar prieinamumo regresijas dar prieš sujungiant pakeitimus.

Atvaizdavimas

Kaip pasirinkti puslapių atvaizdavimo būdą

Tai, kaip ir kur puslapis sugeneruojamas, labai veikia greitį, matomumą paieškoje ir talpinimo kainą. Dauguma produktų skirtingiems puslapiams naudoja skirtingus būdus. Štai privalumai ir trūkumai, kuriuos aptariame su jumis.

Statinis generavimasAtvaizdavimas serveryjeKliento pusės programėlė
Kaip veikiaPuslapiai sugeneruojami iš anksto ir pateikiami per CDN, o pasikeitus turiniui atnaujinami.Kiekviena užklausa atvaizduojama serveryje su naujais duomenimis, o naršyklėje puslapis tampa interaktyvus.Naršyklė atsisiunčia programėlę ir pati sukuria puslapį, duomenis gaudama per API.
Pirmasis įkėlimasPaprastai greičiausias, nes puslapis paruoštas dar prieš jo paprašant.Greitas, personalizuoti ar realaus laiko duomenys pateikiami jau pirmajame atsakyme.Lėtesnė pradžia, bet vėliau labai greitas naršymas programėlėje.
Matomumas paieškojePuikus: paieškos robotai mato pilnus puslapius.Puikus: paieškos robotai mato pilnus, atnaujintus puslapius.Silpnesnis viešiems puslapiams, jei turinys nėra sugeneruotas iš anksto.
Talpinimo kainaMaža, nes failai saugomi spartinančiojoje atmintinėje tinklo pakraštyje.Didesnė, nes serveriai dirba su kiekviena užklausa.Maža pačiai programėlei, o išlaidos tenka už jos esantiems API.
Geriausiai tinkaRinkodaros svetainėms, dokumentacijai, tinklaraščiams ir produktų katalogams.Valdymo skydams su realaus laiko duomenimis, prisijungusiųjų zonoms ir personalizuotiems puslapiams.Labai interaktyviems įrankiams, pavyzdžiui, redaktoriams, konstruktoriams ir vidinėms programoms.

Kokybės kartelė

Standartai, kuriuos atitinka kiekviena mūsų išleista sąsaja

Tai patikros, kurių laikomės kiekviename front-end projekte, nesvarbu, kokia technologija naudojama.

  • Core Web Vitals ribos

    Įkėlimas, reakcijos greitis ir maketo stabilumas matuojami po kiekvieno pakeitimo, o ne vieną kartą prieš paleidimą.

  • WCAG prieinamumas

    Spalvų kontrastas, valdymas klaviatūra, fokusavimo tvarka ir ekrano skaitytuvų etiketės numatomi kuriant ir testuojami rankiniu būdu.

  • Prisitaikantis dizainas iš karto

    Maketai testuojami nuo mažų telefonų iki plačių ekranų, atsižvelgiant ir į lietimą, ir į pelę.

  • Paieškai draugiškas žymėjimas

    Semantinis HTML, metaduomenys ir struktūrizuoti duomenys, kad paieškos sistemos ir asistentai teisingai suprastų puslapius.

  • Paruošta kitoms kalboms

    Vertimui paruoštas tekstas, pagal lokalę rodomos datos ir skaičiai bei maketai iš dešinės į kairę, kur jų reikia.

  • Testavimas skirtingose naršyklėse

    Prieš kiekvieną išleidimą pagrindiniai naudotojų keliai automatiškai paleidžiami pagrindiniuose naršyklių varikliuose.

  • Privatumą gerbianti analitika

    Stebėjimas, paisantis sutikimo pasirinkimų: jokie trečiųjų šalių skriptai neįkeliami, kol naudotojai nesutinka.

  • Klaidų stebėsena

    Naršyklės klaidos pranešamos su kontekstu, todėl problemas galime ištaisyti, kol su jomis nesusidūrė dauguma naudotojų.

Kaip dirbame

Kaip vyksta front-end projektas su mumis

Nesvarbu, ar pradedame nuo nulio, ar nuo esamo kodo, eiga ta pati: suprantame naudotojus, paklojame pagrindus ir tada išleidžiame mažomis dalimis, kurias galite matyti ir išbandyti.

  1. 01

    Peržiūra ir planas

    Įvertiname jūsų naudotojus, dizainą ir esamą kodą, susitariame dėl tikslų ir apribojimų, rekomenduojame technologiją ir atvaizdavimo būdą. Kiekviename iš šių pokalbių dalyvauja įkūrėjas.

  2. 02

    Pagrindai

    Pirmiausia sukuriama projekto struktūra, dizaino žetonai, pirmieji pagrindiniai komponentai, CI patikros ir našumo ribos, kad kiekviena vėlesnė funkcija būtų kuriama tuo pačiu patikimu būdu.

  3. 03

    Kūrimas vertikaliomis dalimis

    Trumpais sprintais pristatome užbaigtus naudotojų kelius – nuo ekrano iki API užklausos. Kiekvienam pakeitimui gaunate peržiūros nuorodą ir tikras funkcijas galite išbandyti savo naršyklėje, o ne žiūrėti ekrano kopijas.

  4. 04

    Testavimas tikruose įrenginiuose

    Automatiniai testai skirtingose naršyklėse, rankinės patikros telefonuose ir planšetėse bei prieinamumo testavimas klaviatūra ir ekrano skaitytuvais – dar prieš tai, kai kas nors pasiekia jūsų naudotojus.

  5. 05

    Paleidimas, matavimas, tobulinimas

    Kur tai naudinga, naujoves išleidžiame su funkcijų jungikliais (feature flags), stebime realių naudotojų našumo ir klaidų duomenis, o tada toliau tobuliname dažniausiai naudojamas dalis.

Klientų atsiliepimai

Darbas su Authect iš esmės pakeitė mūsų skaitmeninę infrastruktūrą. Jų inžinierių komanda mūsų sudėtingą prekybos algoritmų platformą pristatė dviem savaitėmis anksčiau nei planuota, nenukentėjo nei kodo kokybė, nei atitiktis saugumo reikalavimams. Sklandi komunikacija ir gilios techninės žinios pavertė juos tikru strateginiu partneriu.
Dmitry SokolovProdukto vadovas, FinTech Solutions

Planuojate naują sąsają ar norite sutvarkyti tą, kuri jus stabdo? Pasikalbėkite su įkūrėjais, kurie ją kurs.

Susisiekite su mumis

Atvejų studijos

Naujausi Authect darbai

Sektoriai

Front-end kūrimas įvairiems sektoriams

E. prekyba

Elektroninės parduotuvės, prekių sąrašai, paieška ir filtrai, krepšeliai ir atsiskaitymo procesai, kuriuose kiekviena papildoma sekundė ar painus žingsnis kainuoja pardavimus. Daugiausia dėmesio skiriame greitiems prekių puslapiams, aiškioms kainoms ir atsiskaitymui, kuris veikia bet kuriame telefone.

Pakuotojas, matomas iš nugaros, deda megztinius į kartoninę dėžę užsakymų vykdymo sandėlyje
Fintech

Naujų klientų registracija su tapatybės patikra, paskyrų skydeliai, mokėjimų ir pervedimų ekranai bei grafikai, kuriuose likučius ir istoriją lengva suprasti. Visa tai su patikimu sesijų valdymu ir aiškiais patvirtinimais kiekviename rizikingame žingsnyje.

Žmogus rodo į nešiojamąjį kompiuterį su grafikais šalia atspausdintų ataskaitų ir planšetės
Sveikatos priežiūra

Pacientų portalai, vizitų registracija ir gydytojų skydeliai, kurie turi būti prieinami visiems, suprantami iš pirmo žvilgsnio ir atsargiai rodyti jautrius duomenis ekrane.

Gydytojas ir pacientas prie stalo su stetoskopu žiūri į planšetę
Svetingumo verslas

Rezervavimo sistemos, užimtumo kalendoriai ir programėlės svečiams, kurios veikia telefone viešbučio fojė, rodo kainas realiuoju laiku ir sklandžiai veda nuo naršymo iki patvirtintos rezervacijos.

Rankos laiko planšetę viešbučio registratūroje šalia skambutėlio ir kortelės-rakto
Žiniasklaida ir pramogos

Turinio gausios svetainės ir srautinio transliavimo platformų sąsajos, kurios greitai įsikelia, gerai reitinguojamos paieškoje, susitvarko su didelėmis vaizdų ir vaizdo įrašų bibliotekomis ir skatina skaitytojus pereiti prie kito straipsnio.

Vaizdo montuotojo rankos ant klaviatūros, ekrane – montažo laiko juosta
Valstybės institucijos

Viešosios paslaugos ir formos, kurios atitinka griežtus prieinamumo reikalavimus, veikia senesniuose įrenginiuose ir esant lėtam ryšiui bei veda žmones per sudėtingas paraiškas po vieną aiškų žingsnį.

Rankos liečia planšetės ekraną viešųjų paslaugų aptarnavimo vietoje

Kodėl Authect

Kodėl komandos front-end kūrimui renkasi Authect

  1. 01

    Dirbate su tais, kurie kuria

    Bendraujate su įkūrėjais ir vyresniuoju inžinieriumi, kurie kuria jūsų sąsają, o ne su pardavėju. Sprendimus dėl jūsų produkto priima žmonės, kurie išmano kodą.

  2. 02

    Mažos, patyrusios komandos

    Maža komanda, kuriai vadovauja vyresnysis inžinierius, reiškia trumpą komunikaciją ir pastovią kokybę. Kiekvienas joje žino jūsų produktą, jūsų naudotojus ir kodėl buvo priimtas kiekvienas sprendimas.

  3. 03

    Inžinieriai, kuriems rūpi dizainas

    Tarpais, animacijomis ir tuščiomis būsenomis rūpinamės ne mažiau nei architektūra. Glaudžiai dirbame su jūsų ar mūsų dizaineriais, kad tai, kas išleidžiama, atitiktų sumanymą.

  4. 04

    Viskas lieka jums

    Kodas, komponentai ir dokumentacija nuo pirmos dienos yra jūsų paskyrose. Jūsų vidinė komanda ar kitas partneris gali perimti darbą bet kada, be jokio įsipareigojimo vienam tiekėjui.

Programuotojas prie stovimo stalo testuoja programėlę išmaniajame telefone ir rašo nešiojamuoju kompiuteriu

Kaip bendradarbiaujame

Kaip galime kartu dirbti su jūsų front-end

Pradėkite nuo fiksuotos kainos projekto, dirbkite mėnesio sprintais kartu su savo komanda arba, kai sąsaja jau veikia, patikėkite mums jos palaikymą ir tolesnį vystymą.

  • 01

    Projektas už fiksuotą kainą

    Aiškiai apibrėžtas produktas, sukuriamas už sutartą kainą ir per sutartą laiką. Puikiai tinka MVP ir aiškiai apibrėžtiems projektams.

    Mūsų atsakomybė:
    sutarto produkto apimtis, planas, biudžetas, kokybė ir pristatymas.
    Jūsų atsakomybė:
    verslo kontekstas, savalaikiai atsiliepimai ir apimties patvirtinimas.
  • 02

    Mėnesiniai sprintai

    Jums skirta komanda, vadovaujama vyresniojo inžinieriaus, dirba trumpais sprintais, o sąskaitos išrašomos kas mėnesį. Puikiai tinka, kai jūsų prioritetai keičiasi, mokantis iš naudotojų.

    Mūsų atsakomybė:
    komanda, sprintų rezultatai, inžinerinė kokybė ir skaidrios ataskaitos.
    Jūsų atsakomybė:
    produkto vizija ir prioritetų nustatymas kartu su mumis kiekvieno sprinto metu.
  • 03

    Priežiūra ir tobulinimas

    Po paleidimo užtikriname, kad jūsų produktas būtų greitas, saugus ir atnaujintas, ir toliau diegiame patobulinimus, augant jūsų verslui.

    Mūsų atsakomybė:
    stebėsena, atnaujinimai, klaidų taisymas ir sutarti reagavimo laikai.
    Jūsų atsakomybė:
    pranešimas apie problemas ir tolesnių patobulinimų planavimas kartu su mumis.

Įžvalgos

DUK

DUK apie front-end kūrimą

Kas yra front-end kūrimas?

Front-end kūrimas apima viską, ką jūsų naudotojai mato naršyklėje ir su kuo sąveikauja: maketus, navigaciją, formas, animacijas ir logiką, kuri visa tai sujungia su jūsų back end. Jis paverčia dizainą veikiančiomis, prieinamomis sąsajomis ir lemia, kiek greitas ir patikimas atrodo jūsų produktas.

Kodėl verta rinktis Authect kaip front-end kūrimo partnerį?

Tiesiogiai dirbate su įkūrėjais ir vyresniuoju inžinieriumi, kurie kuria jūsų sąsają, be jokių klientų vadybininkų tarpe. Darbą pagreitiname dirbtiniu intelektu, kiekvieną kodo eilutę peržiūri inžinierius, o viskas, ką sukuriame, nuo pirmos dienos yra jums priklausančiose saugyklose ir paskyrose.

Kokias front-end technologijas naudojate?

Daugiausia TypeScript su React ir Next.js, taip pat Vue, Nuxt ir Angular, kai jie geriau tinka jūsų produktui ar esamai komandai. Stiliams ir komponentams naudojame Tailwind CSS, CSS modules ir Storybook, o testuojame su Vitest, Testing Library ir Playwright. Technologijas rekomenduojame tik supratę jūsų tikslus, ne anksčiau.

Ar kuriate pagal WCAG prieinamumo standartus?

Taip. Nuo pat pradžių projektuojame ir kuriame pagal WCAG gaires: tinkamas kontrastas, valdymas klaviatūra, matomas fokusas, prasmingos etiketės ir semantinė struktūra. Testuojame automatiniais įrankiais ir rankiniu būdu su klaviatūra bei ekrano skaitytuvais. Taip pat galime įvertinti esamą sąsają ir pateikti pagal prioritetus surikiuotą taisymų sąrašą.

Kaip suprasti, ar front-end programuotojas turi reikiamų įgūdžių?

Žiūrėkite plačiau nei į karkasą, nurodytą CV. Paklauskite, kaip jis pagreitintų lėtą puslapį, kaip užtikrina prieinamumą, kaip struktūruoja būseną didelėje programoje ir kaip ją testuoja. Stiprūs front-end inžinieriai kalba apie naudotojus, našumą ir palaikomumą, o kompromisus moka paaiškinti paprastais žodžiais. Pagal šį kriterijų mes samdome ir dirbame.

Ar galite dirbti su mūsų dizaineriais ar pagal esamą dizainą?

Taip. Galime kurti pagal jūsų Figma failus ir dirbti kartu su jūsų dizaino komanda, arba mūsų produkto dizaineriai kartu su jumis sukurs ar patobulins dizainą. Bet kuriuo atveju anksti susitariame dėl bendros komponentų bibliotekos, kad dizainas ir kodas neišsiskirtų.

Ar galite perimti ar patobulinti esamą front-end?

Taip. Pradedame nuo kodo, priklausomybių, našumo ir prieinamumo peržiūros, tada susitariame, ką taisyti pirmiausia. Dažniausiai esamą sprendimą tobuliname palaipsniui, žingsnis po žingsnio, todėl jūsų naudotojai ir toliau gauna naujas versijas, o kodas tampa vis sveikesnis.

Papasakokite, ką kuriate. Įkūrėjas atsakys per vieną darbo dieną ir kurs projektą kartu su jumis.

Jūsų duomenis įrašysime į savo CRM sistemą, kad galėtume su jumis susisiekti dėl jūsų užklausos. Daugiau informacijos rasite mūsų privatumo politikoje.