/white-lotus

Website for a fictional holiday resort built using Typescript, React, Framer Motion and Tailwind

Primary LanguageTypeScript

🌊🪷🍹 White Lotus 🍹🪷🌊

Good Job

Website for a fictional luxury resory, built using TypeScript, React, TailwindCSS and Framer-Motion.

Description

This website is built for a fictional holiday resort. Using the power of TailwindCSS and Framer-Motion, the website boasts a modern, sleek and clean design coupled with beautiful animations that enhance its allure and X-factor. The design is responsive across a wide-variety of screens, ranging from smartphones to ultra-wdie desktop monitors. For most people, a holiday resort is a getaway from the regular hum-drum of life into a state of peace and serenity. MY goal for this website was to capture and showcase a sense of that peace and serenity to visitors of the website, which they can through the calming and serene color choices representing the blue sky and oceans as well as the clean and sleek nature of the website.

Features

  • Stylish and modern design.
  • Responsive design across a multitude of screen sizes.
  • Sleek and clean animations that add pizzazz to the website.
  • Easily changable images for improved customisability.

Installation

  1. Make sure you have Node.js and npm installed on your system.
  2. Clone this repository: git clone https://github.com/DustyDogCodex/white-lotus.git
  3. Navigate to the project directory: cd white-lotus
  4. Install dependencies: npm install
  5. Start the development server: npm run dev

Customization

You can customize this website easily by changing the images in the data.ts file, or by adding your preferred images to the assets folder and importing to the component of your choice.

Acknowledgments

  • This website was created with love by Varun Malaviya.
  • Special thanks to the creators of TypeScript, React, Tailwind CSS and Framer-Motion for their amazing tools.
  • Special shoutout to the creators and cast of HBO's White Lotus for creating one of the funniest shows I've seen in my life!

Image Credits: