Skip to content
A demo of how to build Airbnb's home page using Tailwind CSS
HTML JavaScript CSS
Branch: master
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
.vscode
public
.gitignore
README.md
package.json
postcss.config.js
tailwind.config.js

README.md

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

Airbnb Homepage build with Tailwind CSS

A simple starter project for playing around with Tailwind in a proper PostCSS environment. I used Airbnb as a source of inspiration to teach how to use the framework.

To get started:

  1. Clone the repository:

    git clone https://github.com/justalever/tailwind-airbnb tailwind-airbnb
    
    cd tailwind-airbnb
  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.

You can’t perform that action at this time.