hoppula/refire-forum

Serverless discussion forum built with React, Redux and Firebase

refire-forum

Serverless discussion forum built with React, Redux and Firebase using refire and refire-app.

Base UI components are from excellent Elemental UI.

Live demo

https://refire.firebaseapp.com

Features

• Categories, boards and threads
• Paging for boards and threads
• Quoting when replying to posts
• Thread and Post previews
• Markdown support
• Emoji support using :emoji: syntax 🔥
• User profile pages
• Login with Google, Facebook, Github & Twitter accounts
• Admin tools (delete threads & single posts, lock/unlock threads)
• CSS-in-JS styled components, fully themeable
• Dark & light color themes
• Upvoting single posts
• Users can edit their own posts

Roadmap

• Allowing boards and threads to be bookmarked properly
• Search using redux-search
• Image attachment upload to Firebase
• Allowing users to edit their own thread titles
• Single post linking
• Show list of available emojis
• Sticky threads
• Thread and post tagging
• Notifications
• Reactions to posts with emojis
• Improved admin section
• Moderating
• User editable theme

Deploying your own instance

1. Create your new app in Firebase dashboard

2. Copy and paste apiKey from your Firebase app console's Overview > Add Firebase to your web app to src/config.js

3. Enable Sign-in providers you want to use in your Firebase app console's Authentication > Sign-in method settings

4. Change projects.default value to your app name in .firebaserc

5. Run npm install and npm run build

6. Run npm run login to login to Firebase

7. Run npm run bootstrap to copy the initial data structure to Firebase

8. Run npm run deploy to deploy the app and security rules to Firebase

Running locally

npm start will start the development server on localhost:4000

Adding admin users

Create adminUsers path in your Firebase and set your admin user's uid as key and true as value:

"adminUsers": {
  "google:123456789": true
}

Customizing settings

You can edit default paging settings by changing settings/BOARD_PAGE_SIZE, settings/THREAD_PAGE_SIZE and settings/THREAD_PAGE_LIMIT.

You can configure date format by changing settings/DATE_FORMAT.

Custom forum name

Export siteName in ./src/config.js.

export const siteName = "My forum"

Security rules

Firebase security rules are defined in security-rules.bolt.

Use npm run build:rules to generate security-rules.json after making changes.

Use npm run deploy:rules to deploy security rules.

License

MIT

refire-forum's Issues

stuck at firebase login/bootstrap

Hey im Just going through the steps to deploy.
ive set up my FB app and set the name etc.

once I get to step 4: 'npm run login'
I get these errors:

>firebase login
sh: firebase: command not found

I tried 'npm install firebase --save' , but to no avail....
Probably something I am forgetting ?
Thanks!

email and password login

On my project I am only using email and password login. This is for my app that I am building. I want to have a web forum, that won't be available in the mobile app, just from the web. That's where this comes in, however, I am not using google, facebook, or any other login system, I am using the standard email and password login with firebase. I would like my users to be able to login to the web app the exact same as if they logged in to the mobile app, but I can't find where to enable the email and password login with refire. The only options I see are the provider logins. Is there any possible way to allow users to login with email and password and not have to use one of the providers?

Set database path from config

Hi there,

Great project, solid and feature-complete. My only problem is that I can not set the firebase database path. I want forum to be in a /forum node rather than being at the root (/).

Is it possible to do something like this?

Issues Deploying

I am running into an issue wherein running "npm run deploy" creates error 410 exclaiming that my firebase CLI must be out of date.

It is not.

I have fully updated the firebase-tools and node, as well as trying version 5.1.1 like some users have suggested. "Firebase deploy --only" commands are depricated so I am only running the base "firebase deploy". I have deleted and reinstalled the modules as well.

Forgive me for how I've written this. I've been hacking at it for a few days now and haven't gotten it working on the deployed version yet. It works perfectly on the localhost, however.

Any advice or leads to chase down would be most appreciated.

Below is the error in question

