You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
{{ message }}
This repository was archived by the owner on Apr 28, 2022. It is now read-only.
Copy file name to clipboardExpand all lines: README.md
+56-1Lines changed: 56 additions & 1 deletion
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -2,8 +2,39 @@
2
2
3
3
> A Chrome extension that filters through Facebook Dev Circles around the world to get only the interesting posts in your feed.
4
4
5
+
## Vision
6
+
7
+
Instead of having dev circles according to locations, we can now have posts from various dev circles based on our interests.
8
+
9
+
## What is it?
10
+
11
+
It is a Google Chrome extension that replaces the feed of your Facebook Dev Circle group according to your interests.
12
+
13
+
## What does it do?
14
+
15
+
You put some keywords of your interest, say javascript, node.js, in the options of extension and when you run the extension on a Facebook group page (say your local Dev Circle), you get posts from various public dev circle groups which match your keywords, right into your feed.
16
+
17
+
So instead of having dev circles by region, you now have dev circles by your interests!
18
+
19
+
It has some pre-defined tags that help you add your keywords easily. You also have the option to blacklist certain groups, if you don't want to see posts from them (maybe due to language differences).
20
+
21
+
It uses the graph API to fetch feeds from various dev circle groups.
22
+
5
23
## [Download the extension (.crx)](https://github.com/sidvishnoi/fb-dev-interest/releases/download/v1.2/Merge.Facebook.Dev.Circles.by.Interests.crx)
6
24
25
+
26
+
# Screenshots
27
+
28
+
[](https://i.imgur.com/4zV6eHj.png)
29
+
*Showing posts from various public Facebook Dev Circle groups (based on keywords - `node.js, react`) in a Facebook Dev Circle group*
30
+
31
+
[](https://i.imgur.com/PnJvc6I.png)
32
+
*Options Page for extension, showing addition of keywords of user's interest*
33
+
34
+
[](https://i.imgur.com/Ttzscqy.png)
35
+
*Comments on a post can also be viewed in the custom feed*
36
+
37
+
7
38
# How to Install
8
39
9
40
([Video - How to Install and configure](https://www.youtube.com/watch?v=A-LR6KWdAsM))
@@ -25,13 +56,37 @@ The App Token is needed to authenticate Facebook's Graph API requests.
25
56
26
57
Add the keywords that interest you in this field to filter posts. Type a keyword and press Enter to add it. Click a keyword to remove it. We've added some keywords as suggestions. You can contribute by adding more keywords :)
27
58
59
+
If you leave this field blank, you'll get all posts from all public dev circle groups.
60
+
28
61
### Highlight Keyword Matches
29
62
30
63
Enable to highlight matched keywords in posts, otherwise disable.
31
64
32
65
### Blacklist Groups
33
66
34
-
Add a group's name (and make use to auto-complete) to blacklist it (avoid showing posts from that group in your feed). You might want to blacklist a group as you might not be interested in their posts or not able to understand their language.
67
+
Add a group's name (and make use to auto-complete) to blacklist it (avoid showing posts from that group in your feed). You might want to blacklist a group as you might not be interested in their posts (no hate!) or not able to understand their language.
68
+
69
+
# How we built it?
70
+
71
+
The extension uses the **Graph API** to fetch feeds from various dev circle groups. The posts shown in feed have same CSS classes as of regular posts in feed. We did this to make the feed look as natural as possible.
72
+
73
+
The options page is written using the **React** framework. Used react components can be seen in GitHub repo.
74
+
75
+
## Challenges we ran into
76
+
77
+
1. Never built a Chrome extension before.
78
+
2. Never used Graph API, React before.
79
+
3. Finding the correct classes and minimal html for rendering posts in feed was quite a challenge.
80
+
4.@sidvishnoi (the coder) was sick during development process.
81
+
5. The other teammate (the one with original idea) was busy with out of station work.
82
+
83
+
# Proud moments
84
+
85
+
Making the posts and comments look similar to the ones shown in felt pretty cool. It seemed like I have finally built something.
86
+
87
+
@sidvishnoi learnt react and webpack in one day and made the options page (not a lot, but enough to make it work).
88
+
89
+
Creating a Chrome extension was also a fun thing to have done.
0 commit comments