Show HN: Discuzz – open-source Comment System

Discuzz Open source Comment System Table of contents Homepage Features Usage Firebase Web Component React Component Advanced usages Contributing Changelog License Homepage discuzz.mph.am Features Discuzz is an open source comment system, that you can embed in your website to increase reader engagement, grow audience and traffic. Supporting Firestore as the data storage, with Realtime and…

1
Show HN: Discuzz – open-source Comment System



Discuzz


Open source Comment System


Discuzz

Table of contents

Homepage

discuzz.mph.am

Features

  • Discuzz is an open source comment system, that you can embed in your website to increase reader engagement, grow audience and traffic.
  • Supporting Firestore as the data storage, with Realtime and Offline support. You can use Discuzz easily without any backend server.
  • With Firebase Auth support, you can provide many ways to authenticate for your users.
  • You can easily config the access control, to adjust permissions (Example: open to all people, or only authenticated users, or you can also turn on moderation mode for every comments)
  • Customizable theme, with built-in light/dark theme.

To suggest anything, please join our Discussion board.

Usage

You can embed Discuzz in many ways:

  • As a Web Component
  • As a React Component

Firebase

You’d need to create a Firebase project, and add a web platform. It will give you the config parameters.

ABI

Web Component

You can embed Discuzz in your website with the following code

“>

<script src="https://discuzz.mph.am/static/js/main.js">script>
<x-discuzz 
  service="--- PUT THE firebaseConfig HERE ---" 
  auths="-- PUT THE AUTHENTICATION METHODS YOU WANT HERE ---"
>x-discuzz>

Example

“>

<script src="https://discuzz.mph.am/static/js/main.js">script>
<x-discuzz 
  service="{'apiKey':'AIzaSyDm837cbdbvkrAdYL9TAqUF3iML6UvZXk4','authDomain':'fire-talk-88.firebaseapp.com','projectId':'fire-talk-88','storageBucket':'fire-talk-88.appspot.com','messagingSenderId':'719566664522','appId':'1:719566664522:web:e1a9d26be22387e55b47b3'}" 
  auths="['google', 'apple', 'facebook', 'github', 'twitter', 'microsoft', 'yahoo']"
/>x-discuzz>

React Component

Install dependencies

  1. Discuzz component
yarn add @discuzz/discuzz
  1. Comment Viewer and Comment Composer
yarn add @discuzz/viewer-plaintext @discuzz/composer-plaintext
  1. Locale
yarn add @discuzz/locale-en date-fns

Example component usage



);
}”>

import { Discuzz } from '@discuzz/discuzz'

const LocaleProviderEn = lazy(() => import('@discuzz/locale-en'))
const ComposerPlaintext = lazy(() => import('@discuzz/composer-plaintext'))
const ViewerPlaintext = lazy(() => import('@discuzz/viewer-plaintext'))

function App() {
  return (
    <Suspense fallback={<span>Loading...</span>}>
      <Discuzz
        url={global.location.href}
        service={{
          apiKey: "AIzaSyDm837cbdbvkrAdYL9TAqUF3iML6UvZXk4",
          authDomain: "fire-talk-88.firebaseapp.com",
          projectId: "fire-talk-88",
          storageBucket: "fire-talk-88.appspot.com",
          messagingSenderId: "719566664522",
          appId: "1:719566664522:web:e1a9d26be22387e55b47b3"
        }}
        auths=

Join the pack! Join 8000+ others registered users, and get chat, make groups, post updates and make friends around the world!
www.knowasiak.com/register/
Read More

Charlie
WRITEN BY

Charlie

Fill your life with experiences so you always have a great story to tell

Leave a Reply

One thought on “Show HN: Discuzz – open-source Comment System

  1. Aditya avatar

    – Disuzz is an open source comment system, that you can embed in your website to increase reader engagement, grow audience and traffic.

    – Supporting Firestore as the data storage, with Realtime and Offline support. You can use Discuzz easily without any backend server.

    – With Firebase Auth support, you can provide many ways to authenticate for your users.

    – You can easily config the access control, to adjust permissions (Example: open to all people, or only authenticated users, or you can also turn on moderation mode for every comments)

    – Customizable theme, with built-in light/dark theme.