=== Deploying to 'necroreact'...

i deploying database, hosting
i database: checking rules syntax...

• database: rules syntax for database necroreact is valid
  i hosting: preparing dist directory for upload...

Error: HTTP Error: 410, This version of the Firebase CLI is no longer able to deploy to Firebase Hosting. Please upgrade to a newer version (>= 4.1.0). If you have further questions, please reach out to Firebase support.
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! [email protected] deploy: firebase deploy
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the [email protected] deploy script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR! C:\Users\tobro\AppData\Roaming\npm-cache_logs\2019-02-02T01_50_34_962Z-debug.log

SSR + Next.js?

Hey!
I'm trying to figure out how to get bindings to play with Next.js and SSR. Any idea if it is possible to get refire-app synced with next-redux-wrapper and the redux store?

Thanks!

firebase issue

Hi,

When I am placing my own firebase API and project name, the site does not work. It just constantly loads in a loop.

What am I doing wrong?

Suggestion : Custom Auth Service

Would it be possible to use other Authentication service for this instead just FireBase?

Note : I haven't tried to build this on my machine yet, I just checked the demo and was wondering if it would be possible for my use case (e.g. AWS Amplify -> Cognito)

Command: npm run build error

Hi!
I am trying to build this program for the first time. Nice work!
Whenever I try to run the command 'npm run build' I get the following error:

Version: webpack 1.15.0
Time: 453ms
Asset Size Chunks Chunk Names
bundle.js 3.08 kB 0 [emitted] main
bundle.js.map 4.33 kB 0 [emitted] main
[0] multi main 28 bytes {0} [built]
+ 1 hidden modules

ERROR in bundle.js from UglifyJs
SyntaxError: Unexpected token: name (refireApp) [./src/index.js:1,7]

[email protected] build:rules /root/Documents/firebvase
firebase-bolt security-rules.bolt

bolt: Generating security-rules.json...

[email protected] html /root/Documents/firebvase
cp index.html dist/index.html

Looks like it's something to do with the app name. I have already renamed the app ID that matched with my firebase ID in file config.js.

NPM Install error

Hey there,

I was looking to use this for a forum I am setting up and I am running into and issue with the npm install. It Seems to be running into some issues using 'latest' during the install, and ultimately ends with "npm ERR! not ok code 0". Let me know if you find any solutions.

