DEV Community

Cover image for Built a Slack clone with Tailwind & Alpine.js
Zack Webster
Zack Webster

Posted on

Built a Slack clone with Tailwind & Alpine.js

After the sidebar last week, I thought let's build something bigger. And so Slackish came into existence - a quick prototype build of Slack. Links to demo and source are included in this article.


So, here's a quick preview of what it looks like.
Alt Text


  • Switch between conversations
  • Channels and direct messages
  • Indicate active conversation in sidebar.
  • Display user online status indicator on title bar & sidebar for DMs.
  • Auto scroll chat on new message.
  • Custom scroll bars similar to Slack.

Demo & Code

Take this project for a spin here:
And here's the source code:

Develop Further

Feel free to fork and add to it.
Here's a few ideas:

  • Responsiveness
  • Dropdown for channels & DMs.


Tailwind and Alpine is a sweet combo to get up and running quick for setting up prototypes and more! The ecosystem is growing and there's so much more to come.

Thanks for reading.

Discussion (0)