feedPost on DO
Tags: dohackathon
Published: 2021-01-09 21:04:08

#**feedPost**
## An app to share your published posts or create a new one.

###  Program for the People


### https://feedpost-3scp3.ondigitalocean.app/ 

###**Features**

*Get badges on your feed-ins based on the type of post you feed in*

####Shared Post
*Get a Shared Post badge*
### ![feedpost1](https://dev-to-uploads.s3.amazonaws.com/i/rrgnxkol7ie864hhe5gq.png)


 
####Author Post
*Get an Author badge*
###![feedpostauthor](https://dev-to-uploads.s3.amazonaws.com/i/7doodoyzazxytppjp8o5.png)
 
 
####Lovebytes
*If you are the first person to love the post*
###![feedpost2](https://dev-to-uploads.s3.amazonaws.com/i/btwtfwc4exblbgjykowq.png)
 
 
#### SearchBar
*Finding posts or the feeders is now just a tap away*
### ![feedpost7](https://dev-to-uploads.s3.amazonaws.com/i/n0rqnpwi9q6fw9ctlk2c.png)
 
#### Refresh Button
*Although it was fairly simple to get realtime feeds on the service, but still kept it the classic way. This is one of the most addictive buttons on the app*

### ![feedpost6](https://dev-to-uploads.s3.amazonaws.com/i/6dkdakof0ge6i2qx0k7p.png)
 

#### Login Card
*It looks so cool its tough to choose whether to actually login or just stare at it for a few more seconds*
### ![fplogin](https://dev-to-uploads.s3.amazonaws.com/i/o1wph960z9jhidrrgqfm.png)
 
#### Blurred Glass Effect aka Glassmorphism
*Using Glassmorphism at a few places were one of the best design decisions, and the very first place to look at it is in the header*
### ![fpblur](https://dev-to-uploads.s3.amazonaws.com/i/rdgxovnomwtntsx8gcu3.png)
 

### Description
 
feedPost allows its users(feeders) to create a new post, or share a previously published post. I know feedpost is no different than many other available services, but the main difference lies in it's simplistic approach towards user experiences. People only get to see what they should(feeds).

###![feedpostdash](https://dev-to-uploads.s3.amazonaws.com/i/5s23vi2pc8i2dw3f0p3i.png)
 
#####*What makes this app stand out from other similar services?*
Neither simplistic designs guarantees a better user experience nor a better color scheme. Instead what works for a better user experience is understanding, what a user thinks when he first come across the app. 
The very first question which comes up in his mind is ... 
#####*What is this app?*
It is very important to give this answer to the user. 
*And from that point the questions and answers starts to move in a direction you want*

#*feedPost is designed, developed and structured for better user experience* 

There are a few features which I am thinking of implementing in the app PWA(Progressive Web Apps) is definitely one of them.
 

### Link to Source Code
https://github.com/rvfreelance/feedpost.git

### MIT


## Background
This app is one of my dream apps, so when I got to know about the hackathon I wanted to do this. I wanted to create a place where people can do some productive work, or a place where they can learn from and many more such things. Nor that there is not any such place but because I had a dream, and I wanted to do that. And the hackathon came at a very good time. I managed to take out the time to build the app.

### How I built it 
I had never tried to host any real world app on any platform, which has its database, authentication and storage. So it was actually my first time publishing the app. I actually tried this 2-3 times by destroying the app and then recreating because the process of deployment was so simple, you just need to select your github repo, and then a few more clicks and your app just goes live. And the best feature for me was its auto-deploy.
I was thinking of building a static app, which gets dynamically updated after a few api calls, kind of jamstack web apps. So I started building the app, and in less than a month of developing the app, I can definitely say static sites can not only just look good but also can allow us to write better apps & think more about user experiences.

### Additional Resources/Info
I have used Firebase Authentication, Cloud Firestore in this project. And used create-react-app for building react components.