Here are all the errors I get during the install, including the previous and subsequent successful lines:
........................................................................................................
npm http 200 https://registry.npmjs.org/iconv-lite/0.4.19
npm ERR! TypeError: Cannot read property 'latest' of undefined
npm ERR! at next (/usr/share/npm/lib/cache.js:687:35)
npm ERR! at /usr/share/npm/lib/cache.js:675:5
npm ERR! at saved (/usr/share/npm/node_modules/npm-registry-client/lib/get.js:142:7)
npm ERR! at /usr/lib/nodejs/graceful-fs/polyfills.js:133:7
npm ERR! at Object.oncomplete (fs.js:107:15)
npm ERR! If you need help, you may report this log at:
npm ERR! http://github.com/isaacs/npm/issues
npm ERR! or email it to:
npm ERR! [email protected]
npm ERR! System Linux 3.13.0-48-generic
npm ERR! command "/usr/bin/nodejs" "/usr/bin/npm" "install"
npm ERR! cwd /var/www/html/forum
npm ERR! node -v v0.10.25
npm ERR! npm -v 1.3.10
npm ERR! type non_object_property_load
npm http 200 https://registry.npmjs.org/raw-body/2.3.2
........................................................................................................
npm http 404 https://registry.npmjs.org/types/react
npm ERR! TypeError: Cannot read property 'latest' of undefined
npm ERR! at next (/usr/share/npm/lib/cache.js:687:35)
npm ERR! at /usr/share/npm/lib/cache.js:675:5
npm ERR! at saved (/usr/share/npm/node_modules/npm-registry-client/lib/get.js:142:7)
npm ERR! at /usr/lib/nodejs/graceful-fs/polyfills.js:133:7
npm ERR! at Object.oncomplete (fs.js:107:15)
npm ERR! If you need help, you may report this log at:
npm ERR! http://github.com/isaacs/npm/issues
npm ERR! or email it to:
npm ERR! [email protected]
npm ERR! System Linux 3.13.0-48-generic
npm ERR! command "/usr/bin/nodejs" "/usr/bin/npm" "install"
npm ERR! cwd /var/www/html/forum
npm ERR! node -v v0.10.25
npm ERR! npm -v 1.3.10
npm ERR! type non_object_property_load
npm ERR! TypeError: Cannot read property 'latest' of undefined
npm ERR! at next (/usr/share/npm/lib/cache.js:687:35)
npm ERR! at /usr/share/npm/lib/cache.js:675:5
npm ERR! at saved (/usr/share/npm/node_modules/npm-registry-client/lib/get.js:142:7)
npm ERR! at /usr/lib/nodejs/graceful-fs/polyfills.js:133:7
npm ERR! at Object.oncomplete (fs.js:107:15)
npm ERR! If you need help, you may report this log at:
npm ERR! http://github.com/isaacs/npm/issues
npm ERR! or email it to:
npm ERR! [email protected]
npm ERR! System Linux 3.13.0-48-generic
npm ERR! command "/usr/bin/nodejs" "/usr/bin/npm" "install"
npm ERR! cwd /var/www/html/forum
npm ERR! node -v v0.10.25
npm ERR! npm -v 1.3.10
npm ERR! type non_object_property_load
npm http GET https://registry.npmjs.org/is-callable
........................................................................................................
npm http 200 https://registry.npmjs.org/source-map-support
npm ERR! TypeError: Cannot read property 'latest' of undefined
npm ERR! at next (/usr/share/npm/lib/cache.js:687:35)
npm ERR! at /usr/share/npm/lib/cache.js:675:5
npm ERR! at saved (/usr/share/npm/node_modules/npm-registry-client/lib/get.js:142:7)
npm ERR! at /usr/lib/nodejs/graceful-fs/polyfills.js:133:7
npm ERR! at Object.oncomplete (fs.js:107:15)
npm ERR! If you need help, you may report this log at:
npm ERR! http://github.com/isaacs/npm/issues
npm ERR! or email it to:
npm ERR! [email protected]
npm ERR! System Linux 3.13.0-48-generic
npm ERR! command "/usr/bin/nodejs" "/usr/bin/npm" "install"
npm ERR! cwd /var/www/html/forum
npm ERR! node -v v0.10.25
npm ERR! npm -v 1.3.10
npm ERR! type non_object_property_load
npm http 200 https://registry.npmjs.org/home-or-tmp
........................................................................................................
npm http 200 https://registry.npmjs.org/levn
npm ERR! TypeError: Cannot read property 'latest' of undefined
npm ERR! at next (/usr/share/npm/lib/cache.js:687:35)
npm ERR! at /usr/share/npm/lib/cache.js:675:5
npm ERR! at saved (/usr/share/npm/node_modules/npm-registry-client/lib/get.js:142:7)
npm ERR! at /usr/lib/nodejs/graceful-fs/polyfills.js:133:7
npm ERR! at Object.oncomplete (fs.js:107:15)
npm ERR! If you need help, you may report this log at:
npm ERR! http://github.com/isaacs/npm/issues
npm ERR! or email it to:
npm ERR! [email protected]
npm ERR! System Linux 3.13.0-48-generic
npm ERR! command "/usr/bin/nodejs" "/usr/bin/npm" "install"
npm ERR! cwd /var/www/html/forum
npm ERR! node -v v0.10.25
npm ERR! npm -v 1.3.10
npm ERR! type non_object_property_load
npm http 200 https://registry.npmjs.org/imurmurhash/-/imurmurhash-0.1.4.tgz
........................................................................................................
npm http GET https://registry.npmjs.org/strip-json-comments/-/strip-json-comments-2.0.1.tgz
npm ERR! TypeError: Cannot read property 'latest' of undefined
npm ERR! at next (/usr/share/npm/lib/cache.js:687:35)
npm ERR! at /usr/share/npm/lib/cache.js:675:5
npm ERR! at saved (/usr/share/npm/node_modules/npm-registry-client/lib/get.js:142:7)
npm ERR! at /usr/lib/nodejs/graceful-fs/polyfills.js:133:7
npm ERR! at Object.oncomplete (fs.js:107:15)
npm ERR! If you need help, you may report this log at:
npm ERR! http://github.com/isaacs/npm/issues
npm ERR! or email it to:
npm ERR! [email protected]
npm ERR! System Linux 3.13.0-48-generic
npm ERR! command "/usr/bin/nodejs" "/usr/bin/npm" "install"
npm ERR! cwd /var/www/html/forum
npm ERR! node -v v0.10.25
npm ERR! npm -v 1.3.10
npm ERR! type non_object_property_load
npm http 304 https://registry.npmjs.org/inquirer
........................................................................................................
npm http 200 https://registry.npmjs.org/url
npm ERR! TypeError: Cannot read property 'latest' of undefined
npm ERR! at next (/usr/share/npm/lib/cache.js:687:35)
npm ERR! at /usr/share/npm/lib/cache.js:675:5
npm ERR! at saved (/usr/share/npm/node_modules/npm-registry-client/lib/get.js:142:7)
npm ERR! at /usr/lib/nodejs/graceful-fs/polyfills.js:133:7
npm ERR! at Object.oncomplete (fs.js:107:15)
npm ERR! If you need help, you may report this log at:
npm ERR! http://github.com/isaacs/npm/issues
npm ERR! or email it to:
npm ERR! [email protected]
npm ERR! System Linux 3.13.0-48-generic
npm ERR! command "/usr/bin/nodejs" "/usr/bin/npm" "install"
npm ERR! cwd /var/www/html/forum
npm ERR! node -v v0.10.25
npm ERR! npm -v 1.3.10
npm ERR! type non_object_property_load
npm http 200 https://registry.npmjs.org/is-callable/-/is-callable-1.1.3.tgz
........................................................................................................
npm ERR!
npm ERR! Additional logging details can be found in:
npm ERR! /var/www/html/forum/npm-debug.log
npm ERR! not ok code 0

