DEV Community

Cover image for Socio, be social without wasting time.
Saroj regmi
Saroj regmi

Posted on

Socio, be social without wasting time.

What I built

Socio

Category Submission:

Most visually pleasing, and best overall application.

App Link

https://socio-rho.vercel.app/

Screenshots

Initial animation screen:

Social media icons

Landing page:

Landing page

Description

socio is a web application, that let's you connect your facebook, twitter, instagram and other various social media application and helps you manage them by providing user specific notification, one tap information sync, Post stats, and most importantly ability to schedule post. So, you never miss a family members birthday and can plan to post ahead of time.
It has a lot of features which lets you manage your social without visiting the social media, which prevents you from being distracted. And let's you manage your socials with in seconds.

Link to Source Code

github

Permissive License

MIT license is used.

Background (What made you decide to build this particular app? What inspired you?)

So, the main inspiration of this project is my behavior and habit. Let me explain in detail, every time I sit to do work, I crave social media and pick up my devices to see if there are any useful notifications or messages that I need to respond. If there are any then it is fine I respond to those messages and notifications and get lost in the endless scrolling of those medias, if not I start to use that social media putting my work in side. This is the main way I usually procrastinate and as a result I never fulfill the things that I am capable of fulfilling.
And another main reason behind it is :
I had one friend of mine who was a social media influencer, with more than 1M + followers. And the thing with being a social media influencer is that you get a lot of notification and messages from both fans, friends and social media. Let's think practically here there is no way you can respond to even 500 notifications let alone 50K+ notifications that some people receive over dozens of social media they use. And you can technically respond to the notifications and messages at the top that way you are certain to miss your close friends and families. I am telling this from my experience asking notes ๐Ÿ˜…
So, these are the events that inspired me to build this project.

How I built it (How did you utilize refine? Did you learn something new along the way? Pick up a new skill?)

Refine is like a backbone of this project, it is the one that controls the data flow route flow and all the other things, along with state management, auth flow. It made my task easier. I know it was hard at first to get started although they do have a pretty good documentation and starter guide. I had to read a lot of documentation to get things done in the correct way.
I have used material UI as the UI system but more than that I have used custom designs and styles, I have used Figma to make the basic design. So for the UI it goes like this...
Dribbble -> inspirition -> rough sketch -> figma basic markup -> code.
And I have used supabase For the backend and authentication.
I cannot explain how easy it was to setup the authentication, and all the back end stuff.
And I am very happy to see that All these things can be easily handled with refine they provide integration with a lot of Front end, back end, and data providing services.

I am not buttering refine in the hopes of getting + points, but I genuinely saying these things, see I even contributed to the documentation while reading the documentation, which will be present in the next release, here is it if you are interested. click me.

Talking about my learning's I learnt a lot of things it was my first time using refine, I once, won there random giveaway so I know about them they sent me some cool swags which I appreciate to this day.Anyways it was fun I learnt the basics of typescript and got introduced to supabase.
It was my web project after a while so, I learnt how to make cool animations in web, see the site to see if you think it's cool or not. All the credentials and setup guides for true test of the project are provided in the github and the site itself.

Additional Resources/Info

As of submitting this project this project is partially complete so is the description such as screenshots so, I highly recommend you visiting the site to see the full features, and to open issues on the project where ever you see a bug.

Till next time Kudos.

Top comments (0)