Welcome to our Hope2Hand Website Project!

This is our Hope2Hand Desktop and Tablet Fully Responsive Website

Our first version is deployed here : https://hope2hand.netlify.app/

Description of the project

This local Assistance App. is here for you in the most needed time.

We want to provide the quickest and most practical online help for newcomers, immigrants, and refugees.
We strive to grant the most reliable alternatives in due time for fast integration.
We connect the fastest way possible the persons with the things they could need in their local area.

Preview high-fidelity prototype

Header with NavBar & Hero Image Section

Welcome & City Guide Section

Social Services, Shop/Donations & Footer Section

Geolocalisation Map Section

Our Engineer Team!

Tech Stack used for this project

Main Features and Functionalities

Beautiful and Fully Responsive Design for Desktop & Tablet Minimal Design made with cutting edge tools like Locofy
Material UI & Bootstrap Library
Google Authentification
Special Contact Form, Forms & Login Users Secure Data Collection: Our user data goes to our Backend Database.
Clear Navigation & Call To Action for the User
Geolocalisation Map Plan Page
API to get User infos and Picture in our Frontend Forms to our Backend Database
Responsivesness & Accessibility
SEO & Metadata

FRONTEND

HTML5
CSS MODULES
JAVASCRIPT
REACT.JS
BOOTSTRAP
MATERIAL UI
LOCOFY BUILDER

BACKEND

NODE.JS
EXPRESS.JS
POSTMAN
AXIOS
MONGO DB
MONGOOSE
MONGO ATLAS

OTHERS

FIGMA
ADOBE ILLUSTRATOR
LOCOFY.AI PLUGIN
GITHUB PROJECTS
SLACK
VS CODE
TRELLO
LOOM Video Recording

DEPENDENCIES

FRONTEND: { "@emotion/react": "^11.7.1", "@emotion/styled": "^11.6.0", "@mui/material": "^5.2.5", "@mui/x-date-pickers": "^5.0.0-beta.0", "@testing-library/jest-dom": "^5.16.1", "@testing-library/react": "^12.1.2", "@testing-library/user-event": "^13.5.0", "@types/jest": "^27.0.3", "@types/node": "^16.11.14", "@types/react": "^17.0.37", "@types/react-dom": "^17.0.11", "axios": "^0.27.2", "bootstrap": "^5.2.0", "date-fns": "^2.28.0", "react": "^17.0.2", "react-bootstrap": "^2.5.0", "react-bootstrap-carousel": "^4.1.1", "react-dom": "^17.0.2", "react-file-base64": "^1.0.3", "react-icons": "^4.4.0", "react-router-dom": "^6.2.1", "react-scripts": "5.0.0", "web-vitals": "^2.1.2" }
BACKEND: { "bcryptjs": "^2.4.3", "body-parse": "^0.1.0", "body-validator": "^1.3.3", "cors": "^2.8.5", "dotenv": "^16.0.1", "express": "^4.18.1", "express-handlebars": "^6.0.6", "express-validator": "^6.14.2", "jsonwebtoken": "^8.5.1", "mongodb": "^4.8.1", "mongoose": "^6.5.2", "nodemailer": "^6.7.8", "nodemon": "^2.0.19" }

We also used the Locofy.ai Plugin to design our project and export our code to React.JS with Figma as main tool for our wireframe and design

Infos here : https://www.locofy.ai/

Thanks to all the Locofy.ai team for the precious help!

Credits

© The Third Team, 2022. All Rights Reserved.

Hope2Hand, Berlin, Germany

For Digital Career Institute DCI Final Project Presentation

Outlook

Deliver a FullStack Responsive App. version for IOS and Androïds mobile phone
It is a local application but we could promote it to global use and establish node app. hubs in every cities we can!
Make a in house feature Free Map with Geolicalisation API

Thanks for your Support!