Peer2Peer
Role: Developer
Team: Solo
Timeline: July 2019 - Present
Technologies: MongoDB, Express.js, React, Node.js, Socket.IO, Redux, Bootstrap, Postman, MongoDB Atlas
About:
Peer2Peer is a web application I built using the MERN stack, along with other JavaScript libraries. Throughout this project,
I learned more about authentication and authorization through the use of JSON Web Tokens, hashing passwords, and storing them safely
within a secure database which was hosted online using MongoDB Atlas. The application allows for real time message sending automatically
updating on the client's screen allowing for a seamless user experience which was integrated with Socket.IO and CRUD methods.
Tasks:
1) I implemented authentication and authorization using the latest techniques and best practices. I used JSON Web tokens to keep track
of who was logged in at the time along with a select amount of information I stored within the payload of the token. I hashed each
of the user's password and stored it safely within a MongoDB collection pertaining to that specific user. When authorizing specific
users to perform a task, I utilized my middleware implementation to verify that the user was granted access through web tokens and local storage.
2) I made use of Socket.IO to easily allow users to communicate with eachother in real time. I added features to let users create their own
private rooms or join other users' rooms. All of this was displayed on the dashboard which made use of React's front end framework allowing
for seamless integration of Socket's on the front and back end. As shown in the picture, there are designated columns to display important
features such as showing the user's rooms, the other user's within a channel, or creating a room.
3) One feature that I am in the works of completing is the use of Darksky's API in which user's can call to display their profile on a map, along
with weather specific details of their location. My idea is to display every user in the channel's profile on the world map, and update it everytime
a user clicks on the 'Location!' button in the chat box.
4) State management proved to be a bit tricky at first as I was learning about React and all of its capabilities as a front end framework. I ended up
implementing Redux to easily transfer data between specific pages within my application. This was important because it allowed me to understand how
data flowed within an application, whether that be to lower or higher components.