Chat Application is well, a chat application (Gee, what a shocker!), which is being created using Node.js, React and Socket.io, as well as MongoDB for the database.
A non-exhaustive list of the distinctive features intended to be added to the chat application is provided below:
- Login and sign-up system
- Individual room codes with passwords
- Room-sharing links
- Chat commands with a response from the system
- Page for a list of open rooms
- Profile page with editable user information
- App themes
- Clone the repo from either of the following links:
- https://github.com/Pranav-PSU/ChatApplication.git (HTTPS)
- git@github.com:Pranav-PSU/ChatApplication.git (SSH)
- gh repo clone Pranav-PSU/ChatApplication (Github CLI)
- Navigate to
backendfolder and open the terminal. Execute the following command:npm install - Navigate to
frontendfolder and open the terminal. Again, execute the following command:npm install - Execute the following command in the
frontendfolder:npm start - Navigate to the
backendfolder and again execute the following command:npm start - The browser should launch with a tab running the Chat Application.
- https://www.educative.io/answers/class-and-id-selectors-in-css
- https://www.youtube.com/watch?v=OXGznpKZ_sA
- https://stackoverflow.com/questions/5581799/how-to-stretch-div-height-to-fill-parent-div-css
- https://www.w3schools.com/css/tryit.asp?filename=trycss_border-style
- https://cssgradient.io/
- https://mycolor.space/
- https://www.w3schools.com/css/css3_shadows_box.asp
- https://stackoverflow.com/questions/376253/stretch-and-scale-css-background
- https://stackoverflow.com/questions/450903/how-can-i-make-a-div-not-larger-than-its-contents
- https://www.w3schools.com/css/css_form.asp
- https://stackoverflow.com/questions/8865458/how-do-i-vertically-center-text-with-css
- https://stackoverflow.com/questions/39524688/how-to-remove-the-focus-border-of-button-when-click
- https://www.w3schools.com/css/css_positioning.asp
- https://stackoverflow.com/questions/3751511/div-size-automatically-size-of-content
- https://stackoverflow.com/questions/4938716/align-div-elements-side-by-side
- https://codeburst.io/how-to-position-html-elements-side-by-side-with-css-e1fae72ddcc
- https://stackoverflow.com/questions/56202758/align-button-right-reactjs
- https://youtu.be/mccoaaEPQJc
- https://youtu.be/-RCnNyD0L-s
- https://www.passportjs.org/concepts/authentication/downloads/html/
- https://react-bootstrap.github.io/forms/validation/
- https://formik.org/docs/tutorial
- https://react-bootstrap.github.io/forms/overview/
- https://react-bootstrap.github.io/components/alerts
- https://react-bootstrap.netlify.app/components/navbar/#rb-docs-content
- https://bootswatch.com/lux/
- https://reactjs.org/docs/context.html
- https://reactjs.org/docs/hooks-overview.html
- https://reactjs.org/docs/hooks-effect.html
- https://v5.reactrouter.com/web/guides/quick-start
- https://www.npmjs.com/package/react-router-bootstrap
- https://socket.io/get-started/chat/
- https://socket.io/docs/v3/rooms/
- https://socket.io/docs/v3/emitting-events/
- https://socket.io/docs/v3/listening-to-events/
- https://github.com/iTyphoons/React_chat
- https://dev.to/bravemaster619/how-to-use-socket-io-client-correctly-in-react-app-o65
- https://www.w3schools.com/howto/howto_css_chat.asp
- https://nodemailer.com/about/
- https://www.npmjs.com/package/body-parser
- https://expressjs.com/en/4x/api.html#app
- https://www.freecodecamp.org/news/find-vs-filter-javascript/
- https://www.npmjs.com/package/dotenv