Build A Slack Clone
15h 13m 30s
English
Free
Course description
In this 15-hour course, you will create your own Slack clone using advanced technologies such as Next.js, Convex, Tailwind CSS, Shadcn UI, and others. You will learn how to create a professional collaboration tool with a wide range of features.
Watch Online
0:00 0:00
| # | Lesson Title | Duration |
|---|---|---|
| 1 | Intro | 01:57 |
| 2 | Setup | 10:42 |
| 3 | Auth screens | 21:54 |
| 4 | Database setup | 11:42 |
| 5 | Github authentication | 25:07 |
| 6 | Google authentication | 09:52 |
| 7 | Password authentication | 11:44 |
| 8 | User information | 19:34 |
| 9 | Workspace creation | 52:57 |
| 10 | Toolbar component | 19:23 |
| 11 | Sidebar component | 24:22 |
| 12 | Members functionality | 15:33 |
| 13 | Workspace sidebar component | 30:12 |
| 14 | Workspace preferences | 40:49 |
| 15 | Workspace members & channels | 41:41 |
| 16 | Channel creation | 16:04 |
| 17 | Invite modal | 17:13 |
| 18 | Join workspace page | 24:08 |
| 19 | Channel page | 18:35 |
| 20 | Channel header component | 35:49 |
| 21 | Editor component | 54:42 |
| 22 | Emoji picker component | 14:12 |
| 23 | Image picker component | 08:07 |
| 24 | Editor submit functionality | 28:31 |
| 25 | Image upload functionality | 12:17 |
| 26 | Schema completion | 10:18 |
| 27 | Messages GET API | 36:00 |
| 28 | Messages list component | 49:57 |
| 29 | Channel hero component | 07:14 |
| 30 | Message toolbar component | 10:37 |
| 31 | Edit & delete message functionality | 20:59 |
| 32 | Message reactions | 22:01 |
| 33 | Infinite load | 05:42 |
| 34 | Thread functionality | 30:32 |
| 35 | Thread messages | 16:37 |
| 36 | Conversation page | 42:12 |
| 37 | Thread bar component | 13:12 |
| 38 | Member profile panel | 17:19 |
| 39 | Update & remove member functionality | 29:11 |
| 40 | Search dialog component | 13:16 |
| 41 | Layout shift fix & new emoji picker | 06:16 |
| 42 | Deployment to Vercel | 15:00 |
Comments
0 commentsWant to join the conversation?
Sign in to commentSimilar courses
Zero To Shipped. The ultimate Next.js template
Sources: Kitze
Zero To Shipped is a powerful Next.js template designed to accelerate the full cycle of web application development. It offers a ready-made infrastructure with.
Build a Jira clone
Sources: Code With Antonio
In this 16-hour course, consisting of two parts (by the way, this is my longest course!), you will learn how to create a fully functional Jira clone with a...
16 hours 26 minutes 4 seconds
Planning with Claude Code
Sources: Mckay Wrigley (takeoff)
In the workshop, participants create a simple front-end project— a landing page generator (marketing pages)- using Claude Code and Next.js. The focus is not...
47 minutes 32 seconds
Magic UI Pro
Sources: Dillion Verma
Magic UI Pro is a platform for creating modern, visually appealing landing pages with minimal effort. It offers over 50 pre-designed...