DEV Community

loading...
Cover image for I made a Twitter Clone with VueJS and Go

I made a Twitter Clone with VueJS and Go

hotpotatoc profile image Juan Christian ・1 min read

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


Logo

Twitter Clone

A Twitter clone created with Golang, PostgreSQL, Redis, VueJS and Vite with support for dark mode and light mode using TailwindCSS

Status: Some features are yet to be implemented


Preview

preview

For more check out some screenshots here

Features ✨

NOTE: Not all features from twitter are implemented because of how big Twitter is, Only the main features are implemented atm

  • Modular Architecture
  • Database migration tool using migrate
  • Golang Hot-reloading using air
  • Supports dark-mode and light-mode with TailwindCSS
  • Database seeding script using NodeJS
  • Authentication using JWT Refresh token flow and Redis for token blacklisting
  • Strongly typed Vuex store
  • List Tweets feed
  • Create Tweets with images
  • Retweets
  • Reply to Tweets or reply to another reply!
  • Like Tweets
  • Follow users
  • Images & Media uploads stored in AWS S3 Buckets
  • Up to 4 images in a single tweet with the same layout as Twitter
  • Crop profile image
  • Edit Profile Details
  • Edit Profile…

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

Discussion (33)

Collapse
chrisczopp profile image
chris-czopp

You did tremendous amount of work. What's the goal of this project, is it purely educational?

Collapse
hotpotatoc profile image
Juan Christian Author • Edited

Yes, you are correct.

This project is solely for educational purposes and also to give me the challenge to try and make something big (I also have a lot of time on my hands atm πŸ˜‚). Thank you for asking 😊

Collapse
chrisczopp profile image
chris-czopp

nice, the scope of the project is definitely big πŸ˜ƒ Obviously it's my personal opinion, if I were you I would join some open source project (maybe you already did) and used your broad skill set there. Otherwise it feels like a waste of your brain power.

Thread Thread
hotpotatoc profile image
Juan Christian Author • Edited

Haha, I'm somewhat still relatively new in the open-source world. I did dabble in on doing some small contributions though while most of them are just simple documentation updates πŸ˜‚. Thank you for the valuable input tho, I might try and join an open-source project in the future when I think I'm ready πŸ™Œ

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

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 Author • 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
michaelpeer profile image
Michael Peer

Nice work, Vue is great.

Collapse
hotpotatoc profile image
Juan Christian Author

Thank you! πŸ™Œ Vue is definitely great 😁

Collapse
rishitkhandelwal profile image
Rishit Khandelwal • Edited

Amazing! I want to make something like this on my own now πŸ˜€

Collapse
hotpotatoc profile image
Juan Christian Author

Thanks! I'm sure you can do it πŸ˜„

Collapse
gudegjawa profile image
GudegJawa

Keren ju

Collapse
hotpotatoc profile image
Juan Christian Author

Thank you! πŸ™

Collapse
avshelestov profile image
Alex Shelestov

Really nice project and cool stack!

Collapse
hotpotatoc profile image
Juan Christian Author

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 Author

Thanks 😁

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 for delivery to markets. Based in Uganda email: baguma.andrew@yahoo.com

Collapse
itltf512116 profile image
itltf512116

🀩

Collapse
supportic profile image
Supportic

Really cool tech stack. Loving it

Collapse
hotpotatoc profile image
Juan Christian Author

Thank you 😁

Collapse
ayaanraj profile image
ayaanraj

this is fabulousπŸ™πŸ™

Collapse
hotpotatoc profile image
Juan Christian Author

Thank you! ❀️

Collapse
nefomemes profile image
Collapse
hotpotatoc profile image
Collapse
ps173 profile image
Pratham Sharma

Wow go with javascript. Kinda wanted to try the stack.

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 Author

Thank you!

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

Collapse
husarcik profile image
Eddie Husarcik

What are your thoughts on Vite? Any downsides to using it? Awesome job, @hotpotatoc !!

Collapse
hotpotatoc profile image
Juan Christian Author

First of all thank you 😁

I've personally haven't found any problems on using Vite but, Vite is pretty fast and easy to setup imo.

Collapse
gyanshayari profile image
Collapse
hotpotatoc profile image
Juan Christian Author

Thank you πŸ™

Collapse
sheldonnc profile image
SheldonnC

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

Collapse
njuejohn profile image
Ole

Interesting app. Reach me for some job when free.

Collapse
deniszana profile image
deniszana

Please don't show this code to last prΓ©sident Trump ;-) ( he will hack it to make his own New twitter ) ;-)

Forem Open with the Forem app