Dont have admin features

My bootstrap.json

"adminUsers": {
    "google:10912870198101xxx6012": true
  },
...

and I issued,
npm run bootstrap.
But I dont get admin features when logged in.

Size of project with node modules is too high

Is there a way to omit some node modules because the project size is about 200MB after loading all required node modules.

Need help with using elemental for my app

Hi,

Thanks for the amazing project! It encouraged me to use elemental for my project.
However, I have been facing a couple of issues with it which I haven't encountered in refire.

I have described my concern in brief at elementalui/elemental#162.

I also referred the source for refire and refire-app as well but couldn't gather how to solve my issues.
Not sure if this is the best place to ask. Would be glad to receive any help that I can.

Thanks!

[Feature Request] 404 redirects

If we go to page that not exists like https://refire.firebaseapp.com/invalid gives blank page. Can you please add a redirect.

Admin user added but not showing when logged in

I've followed your instructions about adding a user's UID in the 'userAdmin' object in bootstrap.json, and it's appearing in the Firebase database I set up, but when I log in as that user into my instance of the database, I'm not seeing any of the admin features. Am I missing something obvious?

Material-UI instead of Elemental-UI

Is it be possible to use material-ui in refireApp?
It seems that refire-app cannot process material-ui components such as icons or buttons.
When I executed refireApp with material-ui components, the page showed nothing without any error messages.

npm run build failed (both CMD and POWERSHELL)

Here is the cmd-prompt output: (I can provide the entire run and the logfile, if needed)

