Chat App

https://github.com/webdev-office-hours/chattti

Github

Store our code

NodeJS

JavaScript runtime

NPM/Yarn

Will allow us to install packages we need for our project

Name

Message

Send

Paul: 😦

Eugen: What demo?

Paul: Hey bro, ready for the demo?

App (UI)

Database

users

Messages

Message Box

Message Input box

Send Button

User Name Input Box

VueJS

App (UI)

Database

users

Messages

Message Box

Message Input box

Send Button

User Name Input Box

VueJS

TailwindCSS

We want things to look nice!

TailwindCSS

Demo

https://tailwindui.com/page-examples/detail-view-01#

Installation

https://tailwindcss.com/docs/installation/

• Install Tailwind via npm

• Add Tailwind to your CSS

  • add styles.css

• Process your CSS with Tailwind

  • Using Tailwind with PostCSS

• import "./assets/styles.css";