Remote Full stack web developer - Belgrade, Canada

Built an application with CRUD functionality, via which users can create and modify blog posts, comments, votes and more! Built with React, JavaScript, Bootstrap, Express.js, Node.js.

Complex State Management: The application manages a complex state operation with over 30 routes going to the backend. This was achieved using the useContext and useReducer React hooks across 5 different context files and corresponding reducer files.

Password Reset Functionality: The application provides a comprehensive password reset functionality. Users can reset their password if they know their current password. If they don't, the application provides a secure way to reset it via email.

Image Upload: Users can upload images for their profile picture and blog posts. The application supports both file uploads and URL inputs. This was implemented using Cloudinary for image hosting.

Voting System: The application features a Reddit-like voting system for blog posts and comments. Users can upvote, downvote, or remove their vote from a blog post or a comment. The voting system is implemented in a way that a user can change their vote from upvote to downvote and vice versa.

Optimized Data Fetching: To improve performance, the application implements an optimized data fetching system. It includes features like limit, sort, and order for blog posts, and a debounced scroll to load more function. This was achieved by creating separate routes for blogs, comments, and votes on the backend.

Custom Hooks: The application uses custom hooks throughout the project to encapsulate and reuse stateful logic.

Additional Features: The application includes a currency exchange converter and a visual representation of blog, comments, and votes data using the Recharts library.

This project was built using a variety of technologies and libraries to provide a rich, interactive user experience. Here are some of the key technologies used:

React: The application's UI was built using React, a popular JavaScript library for building user interfaces.

React Router DOM: This was used for managing the routing in the application, allowing for seamless navigation across different components.

Bootstrap: This was used for styling the application and making it responsive across different screen sizes.

Axios: This was used for making HTTP requests to the backend.

Classnames: This was used for conditional rendering of class names in the application.

History: This was used for managing session history in the application.

Leaflet and React-Leaflet: These were used for implementing interactive maps in the application.

React-Responsive: This was used for making the application responsive and optimizing the UI for different screen sizes.

Recharts: This was used for visualizing blog, comments, and votes data in the application.

UUID: This was used for generating unique identifiers.

Moment: This was used for parsing, validating, manipulating, and displaying dates and times in JavaScript.

The application was bootstrapped with create-react-app to minimize initial setup and allow more time for feature development. In the future, I'm excited to explore and implement different technologies in other projects!