/tailwind-production-landing-page

A landing page inspired by a free template from Wix.com rebuilt with Tailwind CSS.

Primary LanguageHTML

https://i.imgur.com/rt4Q01S.jpg

Let's Build: With Tailwind CSS - Movie Production Landing Page

This project is the final result of creating a movie production landing page replica of a popular theme on Wix.com. It's merely an experiment to showcase what's possible with Tailwind CSS. You can watch me code it from scratch here:

https://web-crunch.com/tailwind-css-movie-production-landing-page

To get started:

  1. Clone the repository:

    git clone https://github.com/justalever/tailwind-production-landing-page

cd tailwind-production-lading-page

  2. Install the dependencies:

    # Using npm
npm install

# Using Yarn
yarn

  3. Start the development server:

    # Using npm
npm run serve

# Using Yarn
yarn run serve

    Now you should be able to see the project running at localhost:8080.

  4. Open public/index.html in your editor and start experimenting!

Building for production

Even though this isn't necessarily a starter kit for a proper project, we've included an example of setting up both Purgecss and cssnano to optimize your CSS for production.

To build an optimized version of your CSS, simply run:

# Using npm
npm run production

# Using Yarn
yarn run production

After that's done, check out ./public/build/tailwind.css to see the optimized output.