Inspiration

Many social media sites like Facebook hoard information about their users, sometimes promoting negative aspects like selling masses of information or having ads that match the user's preferences. Our team strove to make a extremely simple social media site that would not have: 1) upvoting/liking, as many users only post just for the likes and 2) comments to avoid negative feedback of any sort. So, we came up with DataPost.

What it does

DataPost is extremely similar to other social media sites. For now, it is still for computer/browsers with chrome, but it does have responsive styling (so it could be used on a phone with very bad feedback). DataPost allows users to upload images and text for posting, the essence of a social media site.

How I built it

DataPost is built with HTML5, CSS3, and JavaScript, as well as an external test database with firebase. I took advantage of repl.it's free hosting and porkbun.com's free design domain to create this site. I first began by creating the login page (kind of bad practice, but whatever). It was extremely difficult to implement because I had never built a login that actually worked with firebase before, so I was amazed when I got it to work. After creating a login page that could detect existing users, add and save users, prevent users from spamming the create new account button, etc. I began working on the login system. This was even harder than the signup system, as I had to retrieve data from firebase (which I have never done either). After the signup system I created the posting system. This took nearly the entire bulk of the time, ~5 hours. The posting system is composed of 5 arrays, one for the user name author, the last edited time, a title, an image, and a description.

Challenges I ran into

1) uploading images. I couldn't get around the cross origin policy, so I decided to have the user upload a couple files. i ran into an issue immediately. Firebase couldn't just take image from my local storage, so I had to create a canvas, draw the image, and get its base image url and store that in firebase instead. Yes, a huge workaround, but it works. 2) styling. I can't style worth for anything, but I'm glad it seems somewhat nice.

Accomplishments that I'm proud of

The whole thing. I have never used firebase before, and my code is extremely primitive. But it get's the job done, so that's what counts.

What I learned

I learned how to use, retrieve data from, store data in, etc. fro firebase, make use of arrays, etc. in javascript. I also learned that making a social media site is hard and I probably wouldn't do it again.

What's next for DataPost

1) detecting toxic posts (may or may not be implemented by the end of the submission); 2) video upload

Built With

Share this project:
×

Updates