Barreeffamni kun kan ispoonsara ta'e SurveyJS dha Moodeelli sammuu irra caalaan React developers osoo sagalee isaanii ol kaasanii hin mari’atin qooddatan jira. Unkaaleen yeroo hunda qaamolee ta’uu akka qaban. Kana jechuun tuullaa akka:

Unka React Hook haala naannootiif (deebi'ee agarsiisuu xiqqaa, galmee dirree ergonomic, walqunnamtii dirqamaa). Zod mirkaneessuuf (sirrummaa galtee, mirkaneessuu daangaa, qoqqoodinsa gosa-nageenya qabu). React Query for backend: galchuu, irra deebi'ee yaalu, kuusuu, walsimsiisa sarvarii fi kkf.

Akkasumas unkaalee baay'eedhaaf — iskiriinii seensaa kee, fuula qindaa'inoota kee, moodaalota CRUD kee — kun dhuguma akka gaariitti hojjeta. Tokkoon tokkoon kutaa hojii isaa hojjeta, isaan qulqullinaan qindeessu, akkasumas gara kutaalee application keetii dhugumatti oomisha kee adda godhanitti ce'uu dandeessa. Garuu yeroo tokko tokko, unkaan tokko wantoota akka seera mul'achuu kan deebii duraanii irratti hundaa'an, ykn gatiiwwan argaman kanneen dirree sadii keessaa dhangala'an kuufachuu jalqaba. Tarii fuula guutuu illee kan darbamuu qabu ykn waliigala fiigichaa irratti hundaa'uun agarsiifamuu qabu. Haalata jalqabaa useWatch fi damee sarara keessaatiin qabatta, kunis gaarii dha. Sana booda kan biraa. Sana booda seera dirree qaxxaamuraa kan iskiimaan Zod kee karaa idileetiin ibsuu hin dandeenye koodii gochuuf superRefine bira ga’aa jirta. Sana booda, tarkaanfii navigeeshiniin loojikii daldalaa dhangala'uu jalqaba. Yeroo tokko tokko waan ijaarte ilaaltee unkaan sun kana booda dhuguma UI akka hin taane hubatta. Caalaatti adeemsa murtii ti, mukni qaamaa bakka ati akka tasaatti itti kuufatte qofa. Kunis bakka ani akkan yaadutti moodeelli sammuu unkaalee React keessatti caccabu, dhugumas badii nama tokkoo miti. RHF + Zod stack waan itti qophaa'eef baay'ee gaarii dha. Dhimmichi filannoon guutummaatti waa’ee bifa adda ta’e waan barbaaduuf bakka abstractions isaa rakkoo wajjin walsimu bira darbee itti fayyadamuu itti fufna. Barreeffamni kun waa’ee filannoo sanaati. Kana agarsiisuuf, unka tarkaanfii hedduu sirriitti walfakkaatu yeroo lama ijaarra:

Unka React Hook + Zod gara React Querytti wired ta'een akka dhiyaatu, . SurveyJS waliin, kan unka akka deetaa ilaalu — iskiimaa JSON salphaa — muka qaama osoo hin taane.

Ulaagaalee walfakkaataa, loojikii haal-duree walfakkaataa, waamicha API walfakkaataa dhuma irratti. Sana booda maaltu akka socho’ee fi maaltu akka hafe sirriitti kaartaan ni kaa’a, akkasumas karaa qabatamaa moodeela kam fayyadamuu akka qabdu, fi yoom fayyadamuu akka qabdu murteessuuf ni diriirna. Unkaan ijaaraa jirru:

Unkaan kun dhangala'aa tarkaanfii 4 fayyadama: Tarkaanfii 1: Bal’ina

Maqaa jalqabaa (barbaachisaa), . Imeelii (barbaachisaa, bifa sirrii ta'e).

Tarkaanfii 2ffaa: Tartiiba

Gatii yuunitii, . Baay’ina, . Sadarkaa gibiraa, . Kan irraa argame: Waliigala xiqqaa, . Gibira, . Waliigala.

Tarkaanfii 3: Herrega & Yaada

Akkaawuntii qabduu? (Eeyyee/Lakki) Yoo Eeyyee → maqaa fayyadamaa + jecha icciitii, lamaan isaanii barbaachisa. Yoo Lakki → email duraan tarkaanfii 1 keessatti walitti qabame.

Sadarkaa itti quufinsa (1–5) . Yoo ≥ 4 → “Maal jaallatte?” Yoo ≤ 2 → “Maal fooyyessuu dandeenya?”

Tarkaanfii 4: Irra deebi’i

Yoo waliigala >= 100 ta'e qofa mul'ata Dhiyeessii dhumaa.

Kun garmalee miti. Garuu garaagarummaa ijaarsaa saaxiluudhaaf gahaadha. Kutaa 1ffaa: Qaamoleedhaan kan oofan (React Hook Form + Zod) . Dhaabbii npm unka-hook-react zod @hookform/furtoowwan @tanstack/gaaffii-deebi'uu fe'i

Zod Iskiimaa Mee iskiimaa Zod irraa haa jalqabnu, sababiin isaas yeroo baay’ee bakka bocni unkaa itti hundeeffamudha. Tarkaanfiiwwan lamaan jalqabaa — ibsa dhuunfaa fi galtee tartiiba — wanti hundi qajeelaa dha: dhangiiwwan barbaachisoo, lakkoofsota xiqqaa qaban, fi enum. Kutaan hawwataan kan jalqabu yeroo seera haalduree ibsuuf yaaltudha.

{ z } "zod" irraa galchuu;

export const formSchema = z.object({ Maqaa jalqabaa: z.string().min(1, "Barbaachisaa"), email: z.string().email("Imeelii sirrii hin taane"), gatii: z.lakkoofsa().min(0), baay'ina: z.lakkoofsa().min(1),TaxRate: z.lakkoofsa(), hasAccount: z.enum(["Eeyyee", "Lakki"]), maqaa fayyadamaa: z.string().filannoo(), jecha icciitii: z.string().filannoo(), itti quufinsa: z.lakkoofsa().min(1).max(5), Yaada gaarii: z.string().filannoo(),Deebiin fooyya'iinsaa: z.string().filannoo(),}).superRefine((deetaa, ctx) => { if (data.hasAccount === "Yes") { if (!maqaa deetaa.maqaa fayyadamaa) { ctx.addIssue({ koodii: "maqaa", karaa: ["maqaa fayyadamaa"], ergaa: "Barbaachisaa" }); } if (!data.jecha icciitii || deetaa.jecha icciitii.dheerina < 6) { ctx.addIssue({ koodii: "aada", karaa: ["jecha icciitii"], ergaa: "Arfiilee 6 ol" });

if (data.satisfaction >= 4 && !data.positiveFeedback) { ctx.addIssue({ koodii: "aada", daandii: ["Yaada gaarii"], ergaa: "Maaloo waan jaallatte qoodi" }); } .

if (quufa.deetaa <= 2 && !Yaada fooyya'iinsa deetaa) { ctx.addIssue({ koodii: "amaata", daandii:["improvementFeedback"], message: "Maaloo waan fooyyessuu qabnu nutti himaa" }); }});

gosa al-ergii UnkaDeetaa = z.infer;

Maqaan fayyadamaa fi jechi icciitii akka filannoo()tti akka barreeffamu hubadhu haal-dureedhaan barbaachisaa ta’us sababni isaas iskiimaan sadarkaa gosa Zod boca wantaa ibsa malee seera yeroo man’eewwan dhimma qaban bulchan miti. Barbaachisummaan haal-duree superRefine keessa jiraachuu qaba, kunis erga bocni mirkanaa'ee booda kan hojjetuu fi wanta guutuuf qaqqabummaa qaba. Gargar bahuun sun mudaa miti; innis waan meeshaan sun itti qophaa’e qofa: superRefine bakka loojiki dirree qaxxaamuraa yeroo caasaa iskiimaa ofii isaa keessatti ibsamuu hin dandeenye itti deemudha. Asitti wanti hubatamuu qabus waan iskiimaan kun hin ibsinedha. Yaad-rimee fuula hin qabu, yaad-rimee man'ee kamtu bakka kamitti akka mul'atu, fi yaad-rimee navigeeshinii hin qabu. Sun hundi bakka biraa jiraata. Qaama Unkaa

import { useForm, useWatch } from "react-hook-form";import { zodResolver } from "@hookform/resolvers/zod";import { useMutation } from "@tanstack/react-query";import { Haalata fayyadamaa, useMemo } "react" irraa;import { formSchema, type FormData } from "./schema";

const STEPS = ["ballina", "tartiiba", "herrega", "gamaaggama"];

gosa Fe'iinsaKaffaltii Tartiiba = Deetaa Unkaa & { waliigala xiqqaa: lakkoofsa; gibira: lakkoofsa; waliigala: lakkoofsa };

faankishinii al-ergii RHFMultiStepForm () { const [tarkaanfii, Tarkaanfii saagi] = Haala Fayyadamaa (0);

const mutation = jijjiirama fayyadamuu({ mutationFn: async (fe'umsa: Fe'iinsaKaffaltii Ajaja) => { const res = eegaa fiduu ("/api/ajajoota", { mala: "POST", . mataduree: { "Akkaataa-Qabiyyee": "application/json" }, . qaama: JSON.stringify (fe'umsa), . }); if (!res.ok) throw new Dogoggora("Galchuu hin dandeenye"); res.json () deebisuu; }, . });

const { galmee, to'annoo, handleGalchi, haala unkaa: { dogongora }, } = unka fayyadamuu({ furtuu: zodResolver(formSchema), Gatii durtii: { gatii: 0, baay'ina: 1, Sadarkaa gibiraa: 0.1, itti quufinsa: 3, hasAccount: "Lakki", }, }); const gatii = useWatch ({ to'annoo, maqaa: "gatii" }); const baay'ina = useWatch ({ too'annoo, maqaa: "baay'ina" }); constTaxRate = useWatch ({ to'annoo, maqaa: "Safartuu gibiraa" }); const Herrega qaba = useWatch ({ too'annoo, maqaa: "Herrega qaba" }); const itti quufinsa = useWatch ({ to'annoo, maqaa: "quufa" }); const subtotal = useMemo (() => (gatii ?? 0) * (baay'ina ?? 1), [gatii, baay'ina]); const tax = useMemo (() => waliigala xiqqaa * (Safartuu gibiraa ?? 0), [waliigala xiqqaa, Sadarkaa gibiraa]); const waliigala = useMemo (() => waliigala xiqqaa + gibira, [waliigala xiqqaa, gibira]); const onSubmit = (deetaa: FormData) => mutation.mutate ({ ...deetaa, waliigala xiqqaa, gibira, waliigala }); const agarsiisiGalchi = (tarkaanfii === 2 && waliigala < 100) || (tarkaanfii === 3 && waliigala >= 100)

return (

{tarkaanfii === 0 && ( <> )}

{tarkaanfii === 1 && ( <> 5% 10% 15%

Waliigala xiqqaa: {waliigala xiqqaa}
Gibira: {gibira}
Waliigala: {waliigala}
)}

{tarkaanfii === 2 && ( <> Eeyyee Lakki

{hasAccount === "Eeyyee" && ( <> )}

{quufa >= 4 && ( )}

{quufa <= 2 && ( )} )}

{tarkaanfii === 3 && waliigala >= 100 &&

Irra deebi'ii ilaalii fi galchi
}

{tarkaanfii > 0 && Tarkaanfii saagi(tarkaanfii - 1)}>Duuba} {showSubmit ? ( {mutation.isPending ? "Galmaa jira..." : "Galchiisaa"} ) : tarkaanfii < STEPS.length - 1 ? ( Tarkaanfii saagi(tarkaanfii + 1)}>Itti Aanu ) : null}
{jijjiirama.dogongora &&
Dogongora: {jijjiirama.dogongora.ergaa}
} );}

Qorannoon QalamaJS-03-RHF [forked] ja’a dhabamsiisuudhaan ilaali. Asitti waan baay’eetu ta’aa jira, wanti eessatti akka xumurame hubachuuf saffisa isaa hir’isuun barbaachisaadha.

Gatiin argame — waliigala xiqqaa, gibira, waliigala — qaama keessatti karaa useWatch fi useMemo shallagama sababiin isaas gatiiwwan dirree jiraataa irratti waan hundaa’aniif bakki uumamaa biraa isaaniif hin jiru. Seerotni mul'achuu maqaa fayyadamaa, jecha icciitii, yaada gaarii, fi yaada fooyya'iinsaa JSX keessatti akka haal-duree sarara keessaa jiraatu. Loojikiin tarkaanfii darbuu — fuul-barruu gamaaggamaa yeroo waliigala >= 100 qofa mul'atu — jijjiiramaa showSubmit fi haalata agarsiisaa tarkaanfii 3 irratti uuma. Navigation mataan isaa lakkaawwii useState qofa kan harkaan dabalaa jirrudha. Gaaffiin Deebi'uu irra deebi'amee yaaluun, kuusuu, fi sirrii ta'uu dhabuu qabata. Unkaan kun deetaa mirkanaa'e waliin mutation.mutate qofa waama.

Kun tokkollee dogoggora miti, mataa isaatiin. Kun ammallee idiomatic React dha, fi qaamni akkaataa RHF irra deebi'ee agarsiisa adda baasuuf galata baay'ee ga'umsa qaba. Garuu yoo kana nama hin barreessine tokkoof kennitee fuul-durri gamaaggamaa haala akkamii keessatti akka mul’atu akka ibsan yoo gaafatte, isaan karaa showSubmit, haala agarsiisaa tarkaanfii 3, fi loojikii buttooni nav — bakka adda addaa sadii — seera sarara tokkoon ibsamuu danda’u irra deebi’anii ijaaruuf hordofuu qabu. Unkaan ni hojjeta, eeyyee, garuu amala akka sirnaatti dhuguma sakatta’amuu hin danda’u. Sammuudhaan raawwatamuu qaba. Kan caalu ammoo jijjiiruun hirmaannaa injinariingii gaafata. Jijjiirraan xiqqaan illee, akka yeroo tarkaanfiin gamaaggamaa mul'atu sirreessuu, qaama gulaaluu, mirkaneessuu fooyyessuu, gaaffii harkisuu banuu, gamaaggama eeguu fi irra deebi'anii bobbaasuu jechuudha. Kutaa 2ffaa: Iskiimaadhaan Hogganamu (SurveyJS) . Amma dhangala’aa walfakkaatu iskiimaa fayyadamuun haa ijaarru. Dhaabbii npm qorannoo-ijoo qorannoo-deebii-ui @tanstack/react-query fe'i

survey-coreMotora yeroo gaggeeffamaa waltajjii irraa walaba ta’e kan MIT-heyyama qabu kan SurveyJS’s unka agarsiisaa humna kennu — kutaa nuti asitti dhimmamnu. Iskiimaa JSON fudhata, moodeela keessoo irraa ijaara, fi waan osoo akkas ta'ee qaama React kee keessa jiraatu hunda qabata: ibsa mul'achuu madaaluu, gatiiwwan argaman shallaguu, haalata fuula bulchuu, mirkaneessuu hordofuu, fi fuula kamtu qabatamaan agarsiifame kennameef “guutuu” jechuun maal jechuu akka ta'e murteessuu. survey-react-uiLaayibarii UI / agarsiisaa kan moodeela sana React waliin walqabsiisu. Bu’uuraan qaama kan yeroo haalli motoraa jijjiiramu hunda irra deebi’ee agarsiisudha. Manneen kitaabaa UI SurveyJS Angular, Vue3, fi unkaalee biroo hedduudhaafis ni argamu.

Walitti, isaan sarara tokko dhangala'aa too'annoo osoo hin barreessiin yeroo gaggeeffama unkaa guutummaatti dalagaa qabu, fuula hedduu siif kennu. Akkaataan iskiimaa mataan isaa, akkuma kanaan dura jedhame, JSON qofa — DSL ykn waan abbaa qabeenyummaa hin qabu. Sarara keessa galchuu, faayilii irraa galchuu, API irraa fiduu, ykn tarjaa kuusdeetaa keessatti kuusuu fi yeroo gaggeeffamu bishaan itti gochuu dandeessa. Bifa Wal Fakkaatu, Akka Daataa Kunoo unka walfakkaatu, yeroo kana akka wanta JSON ibsame. Iskiimaan waan hunda ibsa: caasaa, mirkaneessuu, seera mul'achuu, shallaggii bu'aa, navigeeshinii fuula — fi Moodeela yeroo gaggeeffama madaalutti dabarsee kenna. Sun guutummaatti maal akka fakkaatu kunooti:

export const surveySchema = { mata duree: "Dhangala'aa Tartiiba", showProgressBar: "gubbaa", fuula: [ { maqaa: "ballina", elementoota: [ { gosa: "barruu", maqaa: "Maqaa jalqabaa", isBarbaachisa: dhugaa }, { gosa: "barruu", maqaa: "iimeelii", gosa galtee: "iimeelii", isBarbaachisa: dhugaa, mirkaneessitoota: [{ gosa: "iimeelii", barruu: "Imeelii sirrii hin taane" }] } ] }, { maqaa: "tartiiba", elementoota: [ { gosa: "barruu", maqaa: "gatii", Gosa galtee: "lakkoofsa", Gatii durtii: 0 }, { gosa: "barruu", maqaa: "baay'ina", Gosa galtee: "lakkoofsa", Gatii durtii: 1 }, { gosa: "dropdown",maqaa: "taxRate", durtiiGatii: 0.1, filannoowwan: [ { gatii: 0.05, barruu: "5%" }, { gatii: 0.1, barruu: "10%" }, { gatii: 0.15, barruu: "15%" } ] }, { gosa: "ibsa", maqaa: "waliigala xiqqaa", ibsa: "{gatii} {baay'ina}" }, { gosa: "ibsa", maqaa: "gibira", ibsa: "{waliigala xiqqaa} {Safartuu gibiraa}" }, { gosa: "ibsa", maqaa: "waliigala", ibsa: "{waliigala xiqqaa} + {gibira}" } ] }, { maqaa: "herrega", elementoota: [ { gosa: "garee raadiyoo", maqaa: "Herrega qaba", filannoowwan: ["Eeyyee", "Lakki"] }, { gosa: "barruu", maqaa: "maqaa fayyadamaa", visibleIf: "{hasAccount} = 'Eeyyee'", isRequired: dhugaa }, { gosa: "barruu", maqaa: "jecha darbii", inputType: "jecha darbii", visibleIf: "{hasAccount} = 'Eeyyee'", isRequired: dhugaa, mirkaneessitoota: [{ gosa: "barruu", minDheerinni: 6, barruu: "Arfiilee 6 keessatti baay'ee" } ] }, { gosa: "sadarkaa", maqaa: "itti quufinsa", rateMin: 1, rateMax: 5 }, { gosa: "yaada", maqaa: "Yaada gaarii", mul'ataIf: "{quufa} >= 4" }, { gosa: "yaada", maqaa: "yaada fooyya'iinsaa", mul'ataYoo: "{quufa} <= 2" } ] }, { maqaa: "gamaaggama", visibleIf: "{waliigala} >= 100", elementoota: [] } ]};

Kana yeroo muraasaaf kan RHF version wajjin wal bira qabi ilaali.

Uggurri superRefine kan maqaa fayyadamaa fi jecha icciitii haal-dureedhaan barbaadu hin jiru. visibleIf: "{hasAccount} = 'Eeyyee'" isRequired wajjin walitti makame: dhugaan yaaddoowwan lamaan waliin qabata, dirree mataa isaa irratti, bakka ati isaan argachuuf eegdu. Sanduuqa useWatch + useMemo kan waliigala xiqqaa, gibira, fi waliigala shallage man'eewwan ibsa sadii kanneen maqaadhaan wal waamaniin bakka bu'a. Haalli fuula gamaaggamaa, kan gosa RHF keessatti karaa showSubmit, damee agarsiisaa tarkaanfii 3 hordofuu qofaan irra deebi'amee ijaaramuu danda'e. Akkasumas dhumarratti, loojikii qaree nav qabeentaa visibleIf tokkicha wanta fuula irratti.

Loojikiin wal fakkaataan jira. Iskiimaan bakka adda baafamee mul’atutti bakka itti jiraatu kennuu isaa qofa, qaama sana keessatti babal’achuu caalaa. Akkasumas, iskiimaan akaakuu: 'ibsa' waliigalaa xiqqaa, gibira, fi waliigalaa akka fayyadamu hubadhu. Ibsi dubbisa qofaaf kan oolu yoo ta'u, baay'inaan gatiiwwan shallagaman agarsiisuuf fayyadama. SurveyJS akkasumas gosa: 'html' qabiyyee istaatiksiidhaaf ni deeggara, garuu gatiiwwan shallagamaniif, ibsi filannoo sirrii dha. Amma gama React jedhuuf. Rendering Fi Dhiyeessuu Baayyee salphaadha. Wire onComplete gara API keetii haala walfakkaatuun — karaa useMutation ykn plain fetch:

import { useState, useEffect, useRef } from "react";import { useMutation } from "@tanstack/react-query";import { Model } from "survey-core";import { Qorannoo } from "qorannoo-deebii-ui";import "qorannoo-huree/qorannoo-core.css";

faankishinii al-ergii Unka Qorannoo () { const [moodeela] = Haala Fayyadamaa (() => Moodeela haaraa (Iskiimaa qorannoo));

const mutation = jijjiirama fayyadamuu({ jijjiiramaFn: walsimsiisaa (daataa) => { . const res = eegaa fiduu ("/api/ajajoota", { mala: "POST", . mataduree: { "Akkaataa-Qabiyyee": "application/json" }, . qaama: JSON.stringify(deetaa), . }); if (!res.ok) throw new Dogoggora("Galchuu hin dandeenye"); res.json () deebisuu; }, . });

const mutationRef = fayyadamaRef (jijjiirama); mutationRef.current = jijjiirama; useEffect(() => { const handler = (ergaa) => mutationRef.current.mutate(ergaa.daataa); model.onGuutummaa.dabaluu(handler); return () => model.onGuutummaa.remove(handler); }, [model]); // ref render hunda handler irra deebi'ee galmeessuu irraa fagaata (jijjiirama eenyummaa wanta jijjiirama) .

deebi'i ( <> {mutation.isError &&

Dogongora: {jijjiirama.dogongora.ergaa}
} jechuun ni danda’ama ); } .

Qorannoon QalamaJS-03-QorannooJS [forked] by sixthextinction ilaali.

onComplete yeroo fayyadamaan dhuma fuula mul'atu isa dhumaa ga'u dhukaasa. Kanaafuu yoo waliigala gonkumaa 100 hin qaxxaamurree fi fuul-barruu gamaaggamaa darbe, ammallee sirriitti dhukaasa sababiin isaas SurveyJS “fuula dhumaa” jechuun maal jechuu akka ta’e murteessuu isaa dura mul’achuu madaala. Sana booda, sender.data deebii hunda gatiiwwan shallagaman (waliigala xiqqaa, gibira, waliigala) waliin akka man'ee gita tokkoffaatti of keessaa qaba, kanaaf fe'iinsi API waan gosti RHF harkaan onSubmit keessatti walitti qabe waliin walfakkaata. IchamutationRef patterni bakka kamitti iyyuu gatii agarsiisa hunda irratti jijjiiramu irratti qabattuu taatee tasgabbaa’aa barbaaddutti geessudha — waa’ee isaa homaa SurveyJS-specific hin jiru.

Qaamni React kana booda tasuma loojikii daldalaa tokkollee hin qabu. useWatch hin jiru, JSX haal-duree hin jiru, lakkaawwii tarkaanfii hin jiru, sansalata useMemo hin jiru, superRefine hin jiru. React waan qabatamaan itti ga’umsa qabu hojjechaa jira: qaama tokko agarsiisuu fi waamicha APItti waayirii gochuu. Maaltu React Keessaa Ba'e?

Yaaddoo RHF Tuullaa QorannoonJS Mul’achuu Dameelee JSX mul'ataaYoo Gatii irraa argame useWatch / useMemo ibsa Seera dirree qaxxaamuraa superRefine gochuu Haalawwan iskiimaa Navigeeshinii (Navigation) jedhu haala tarkaanfii Fuula mul'atuYoo Bakka seera Faayilota hunda irratti raabsama Iskiimaa keessatti giddugaleessa ta’e

Wanti React keessatti hafu layout, styling, submission wiring, fi app integration yoo ta'u, kunis wantoota React qabatamaan itti qophaa'e jechuudha. Wanti biraa hundi gara iskiimaa socho'e, akkasumas iskiimaan wanta JSON qofa waan ta'eef, kuusdeetaa keessatti kuufamuu danda'a, koodii aplikeeshinii kee irraa walaba ta'ee version ta'uu danda'a, ykn osoo bobbaa hin barbaachisin karaa meeshaa keessoo gulaaluu danda'a. Hogganaan oomishaa kan ulaagaa fuula gamaaggamaa kakaasu jijjiiruu qabu osoo qaama hin tuqin sana gochuu danda'a. Sun gareewwan amala bifa yeroo baay’ee guddatuu fi yeroo hunda injinarootaan hin hoogganamneef garaagarummaa hojii hiika qabuudha. Tokkoon tokkoon Mala Yoom Fayyadamna? Seerri gaariin naaf hojjetu kunooti: unka guutummaatti haquu yaadi. Maal dhabda turte?

Yoo iskiriinii ta’e, unkaalee qaamoleetiin geggeeffaman barbaadda. Yoo loojikii daldalaa ta’e, akka ulaagaalee, seera damee, fi ulaagaalee haal-duree murtii dhugaa koodii godhan, motora iskiimaa barbaadda.

Haaluma walfakkaatuun, jijjiiramni karaa kee dhufu irra caalaa waa'ee asxaa, man'ee fi haala qindaa'ina yoo ta'e, RHF gaarii siif tajaajila. Yoo waa’ee haalawwan, bu’aa, fi seera ops ykn gareen seeraa kee Kibxata waaree booda osoo tikkeettii hin galmeessiin sirreessuu barbaachisuu danda’u ta’e, moodeelli iskiimaa SurveyJS waliin jiru caalaatti amanamummaadhaan kan walsimudha. Malli lamaan kun dhuguma wal dorgommii keessa hin jiran. Isaan gita rakkoolee adda addaa kan ilaalan yoo ta’u, dogongorri irraa fagaachuu qabus abstraction ulfaatina loojikii wajjin wal hin simnedha — sirna seeraa akka qaama tokkootti ilaaluu sababiin isaas sun meeshaa barame waan ta’eef, ykn unkaan tokko gara tarkaanfii sadiitti guddachuun dirree haal-duree waan argateef motora imaammataa bira ga’uudha. Unkaan nuti asitti ijaarre itti yaadee naannoo daangaa taa’a, walxaxaa garaagarummaa saaxiluudhaaf garuu hamma wal bira qabamee ilaalamuun rigged ta’ee itti dhaga’amutti garmalee miti. Irra caalaan unkaalee dhugaa kanneen koodii kee keessatti unwieldy ta'an tarii naannoo daangaa walfakkaataa sanaa taa'u, gaaffiin yeroo baay'ee immoo namni kamiyyuu waan isaan qabatamaan ta'an moggaasee jiraachuu isaa qofa. Unka React Hook + Zod fayyadami yeroo:

Unkaaleen CRUD irratti kan xiyyeeffataniidha; Loojikiin gadi fagoo fi UI-driven dha; Injiinarroonni amala hunda kan qaban; Backend madda dhugaa ta'ee hafa.

SurveyJS fayyadami yeroo:

Unkaaleen murtii daldalaa koodii godhu; Seerotni UI irraa walaba ta’anii guddatu; Loojikiin mul'achuu, odiitii ta'uu ykn version ta'uu qaba; Injiinarroonni hin taane amala irratti dhiibbaa geessisu; Unkaan walfakkaataan fuula duraa hedduu irratti fiiguu qaba.

You May Also Like

Enjoyed This Article?

Get weekly tips on growing your audience and monetizing your content — straight to your inbox.

No spam. Join 138,000+ creators. Unsubscribe anytime.

Create Your Free Bio Page

Join 138,000+ creators on Seemless.

Get Started Free