โ† Back to Projects

Construction Co

Livebusiness

A professional construction company website with an animated project gallery, service breakdown, scroll-triggered AOS animations, and a Resend-powered contact form.

๐ŸŒ Live Site๐Ÿ“ GitHub RepoBy Kyle Parsotan ยท 2025

Problem

Construction firms need a credible, visually rich online presence to win client trust and showcase completed work. Heavy image sites often suffer from poor performance and zero interactivity.

Solution

Built a performant Next.js site with server-side image optimization via next/image. AOS (Animate On Scroll) and Framer Motion add visual depth without sacrificing performance. The project gallery uses a responsive CSS Grid. Resend delivers contact form submissions to the business email.

Tech Stack

Frontend
Next.jsTailwindCSSFramer MotionAOSFlexbox
Backend
Resend (email)
DevOps
Vercel

Architecture

Frontend

Next.js App Router with next/image for optimized lazy-loaded project photos. AOS library adds scroll-triggered fade/slide-up animations on service cards and gallery items, initialized in a client component useEffect. Framer Motion handles hero section entrance animations. CSS Grid lays out the project gallery in a masonry-like responsive grid. TailwindCSS drives all spacing and responsive breakpoints.

Backend

Next.js API Route (/api/contact) validates the form and sends a formatted email via Resend. No persistent data storage.

Database

None.

Features

Future Improvements

By Kyle Parsotan ยท 2025
Available for Projects

Ready to Get to Work?

Let's transform your ideas into reality. Whether you need a website, web app, or consulting โ€” I'm here to help you succeed.

Fast Delivery
Scalable Solutions
Clean Code

Trusted by clients worldwide delivering results on time and within budget.

Captcha: 5 + 7 = ?