I built a social network for developers to showcase their projects

itsnitinr

Nitin Ranganath

Posted on September 20, 2021

I built a social network for developers to showcase their projects

TL;DR: Driwwwle is an open-source social network to showcase your projects with like, comments, notifications, profiles and real-time chat.

As developers, we like to look out for new and exciting projects or products. However, finding them is not the easiest task out there. Sure, you can scroll through GitHub's trending section to find a lot of awesome products but what if it is closed source?

Things aren't so hard for designers though. They can visit a website like Dribbble or Behance and enjoy the thousands of creative designs easily. What if we had something like Dribbble, but for developers?

Introducing Driwwwle

Driwwwle is a social network for developers to showcase their projects or products with other developers across the globe. Just like any other social network out there, you can like posts, save them privately, leave a comment and follow your favorite developers to build your own personal feed.

Some of the other features include:

āš” Server-side rendering with Next.js
šŸŖ Cookie-based authorization with JSON web tokens
šŸ“œ Infinite scrolling feed with React Query
šŸ–¼ļø Cloud image upload with Cloudinary
ā¤ļø Like, save, and comment on posts
šŸ’¬ Realtime chat with Socket.io
šŸ¤ Follow developers and build personal feed

and a lot more..

Sounds interesting? I would love for you to create an account on Driwwwle and post your awesome creations.

Did I mention that Driwwwle is also open-source? You can browse through the code on this GitHub repo:

GitHub logo itsnitinr / driwwwle

The social network for developers. Discover creative websites and build a community.

Driwwwle

The Social Network for Developers












Features

āš” Server-side rendering with Next.js
šŸŖ Cookie-based authorization with JSON web tokens
šŸ“œ Infinite scrolling feed with React Query
šŸ–¼ļø Cloud image upload with Cloudinary
ā¤ļø Like, save and comment on posts
šŸ’¬ Realtime chat with Socket.io
šŸ¤ Follow developers and build personal feed
and a lot more..

Running Locally

Clone this repository and install dependencies by running:

npm install
#or
yarn install

Create a new file named config.env with the following environment variables in the root of the project folder:

PORT = 
MONGO_URI = 
JWT_SECRET = 
CLOUDINARY_CLOUD_NAME = 
CLOUDINARY_API_KEY = 
CLOUDINARY_API_SECRET = 
SENDGRID_API_KEY = 
SENDER_EMAIL = 

Create a new file named .env.local with following configuration:

NEXT_PUBLIC_BASE_URL = http://localhost:3000

For development mode, run:

npm run dev

For production mode, run:

npm run build
npm start

Visit http://localhost:3000 or your custom port environment variable to view the app.

Screenshots

Banner Image














Landing Page Search







Personal Feed
ā€¦





Some more screenshots

A picture speaks a thousand words but more importantly, I hope it excites you enough to give Driwwwle a try. Here are some screenshots, thanks to MockupBro for the awesome mockups.

Landing PageAdd New PostSearchFeedPosts & Profile page

Suggestions and feedback welcome!

Driwwwle is in its initial stages at the moment and I would highly appreciate any feedback, suggestions and questions you would like to provide. What features would you like to see? What seems unnecessary or what's causing difficulties?

Thank you for your time and I await to see your posts on Driwwwle soon. Until then, have a nice day!

šŸ’– šŸ’Ŗ šŸ™… šŸš©
itsnitinr
Nitin Ranganath

Posted on September 20, 2021

Join Our Newsletter. No Spam, Only the good stuff.

Sign up to receive the latest update from our blog.

Related