K:\GitHub\refire-forum>npm run build

[email protected] build K:\GitHub\refire-forum
npm run clean && npm run build:webpack && npm run build:rules && npm run html

[email protected] clean K:\GitHub\refire-forum
rimraf dist

[email protected] build:webpack K:\GitHub\refire-forum
NODE_ENV=production webpack --config webpack.config.prod.js

'NODE_ENV' is not recognized as an internal or external command,
operable program or batch file.
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! [email protected] build:webpack: NODE_ENV=production webpack --config webpack.config.prod.js
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the [email protected] build:webpack script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR! C:\Users\europ\AppData\Roaming\npm-cache_logs\2019-11-25T17_58_06_520Z-debug.log
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! [email protected] build: npm run clean && npm run build:webpack && npm run build:rules && npm run html
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the [email protected] build script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR! C:\Users\europ\AppData\Roaming\npm-cache_logs\2019-11-25T17_58_06_571Z-debug.log

K:\GitHub\refire-forum>

How can it be hosted in Firebase Host?

Hi

I have tried to run the forum in Firebase's hosting but was not able to. I am missing something?

Steps:

• Added apiKey and projectId on src/config.js
• Ran npm run build
• ran npm run deploy

A white screen only showed up.

I have than tried running the firebase init where I set my public folder to be the dist folder. Followed the same previous steps. Now the loading icon shows up but that is all.

Any ideas? Maybe a how to deploy on the readme.md could be a good thing.

firebase connection issue

Hey I'm not able connect with my firebase account.

Even after changing the project id and api key and following your documented steps.

error:- firebase error: Please ensure that you spelled the name of your app correctly

Why html is not working

Why html is not rendering in the forum?

Further development

Can any one do further developement with the aid of donation?

ERROR in ./~/react-tap-event-plugin/src/TapEventPlugin.js

I'm having some problems to build the retire-forum.
What happened? How to install correctly the react-tap-event-plugin?
(npm run build output)

NODE_ENV=production webpack --config webpack.config.prod.js
Hash: 6d68d5ea0294983a8c7c Version: webpack 1.14.0 Time: 29762ms Asset Size Chunks Chunk Names bundle.js 1.78 MB 0 [emitted] main styles.css 65.2 kB 0 [emitted] main bundle.js.map 9.53 MB 0 [emitted] main styles.css.map 87 bytes 0 [emitted] main [0] multi main 28 bytes {0} [built] + 1037 hidden modules
ERROR in ./~/react-tap-event-plugin/src/injectTapEventPlugin.js Module not found: Error: Cannot resolve module 'react/lib/EventPluginHub' in /Users/xxx/Desktop/refire-forum/node_modules/react-tap-event-plugin/src @ ./~/react-tap-event-plugin/src/injectTapEventPlugin.js 23:2-37
ERROR in ./~/react-tap-event-plugin/src/TapEventPlugin.js Module not found: Error: Cannot resolve module 'react/lib/EventConstants' in /Users/xxx/Desktop/refire-forum/node_modules/react-tap-event-plugin/src @ ./~/react-tap-event-plugin/src/TapEventPlugin.js 22:21-56
ERROR in ./~/react-tap-event-plugin/src/TapEventPlugin.js Module not found: Error: Cannot resolve module 'react/lib/EventPluginUtils' in /Users/xxx/Desktop/refire-forum/node_modules/react-tap-event-plugin/src @ ./~/react-tap-event-plugin/src/TapEventPlugin.js 23:23-60
ERROR in ./~/react-tap-event-plugin/src/TapEventPlugin.js Module not found: Error: Cannot resolve module 'react/lib/EventPropagators' in /Users/xxx/Desktop/refire-forum/node_modules/react-tap-event-plugin/src @ ./~/react-tap-event-plugin/src/TapEventPlugin.js 24:23-60
ERROR in ./~/react-tap-event-plugin/src/TapEventPlugin.js Module not found: Error: Cannot resolve module 'react/lib/SyntheticUIEvent' in /Users/xxx/Desktop/refire-forum/node_modules/react-tap-event-plugin/src @ ./~/react-tap-event-plugin/src/TapEventPlugin.js 25:23-60
ERROR in ./~/react-tap-event-plugin/src/TapEventPlugin.js Module not found: Error: Cannot resolve module 'react/lib/ViewportMetrics' in /Users/xxx/Desktop/refire-forum/node_modules/react-tap-event-plugin/src @ ./~/react-tap-event-plugin/src/TapEventPlugin.js 27:22-58 Child extract-text-webpack-plugin: + 54 hidden modules Child extract-text-webpack-plugin: + 2 hidden modules
[email protected] build:rules /Users/xxx/Desktop/refire-forum firebase-bolt security-rules.bolt
bolt: Generating security-rules.json...
[email protected] html /Users/xxx/Desktop/refire-forum cp index.html dist/index.html

