STRESSER

Short Brief

Stresser is a web application to help people reduce stress and anxiety. The web application itself contains clean and interactive UI/UX making it easier to navigate. We provide features such as therapy where you can watch calm and relaxing music, yoga and meditation videos, traditional methods to reduce stress and more. We also provide a diet section where you can search recipes for any ingredient. The application also contains user authentication through login/sign-up feature. After signing-up, a user can create his/her own diary and chat with other people as well.

Contents:

• About
• Project Starter
• Glimpse of the site
• Tools and Packages
• Author

---

✊ About

Stresser stresses on reducing people's stress and anxiety by providing featues like therapy, diet, diary and chat sections.

You can checkout the demo video on youtube by clicking on the thumbnail below.

The site is deployed through heroku, which you can view from here

---

👨‍💻 Getting started

This section will work you through how you can get started with the project.

Directory Layout

.
├── client
|      ├── public
|      └── src
|           ├── assets
|           |
|           ├── Components
|           │      ├── ChatComponents  
|           |      |        ├──ChatContainer.js
|           │      |        ├──ChatInput.js
|           │      |        ├──Contacts.js
|           │      |        └──Welcome.js 
|           |      ├── DiaryComponents  
|           │      |        └──DiaryEntry.js 
|           |      ├── DietComponents  
|           |      |        ├──DietLists.js
|           │      |        └──RecipeTile.js 
|           |      ├── HomeComponents  
|           |      |        ├──Button.js
|           │      |        └──Footer.js
|           |      ├── NavbarComponents  
|           |      |        ├──Logout.js
|           │      |        └──Navbar.js
|           │      └── TherapyComponents
|           │               └──Frames.js
|           │  
|           ├── Pages
|           │      ├── Chat.js
|           │      ├── Diary.js
|           │      ├── Diet.js
|           │      ├── Home.js
|           │      ├── Login.js
|           │      ├── Register.js
|           │      ├── SetAvatar.js
|           │      └── Therapy.js 
|           │ 
|           ├── Utils
|           │      └── APIRoutes.js     
|           │ 
|           ├── App.js
|           │ 
|           ├── index.css
|           │ 
|           └── index.js
|
│   
│ 
├── server
|      ├── Controllers
|      │      ├── diaryControllers.js
|      │      ├── messageControllers.js
|      │      └── userControllers.js 
|      │
|      ├── Model
|      │      ├── diaryModel.js
|      │      ├── messageModel.js
|      │      └── userModel.js 
|      │
|      ├── Routes
|      │      ├── diaryRoutes.js
|      │      ├── messageRoutes.js
|      │      └── userRoutes.js 
|      │  
|      └── index.js
|  
|
└── README.md

Run on your local server

You will need NodeJS, Git and MongoDB installed to run this project locally

  node@v16.13.0 or higher
  npm@8.1.0 or higher
  git@2.34.1 or higher

If you dont have MongoDB you use MongoDB Atls

1. Clone the repo

git clone https://github.com/Garvit1809/Stresser.git

2. Create a file called .env in the Backend directory of your project:

   server
   └──- Controllers
       - Model
       - Routes
       - .env         <-- create it here
       - .gitignore
       - index.js
       - package-lock.json
       - package.json
   

3. Inside the .env file, add key MONGO_URL and assign your MongoDB local host or Mongo Atls like this

# .env
MONGO_URL = "YOUR_DB_LOCAL_HOST" 
# eg : mongodb://localhost/stresser or mongodb+srv://"Your username ":" your password "....

1. Starting the Server application.

cd server 
npm install
nodemon index.js

This will start server on localhost:5000

5. Starting the Client application.

cd client 
npm install
npm start

This will start client app on localhost:3000

---

🖼️ Some Glimpse of the Site

1. Home Page

2. Therapy Page

You can listen to some stress-relieving music 😇, can do yoga and meditation by watching tutorials, watch some funny videos to get some laugh and much more on the therapy section. You can filter the videos acccordingly 👇👇

Filtered Method Videos 👇👇

3. Diet Page

A healthy diet plays an important role in reducing stress and anxiety. We have a diet section where you can search for recipes of any ingredient.

There is a small box having a list of ingredients 🍈🥑 which help in reducing stress as well as anxiety.

You can look recipes for any ingredient from the Ingredient-Box. By Clicking on the recipe image you can get more information about that recipe 😋

4. Diary Page

If you struggle with stress, depression, or anxiety, keeping a journal can be a great Idea. Keep a track of your daily mood with our diary section.

You can also view your diary entries 📖

5. Chat Page

Lack of social interactions also damages mental health. But don't worry, we have a chat section where you can interact with other people facing same issues.

6. Authentication Pages

SignUp Page

Login Page

7. SetAvatar Page

After signing up, you would come across this page where you have to pick an Avatar as your progfile image.

---

🧰 Tools & Packages

Client Dependencies

Package	Description	version
axios	Promise based HTTP client for the browser and node.js	0.27.2
buffer	A package for easy manipulation of binary data	6.0.3
emoji-picker-react	To add Emoji picker component for react applications	3.5.1
material-ui-icons	Ready-to-use React Material Icons from the mui library	5.8.4
react-icons	A library that allows us to include only those icons that our project is using	4.4.0
react-toastify	A package that allows to add notifications to our app with ease	9.0.5
socket.io-client	A package for client-side implementation of socket.io	4.5.1
styled-components	A library which lets you write CSS in your JavaScript	5.3.5
uuid	A package used for identifying information that needs to be unique	8.3.2

Server Dependencies

Package	Description	version
bcrypt	A library to help you hash password	5.0.1
cors	A package providing express middleware	2.8.5
dotenv	A library that loads environment variables from a .env file into process.env	16.0.1
express	Node.js web application framework for server side scripting	4.18.1
MongoDB	A NoSQL database	4.4.3
mongoose	Elegant mongodb object modeling for node.js	6.4.0
socket.io	A library enabling real-time bidirectional event-based communication	4.5.1

Server devDependencies

Package	Description	version
nodemon	A library to automatically restart node application	2.0.16

API's used

API	Description	Used in Page
Multiavatar API	API to get random avatars for profile image	SetAvatar Page
Edamam's Recipe API	API to get recipes of the searched ingredients/food-items	Diet Page

👦 Author