# Clone Instagram Project

###### tags: project

## Tailwind CSS

### Why Tailwing CSS?
1. Mobile first
2. pre-existing classes(don't have to write css)

### Difference with Boostrap

They're both "Front-End Frameworks" tools.

* *Bootstrap*
Most popular **HTML, CSS, and JS framework** for developing **responsive**, **mobile first** projects on the web.

1. Preprocessors: Bootstrap ships with vanilla CSS, but its source code utilizes the two most popular CSS preprocessors, Less and Sass. Quickly get started with precompiled CSS or build on the source
2. One framework, every device: scales your websites with a single code base, from phones to tablets to desktops with CSS media queries
3. Full of features: There're dozens of documents, beautiful boostrap components on the internet

✨ **Responsiveness**

* *Tailwing CSS*
A utility-first **CSS framework** for **rapid UI development**

1. No default theme
2. No build-in UI components
3. No opinion about how your site should look

✨ **Highly customizable**

In short, Tailwind CSS is more customized, just reduces your time in writing CSS when developing JS/HTML. Boostrap can have some built-in UI components, so you don't have to build a new one, write new HTML code, just copy paste and do some modifications.

### CSS Preprocessor

A program that lets you generate CSS from the preprocessor's own unique syntax.

There're two ways to use a CSS preprocessor:
1. Install a CSS compiler on your web server
2. Use the CSS preprocessor to compile on the development environment, then upload compiled CSS file to the web server