We are going to present our fullstack application called "FixIt". This application makes the communication between clients and service providers a lot more fluently and efficiently. Through our platform, users can create an account and search for specific services that they need. Our special feature is that our application is more like a social-media platform, meaning that our customers can add friends. Why would we add that feature? Well, we've thought about it this way: first, when we want to hire someone that we do not know personally we ask a friend, if he/she knows somebody trustworthy. Now, with our application, you can see the reviews of the workers that have done projects for your friends, and see how your close ones reviewed them.
- React for the frontend
- MongoDB for the NoSql database
- Express & NodeJS for the backend
- MUI for styling
- React Redux for managing states
- Bcrypt for the encryption of passwords
- Dropzone for uploading images.
The homepage contains widgets with the user's profile, the people they are following, the feed posts, the search bar, and the category selection bar for filtering.
On the login page, you can log in using an email and a password.
On the register page, you can create an account and set your name, location, profile picture, role (master or client), email, and a password.
Master Profile
On the profile page, if you are a master, you can see the posts you added, the tips you recommended and the people you are following.
Client Profile
If you are a client, you can only see the people you are currently following.
When creating a post, you are sent to a specific form, in which you need to fill in the title, description, the category and the picture representing the post. Here is the form:
After you have created the post, you are sent to the specific post page, where you are able to see the full description of the post and the reviews of the post.
A post contains information about the user who made it, with the option to follow or unfollow them, a title, a description, and an image. Users can like the post, add a review, or be redirected to a separate "Show Post" page. If the logged-in user is the one who made the post, he can delete or edit it.
On this page, you can edit a post by changing its attributes, including the image.
Adding a tip is possible only if you have a master account. You can also add Youtube videos.
The "Create a tip" form uses a title, description, category and a Youtube link to create a tip.
In the ShowPost, you can view the reviews of the specific post. These reviews have a star rating, a description, and a user associated to them. They can be created and deleted through pop-up windows.
Create a review pop-up:
We used this AI tool to add comments about what the code was specifically doing and also for generating some UI code.
