DEV Community

Cover image for I made a Twitter Clone with VueJS and Go
Juan Christian
Juan Christian

Posted on

I made a Twitter Clone with VueJS and Go

Hello DEV community! πŸ‘‹

I've recently attempted to make a clone of Twitter using VueJS as its frontend and Golang as its backend server.

twitter clone profile

twitter clone status

You can check the github repository here for the source code:

GitHub logo HotPotatoC / twitter-clone

πŸ•Š Twitter Clone developed using Go + Vue 3 + Vite + TailwindCSS + PostgreSQL + Redis

Twitter Clone

An attempt to recreate one of the largest social networking application Twitter.

Note: This is my first attempt at developing a distributed system, so any feedback would be greatly appreciated.

Services

  1. Edge Service (GraphQL)
  2. Media Service
  3. Notifications Service
  4. Search Service
  5. Timeline Service
  6. Tweet Service
  7. Web UI Service

Technologies Used

  1. Golang (Internal Services)
  2. Next.JS (Website UI)
  3. Kafka (Pub/Sub)
  4. Apache Spark (Analytics)
  5. PostgreSQL (Main Database)
  6. PgPool II (Database Load Balancer)
  7. Redis (Caching)
  8. Docker (Containerization)
  9. Nginx (Load Balancer)
  10. GraphQL (Edge Server / Frontend for Backend)
  11. ElasticSearch (Searching & Indexing)
  12. Firebase Cloud Messenger (Notification Service)

System Design

Functional Requirements

  1. Create Tweets (text, images, videos, etc)
  2. View Timeline
  3. Like tweets
  4. Retweet / Quote Retweet
  5. Follow others

Non-Functional Requirements

  1. Scalable & Efficient
  2. High Availability

Optional Requirements

  1. Metrics and analytics
  2. Notifications
  3. Observability & Monitoring (Prometheus, Grafana, Jaeger, etc)

Database Schema

How to run locally

Check here on how to run locally




Please note that some features are yet to be implemented and i would love to hear your feedback!

Latest comments (35)

Collapse
 
sheldonnc profile image
SheldonnC

Cool!!Could you suggest me some courses to learn web dev.

Collapse
 
hotpotatoc profile image
Juan Christian

Thank you πŸ™

Collapse
 
anndreyy profile image
Anndrey Francys

Great job. In addition to the project itself, I found the vue's folder and file structure very interesting. Is it your own organization or is it based on something?

Collapse
 
hotpotatoc profile image
Juan Christian

Thank you!

The architecture of the project is mainly based on golang-standards/project-layout and many other Golang / Vue projects.

Collapse
 
ashelestov profile image
Aleks Shelestov

Really nice project and cool stack!

Collapse
 
hotpotatoc profile image
Juan Christian

Thanks 😁

Collapse
 
lautarojayat profile image
Lautaro Jayat

Holly Molly!

Collapse
 
bastiendmt profile image
Bastien Dumont

Gear job ! The code looks clean.
I will most definitely check it in depth if I ever have to work with Vue !

Collapse
 
hotpotatoc profile image
Juan Christian

Thanks 😁

Collapse
 
yoursunny profile image
Junxiao Shi

I guess there's some sort of coding school teaching people how to make clones…

The most important part of Twitter isn't the website - many users never use it.
It's the API and the mobile apps, and your implementation doesn't have them.
Moreover, your implementation likely can't handle millions of tweets posted every hour - it takes a distributed system to get to that scale.

Keep innovating and you can build a better system than today's Twitter.

Collapse
 
hotpotatoc profile image
Juan Christian • Edited

Yes, I completely agree with you. I am aware of the sheer size of Twitter and how they can handle an immense amount of users and millions of tweets. This implementation does not compare to how Twitter implements its systems and because it is only experimental and for educational purposes only.

I haven't really gotten deep into scalable applications or fault-tolerant distributed systems but
this project and I have still a lot of room for improvements and ways to go.

Thank you for the valuable insight!

Collapse
 
njuejohn profile image
Ole

Interesting app. Reach me for some job when free.

Collapse
 
bagumaandrew profile image
baguma-andrew

i would also love to learn to put pieces together to come up with an app. I have been reading beginner tutorials for python and javascript with no real life examples. I want to develop a ride sharing app that aggregates produce for smallholder farmers in uganda for delivery to markets. email: baguma.andrew@yahoo.com

Some comments may only be visible to logged-in visitors. Sign in to view all comments.