React / NextJS / TypeScript / MongoDB / NodeJS Portfolio
Following projects showcases my skills and experience through real-world examples of my work. Each project is briefly described with links to code repositories and live demos in it. It reflects my ability to solve complex problems, work with different technologies, and manage projects effectively.
Bank Account Management App
This is a bank account management app. The interesting thing about this app is the high optimization of the code, the use of the optimistic updates principlein tanstack/react-query, unit tests and etc. Suspense + ErrorBoundaries, no design.
Products List App
A list of products and filters
Weather App
Weather App
Мovies Аpp
Мovies Аpp
Balken
Web based application - presentation site. For a company focusing on the development of renewable energy projects with extensive experience in photovoltaic and wind projects.
mojo7
Small application showing games by category. Dark and Light mode included. Second page has featured games and all games that the user can filter. Two types of filtering. Labels on each game based on the included categories.
social
А Social application. You are able to create a post or edit your profile. Like or dislike posts. The app counts how many post you made or how many times you liked something. Each post has a date and caluclates how many hours and days past from the last change on the post. Attractive design. The app loads three post at a time.. you can load more and more by clicking the button `load more`. I have created a custom hooks in order to optimize the code and achieve higher performance.This app is also a great example for exponential change and linear change! If you go to src/store/postsSlice.jsx at line 56.. you will find detailed explanation about this technique what it does and why it is important to know! As well as the code written!I have installed eslint - prettier - husky for higher quality code. To install the app please read the file README.md. It is very simple to install this app.
sportal
Web based application - I was requested to create a small application.. similar to this one i am showing in this demo. A form from where a user can insert data and see it bellow. The form has validation, I am using react-hook-form to validate data. Additionaly I am using eslint - airbnb, prettier and husky - Husky is a useful tool to augment (but not replace!) automated CI systems. Not only can it prevent unnecessary broken commits which can slow other developers down, but it also can save time and money (especially if you are paying for build minutes for your CI service!) For CI/CD I am using GH Actions.In addition i use rollup visualiser - Visualize and analyze your Rollup bundle to see which modules are taking up space. The results/statistics are in stats.html
ps interactive
I was asked to create an application that calculates the distance between two points. In this case.. if you have a party, and you want to invite all of your friends, but within X km radius. based on the entered coordinates, the application calculates which ones are in the given radius and shows them to you.
mobile app – entering goals or to-do list for mobile
I have developed a small mobile app for entering goals or a to-do list for mobile. The App works perfectly with Android and iOS. The Client can enter his goals .. or remove them. I am using Expo. Expo is an open-source platform for making universal native apps that run on Android, iOS, and the web.
movie app searching and displaying a movie
This is an application where you can search for a movie through the search engine and, ... in addition showing a list of movies. When you click on a movie, the details of that movie are displayed. The application is made with redux toolkit and redux saga.
Blog
А Blog application with users. You can create, edit or delete a user (CRUD). Each created user is able to create an additional article that appears in the blog with a date (how long ago, it was published) ... and by whom. You are able to view each article in entirely, as well as each user with all the data entered. However, since I do not have a json-server on my hosting, the application has not been uploaded. But the code is uploaded to the GIT and you can view it from there. I used react with redux and RTK Query to make it. If you want to download and test it, you need to install json-server: https://www.npmjs.com/package/json-server and run it with this command: “npx jsonserver -- watch data /data.json --port 3500 ”
Uploading and reading file
This is an application where you can drag and drop a specific scv file in the specified box. The application intercepts it, reads and shows all employees worked on certain projects and calculates how many days they have worked. Then shows those employees who worked together on a project and how long each one worked, and then shows the employee who worked the most. The application intercepts all types of dates that can be entered and works with them, and if there is a blank date NULL also intercepts it and there is no problem. You can download the code from the link to the GIT below and the file inside that tests zzz.scv and see the result .. the code is based on pure react.
Test driven development
This is an interesting approach to programming. As programmers are increasingly required to test their code better and better, unit testing technology has emerged. Through which a programmer can test the component he created with react. Test Driven Development process is used mainly in larger companies with large projects where programmers first write their unit tests and then write the code and components based on the unit tests. In this case ... I made an elementary calculator, in which I first wrote my unit tests and I wrote the code based on these unit tests.