Skip to content

RyannKim327/chat-app

Repository files navigation

Sample Chat App with ExpressJS, NodeJS

MPOP Reverse II (Ryann Kim Sesgundo)


This is just a simple web based so-called application that update everytime. I also added some user credentials here like using of cookies, to avoid multiple accounts, and also the admin clear chat command, ban a user, and unban user. To avoid spams, I use the if last two chat, no input method, so that the spam may be prevented.


What's added:

  1. Make it simple design with responsive UI
  2. Fixed minor issues such as the spam alers
  3. Added no bad words ban account
  4. Used cookies to store credentials
  5. Lessen the data to be gathered to avoid some unwanted alerts
  6. Fixed html tags insertations
  7. Added auto bots
  8. Added accounts promotions and rankings (Announced by auto bots)
  9. Added clear command for admin rank
  10. Maximized the chat thread limit from 50 to 25 lists of chats
  11. Auto synchronized conversation
  12. 2 chats per user (or else the input will be gone unless someone chats) to avoid some spams
  13. Added messaage reply
  14. Added some secrets tags such as newline and tabs
  15. Atleast 2 characters long chat, to avoid spam
  16. Atleast 5 characters long for username and 8 characters long for password
  17. Auto sign in/sign up on login panel (sign up if not existed)
  18. Fixed auto sync from 500 ms to 750 ms, now to 1 second and 10 seconds interval after 10 seconds
  19. Added date for chats
  20. Make a style like messenger
  21. Admin can promote a user to moderator if he wants
  22. Music command using !play song_title, with music bot
  23. Loading screen (beta test) for no messages
  24. Fixed Music Error
  25. Added Music Duration Percentage
  26. Added Custom Duration for progress
  27. Loop with maximum of 5 loops
  28. Play and Pause through text

Credits

  1. ChatGPT - for telling me kung saan ako nagkulang
  2. John Paul Caigas - for suggesting about the url
  3. Mark Kevin Manalo - for recruitments for alpha test
  4. Earl Shine Sawir - for testing and some design ideas

Issue Fixed before the first release

  1. Undefined req.body in ExpressJS

Package used

ExpressJS

npm install express --no-bin-links

Body Parser

npm install body-parser

FS

npm install fs

youtube-music-api

npm install youtube-music-api

ytdl-core

npm install ytdl-core

@ffmpeg-installer/ffmpeg

npm install @ffmpeg-installer/ffmpeg

fluent-ffmpeg

npm install fluent-ffmpeg

Solutions:

  1. use the ("body-parser").json as middleware in app.use
const express = require("express")
const app = express()
const body = require("body-parser")

const parser = body.urlencoded({ extended: true })

app.use(body.json())

app.post("/", parser, (req, res) => {
	let data = req.body
})
  1. Setup external files to be include, by also using of middleware and app.use

NodeJS

const express = require("express")
const app = express()

app.use('/source', express.static(path.join(__dirname + "/styles")))

app.get("/", (req, res) => {
	res.sendFile(`${__dirname}/src/index.html`)
})

HTML

<link rel="stylesheet" href="/source/styles.css">

You may also use the script here. Same method as this example. The logic behindi this program is to use the API method to get the data from the server of the website, and call it thru the fetch method. In this case, the backend and the frontend connects to each other. I use JSON as database of the program, to easily manage thru nosql method. If every that you want to use this project, just add the audio folder, which is excluded to this repository.


Soon to be added

  1. Multiple theme (monokai and default with other editor based themes).
  2. Loading from no message.

Wanna be one of us, kindly join with us by clicking the link, attached to this repository.


Disclaimer

This program is developed to enhance my knowledge, regarding in web development, also to enhance and to expand my knowledge in programming. This program also helps me not just to look for what I know, but to seek more. The development is still in progress, if ever you wanted to join with us, kindly go to this link. Also, we are open for the idea if you see anything, that may help us to improve the platform, specially the security features for all users.

About

A simple web based so-called application test

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published