Skip to content

VasilGVasilev/tilia

Repository files navigation

Static Site Tilia with Next.js 13: React, Tailwind, Framer Motion

This is a Next.js Static Site Generation freelance project developed via Tailwind, React and Framer Motion. It promotes the sales of aparments.

alt text


alt text

What's in the stack

The website has mobile responsiveness, animations for a more seamless UX and its main feature is the utilization of polygon shapes to mark the status of the apartments - available, reserved, sold.

Features:

  • Full responsiveness
  • Animations

Learning achievements:

  • Creating my own Python meta program to crop apartments out of floor plans based on the polygon coordinates I gathered for on hover availability status reveal for each apartment
  • Deep dive into Framer Motion
  • Understanding the difference between flex and grid
  • Improved abstraction of components in relation to Ixora

Performance, Accessibility, Best Practices, SEO:

alt text

Other dependencies:

  • react-icons
  • cv2
  • numpy

Main drawback

Tailwind does not go well with conditional rendering. Explicitly, making a Link Wrapper is impossible, since Next.js does not disable conditionally Link, too. But on Link Wrapper - it does not render well if I have to feed the html attributes such as href, className dynamic data depending on whether it will be a clickable Link or a non-clickable div. So, when an appartment is sold, I will have to manually change Link to div, since I cannot disable link's clickability of Link by Next.js.

About

A freelance project for selling of apartments

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published