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
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.
-
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…
-
- Fields
Frontend
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.
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.
Top comments (2)
This is awesome! Can't wait to use it when this is deployed live :)
Me too! Just need to figure out how to get sessions/oauth properly set up for live :P