npm run build error

Good day, I was trying to run npm run build but gets error below. Thanks

0 info it worked if it ends with ok
1 verbose cli [ 'C:\Program Files\nodejs\node.exe',
1 verbose cli 'C:\Program Files\nodejs\node_modules\npm\bin\npm-cli.js',
1 verbose cli 'run',
1 verbose cli 'build' ]
2 info using [email protected]
3 info using [email protected]
4 verbose node symlink C:\Program Files\nodejs\node.exe
5 verbose run-script [ 'prebuild', 'build', 'postbuild' ]
6 info prebuild [email protected]
7 info build [email protected]
8 verbose unsafe-perm in lifecycle true
9 info [email protected] Failed to exec build script
10 verbose stack Error: [email protected] build: npm run clean && npm run build:webpack && npm run html
10 verbose stack Exit status 1
10 verbose stack at EventEmitter. (C:\Program Files\nodejs\node_modules\npm\lib\utils\lifecycle.js:213:16)
10 verbose stack at EventEmitter.emit (events.js:110:17)
10 verbose stack at ChildProcess. (C:\Program Files\nodejs\node_modules\npm\lib\utils\spawn.js:14:12)
10 verbose stack at ChildProcess.emit (events.js:110:17)
10 verbose stack at maybeClose (child_process.js:1008:16)
10 verbose stack at Process.ChildProcess._handle.onexit (child_process.js:1080:5)
11 verbose pkgid [email protected]
12 verbose cwd C:*************\refire\refire-forum
13 error Windows_NT 6.3.9600
14 error argv "C:\Program Files\nodejs\node.exe" "C:\Program Files\nodejs\node_modules\npm\bin\npm-cli.js" "run" "build"
15 error node v0.12.0
16 error npm v2.5.1
17 error code ELIFECYCLE
18 error [email protected] build: npm run clean && npm run build:webpack && npm run html
18 error Exit status 1
19 error Failed at the [email protected] build script 'npm run clean && npm run build:webpack && npm run html'.
19 error This is most likely a problem with the refire-forum package,
19 error not with npm itself.
19 error Tell the author that this fails on your system:
19 error npm run clean && npm run build:webpack && npm run html
19 error You can get their info via:
19 error npm owner ls refire-forum
19 error There is likely additional logging output above.
20 verbose exit [ 1, true ]

Where to set "Firesbase value" - Data:set is not a Firebase command

Hi,

Great work on this! I'm trying to set it up however the first part ("Change firebase value to your app name in firebase.json") is not clear.

Could you please tell me exactly what I need to update in firebase.json?

Also, maybe related to the above, but when I try running "npm run bootstrap", I get this error:

"data:set is not a Firebase command

data:set has been renamed, please run firebase database:set instead"

Thanks

Set thread timestamp to new last post date when deleting last post

Thread timestamp isn't updated now when last post gets deleted.

about adding admin users

how can I create

"adminUsers": {
"google:123456789": true
}

Error: Syntax error in database rules:
4:36: Expected '{'.
can you explain that?