Zachary Anderson Website

Apr 3, 2024

Thumbnail

Project Overview

I designed and developed a website for a friend, Zachary Anderson, an emerging music producer. The aim was to create a minimalistic yet eye-catching platform that reflects who Zach is and what he hopes to achieve, while serving as a foundation to showcase his music.

Technologies Used

  • HTML

  • PHP

  • CSS

  • JavaScript

  • SQL

Key Features

  • Dynamic Frontend - Auto updating blog section with newest written articles

  • Backend code linking database and Article Writing

  • Admin Page - including sending emails, writing articles

  • Newsletter sign up

  • Social Links

Check it out

‹

Table of Content

import { useForm } from "framer"; import { useEffect } from "react"; export function FormValidator() { const { values, state, setError, setStep, submit } = useForm(); // Regex patterns const emailRegex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/; const phoneRegex = /^\+?[0-9\s\-]{7,15}$/; const validPostcodes = ["10115", "75001", "80331"]; // or fetch from JSON useEffect(() => { if (state === "submit") { const { email, telephone, PLZ } = values; if (!emailRegex.test(email)) { setError("email", "Invalid email"); setStep("error"); return; } if (!phoneRegex.test(telephone)) { setError("phone", "Invalid phone number"); setStep("error"); return; } if (!validPostcodes.includes(PLZ)) { setError("postcode", "Invalid postal code"); setStep("error"); return; } setStep("success"); submit(); // Continue to Zapier } }, [state]); return null; }