Picar - Photo sharing with friends reimagined

Overview of My Submission

Photo sharing social media with friends reimagined, combining privacy and flexibility. See photos from friends, not from advertisers or influencers.

In the modern world, everything has a "story" feature, are filled with influencers, "suggested posts", advertising...

Things needed to be simpler. Things needed to be private. Things needed to go back to the way they were. That's why Picar was built!

Only see posts from friends, and in chronological order. Only share photos to friends, not publicly or to "followers".

We used React.js for frontend, and Node.js/Express/RedisStack for the backend. More specifically, we utilized RedisJSON to store everything and RediSearch to query for it.

A lot of more detail into how this was built, architecture, and Redis usage can be found in the Backend Github Repo

Also, the frontend web app can be found in the Frontend Github Repo

Submission Category:

MEAN/MERN Mavericks - Used Redis as the primary database!

Video Explainer of My Project

Language Used

Backend: Node.js/Express/Redis-OM
Frontend: React

Link to Code

Backend

keldenl / picar-server

Picar

Photo sharing social media with friends reimagined, combining privacy and flexibility. See photos from friends, not from advertisers or influencers.

Example Ariana Grande profile page

NOTE: FRONT END CODE LIVES HERE

Overview video (Optional)

Here's a short video that explains the project and how it uses Redis:

How it works

How the data is stored:

There are several different schemas of entites that we store. They are all available in more detail at /schema/<ENTITY_HERE>.

Note: The app only supports logging in with Google.

1. User: Main user entity
   • Fields
     • sub (string): The unique idenfier for each user Google gives
     • email (string): Email of the user. Also provided by Google.
     • username (string): Username that represents the user. This is by default first name + last name's initial (provided by Google). This can be changed afterwards.
     • friendIds (string[]): String array of friends (by userId) that this…

View on GitHub

Frontend

keldenl / picar

Picar

Created by @Keldenl and @Eliza-Huang

Photo sharing social media where you share your best moments to your closest friends.

Available Scripts

In the project directory, you can run:

yarn start

Runs the app in the development mode.
Open http://localhost:3000 to view it in your browser.

The page will reload when you make changes.
You may also see any lint errors in the console.

yarn test

Launches the test runner in the interactive watch mode.
See the section about running tests for more information.

yarn deploy

Deploys the current app build to production.

View on GitHub

Additional Resources / Info

Demo with @arianagrande profile

Collaborators

@elizahuang - FE collaboration

---

• Check out Redis OM, client libraries for working with Redis as a multi-model database.
• Use RedisInsight to visualize your data in Redis.
• Sign up for a free Redis database.

Comments

[Eliza]

This is awesome! Can't wait to use it when this is deployed live :)

[Kelden Lin]

Me too! Just need to figure out how to get sessions/oauth properly set up for live :P