Question 1

Co to jest walidacja formularzy i dlaczego jest ważna?

Accepted Answer

Walidacja formularzy to proces sprawdzania poprawności danych wprowadzanych przez użytkownika przed ich wysłaniem lub przetworzeniem. Walidacja działa na dwóch poziomach: po stronie klienta (HTML5, JavaScript) — zapewnia natychmiastową informację zwrotną bez opóźnień sieciowych, oraz po stronie serwera — chroni przed złośliwymi danymi. Przy projektowaniu stron internetowych dobra walidacja zwiększa UX, zmniejsza błędy i chroni bazę danych przed nieprawidłowymi danymi.

Question 2

Czym różnią się Zod i Yup do walidacji formularzy?

Accepted Answer

Zod i Yup to dwie najpopularniejsze biblioteki do walidacji schematów w JavaScript/TypeScript. Zod jest w pełni typowany TypeScript-natywnie — schemat jest jednocześnie typem, co eliminuje duplikację kodu. Yup jest starszym rozwiązaniem, szeroko wspieranym przez Formik. Zod jest szybszy i lepiej integruje się z nowoczesnym ekosystemem (tRPC, react-hook-form). Przy tworzeniu stron internetowych z React wybór między Zod a Yup zależy głównie od używanego stosu — Formik preferuje Yup, react-hook-form doskonale współpracuje z Zod przez zodResolver.

Question 3

Jak sprawdzić poprawność numeru NIP w JavaScript?

Accepted Answer

Walidacja NIP w JavaScript wymaga algorytmu sumy kontrolnej. NIP składa się z 10 cyfr. Obliczamy sumę: (6×d1 + 5×d2 + 7×d3 + 2×d4 + 3×d5 + 4×d6 + 5×d7 + 6×d8 + 7×d9) modulo 11, gdzie d1-d9 to kolejne cyfry. Wynik musi być równy ostatniej cyfrze (d10). Jeśli reszta = 10, NIP jest nieprawidłowy. Generator walidacji automatycznie implementuje ten algorytm w wybranym formacie — HTML5 (pattern), JavaScript, React z Zod lub Yup.

Question 4

Jak walidować numer PESEL w formularzu?

Accepted Answer

PESEL to 11-cyfrowy numer zawierający datę urodzenia i cyfrę kontrolną. Walidacja PESEL: 1) Sprawdź czy składa się z 11 cyfr. 2) Oblicz sumę ważoną: 1×d1 + 3×d2 + 7×d3 + 9×d4 + 1×d5 + 3×d6 + 7×d7 + 9×d8 + 1×d9 + 3×d10 (mod 10). 3) Cyfra kontrolna d11 musi spełniać: (10 - suma mod 10) mod 10 = d11. PESEL zawiera też zakodowaną datę urodzenia i płeć — cyfra na pozycji 10 (indeks 9): parzysta = kobieta, nieparzysta = mężczyzna. Generator automatycznie tworzy funkcję walidacji PESEL ze zwracaną datą urodzenia i płcią.

Question 5

Jak zaimplementować walidację "potwierdź hasło" w React?

Accepted Answer

Walidacja "potwierdź hasło" wymaga porównania dwóch pól formularza. W React z useState: przechowuj oba pola w stanie, przy onChange pola confirmPassword sprawdzaj czy wartość === password. Przy Zod używasz .refine(): z.object({ password: z.string().min(8), confirmPassword: z.string() }).refine(data => data.password === data.confirmPassword, { message: "Hasła muszą być takie same", path: ["confirmPassword"] }). Generator walidacji automatycznie dodaje logikę dopasowania przy wybraniu opcji "Dopasuj do pola" dla dowolnego pola.

Question 6

Jakie wyrażenia regularne są potrzebne do walidacji polskich danych?

Accepted Answer

Najważniejsze wzorce regex dla polskich formularzy: telefon PL: /^(\+48)?[\s-]?\d{3}[\s-]?\d{3}[\s-]?\d{3}$/ (obsługuje formaty z +48), kod pocztowy: /^\d{2}-\d{3}$/ (format XX-XXX), NIP: /^\d{10}$/ (przed weryfikacją sumy kontrolnej), REGON: /^\d{9}(\d{5})?$/ (9 lub 14 cyfr), PESEL: /^\d{11}$/ (przed weryfikacją). Silne hasło: /^(?=.*[a-z])(?=.*[A-Z])(?=.*\d)(?=.*[@$!%*?&])[A-Za-z\d@$!%*?&]{8,}$/. Generator zawiera bibliotekę wszystkich tych wzorców jako gotowe presety do wyboru.

Generator Walidacji Formularzy

Pola formularza

Wygenerowany kod

Walidacjaformularzy—cowartowiedzieć

Walidacja dwupoziomowa

HTML5 bez JavaScript

React + Zod/Yup

Polskie dane