el634dev/zensphere

Supportive chatroom to help improve mental health

ZenSphere

Supportive chatroom that is geared towards creating supportive communities to improve mental health.

Quickstart/Demo

Live demo here.

Table of Contents

• Technologies Used
• Features
• Usage
• Project Status
• Room for Improvement
• Acknowledgements
• Installation
• License

Technologies Used

Features

• Sign Up and Login Form
• Auth
• Multiple responsive web pages
• Chatroom

Usage

User is able to navigate to sign up form by clicking the Sign Up button.

User is able to navigate to login form by clicking the Login button.

User is able to see dashboard and then join or create a chatroom after login into the website.

User is able to have a real-time conversation while inside of the chatroom with another user(s).

Project Status

Project is: completed

Room for Improvement

To do:

• User can add a picture to a profile
• User can see their profile picture in the chatroom

Acknowledgements

• This project was inspired by a random thought
• Many thanks to my teachers

Installation

See the appropriate guide for your environment and operating system.

• Flask or older Flask version
• Other frameworks that are not Flask, Bootstrap, Jinja2, SQLAlchemy

a. Flask Installation

Add Flask to your global or virutal enivorment: For macOS: pip3 install flask For Windows: pip install flask

• Make sure that Flask is the current version
• If using the virtual enivorment make sure to navigate to your folder that you create your env folder and activated your env
• You can activate your enivorment by typing source/venv/bin/activate and for Windows .\env\Scripts\activate

b. Boostrap Installation

Add the link provided by Boostrap in your header located in your HTML file (this could also be your base file).

<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">

Make sure to use version 5 as this is the latest version

c. Jinja/HTML/CSS Installation

There is no installation needed for Jinja, HTML, CSS. When using Jinja just use {%%} to utilize Jinja. HTML and CSS is built into VSCode, while Jinja is Flask's official templating engine.

d. SQLAlchemy/Socket.io Installation

Add the link provided by Socket.io in your head tag located in your HTML file (this could also be your base file).

<script src="https://cdnjs.cloudflare.com/ajax/libs/socket.io/4.0.1/socket.io.js" integrity="sha512-q/dWJ3kcmjBLU4Qc47E4A9kTB4m3wuTY7vkFJDTZKjTs8jhyGQnaUrxa0Ytd0ssMZhbNua9hE+E7Qv1j+DyZwA==" crossorigin="anonymous"></script>

SQLAlchemy can be installed by using pip3 install flask_sqlalchemy or pip install flask_sqlalchemy

License

• Licensed under Apache 2.0 (Back to top)