Web Development
YouShield
I made this chrome extension because I found myself wasting too much time watching useless things on youtube, so I made it hide the video recommendations in the homepage and on the right of the videos being watched and stop me from scrolling through youtube shorts, it allows only one short.
This is version two, I have version one on my github page, it had a menu where the user would choose how much time they want to have on youtube everyday, but I realized that there are useful tutorials or things that are not a waste of time, and I found it not very effective so I decided to make version two.
Challenges
I didn't have any previous experience with chrome extension or any kind of extension so I had to learn a lot of new things like the manifest.json. I also had to understand a lot more about HTML to be able to tell the extensions what elements to delete or modify.
But other than that it was more of just searching for the things to remove and finding a correct stable way to remove them. Like when I told the extension to remove the video recommendations on the right when a video is being watched it also deleted the all of the video when I opened the page of any channel and I realized that both elements had the same id
Technical Details
I used HTML, and JavaScript for this without any external libraries
Extra
I was planning to make another extension called InstaShield but I didn't see much installs of YouShield in the chrome web store and I didn't feel like it will be very useful, because it would have only worked if you used instagram on the browser, which I don't think very much people do, or waste time doing at least.
YouShield
I made this chrome extension because I found myself wasting too much time watching useless things on youtube, so I made it hide the video recommendations in the homepage and on the right of the videos being watched and stop me from scrolling through youtube shorts, it allows only one short. This is version two, I have version one on my github page, it had a menu where the user would choose how much time they want to have on youtube everyday, but I realized that there are useful tutorials or things that are not a waste of time, and I found it not very effective so I decided to make version two.Challenges
I didn't have any previous experience with chrome extension or any kind of extension so I had to learn a lot of new things like the manifest.json. I also had to understand a lot more about HTML to be able to tell the extensions what elements to delete or modify. But other than that it was more of just searching for the things to remove and finding a correct stable way to remove them. Like when I told the extension to remove the video recommendations on the right when a video is being watched it also deleted the all of the video when I opened the page of any channel and I realized that both elements had the same idTechnical Details
I used HTML, and JavaScript for this without any external librariesExtra
I was planning to make another extension called InstaShield but I didn't see much installs of YouShield in the chrome web store and I didn't feel like it will be very useful, because it would have only worked if you used instagram on the browser, which I don't think very much people do, or waste time doing at least.
KalemGPT
This is a SaaS (Software as a Service) tool with the main purpose of allowing users mainly from Egypt to access ChatGPT, becuase making a ChatGPT account with an account that is known to have been made in Egypt doesn't work, so this tool is an alternative.
It is in the arabic language, which is the most popular language in Egypt.
It uses the OpenAI api and sends the users inputs to the api and recieves chatgpt-3.5 answers from it.
47 anonymous conversations were made on this website.
Challenges
I didn't have any previous experience with using any api or with making a whole website so I spent a lot of time understanding and trying things and I didn't have any experience with domains, hosting and how hosting tools work so that also caused some more pain and suffering.
The most thing I suffered of was the backend, I didn't even know what the backend meant, (it's the server part of a website, I'll explain), I ended up using google's cloud functions, so the users click a button which sends what they wrote in the prompt to the cloud function, the function talks to the api and sends the answer to the client. This took me wayyyy too much time, maybe 2 weeks, most of the time just not understanding why the function is not working, the main reason it took me so long is because testing the code I wrote took 3 minutes, so if I wrote 1 letter wrong I would waste 6 minutes, and just forget everything I was doing or thinking about causing me to make more simple mistakes.
I knew that the free trial OpenAI gave me in the api was enough for atleast maybe 1000 questions and answers and if that runs out I would just use another account, and if that runs out I would just pay for the api it would be worth it at this point. But then ChatGPT decreased the freetrial to much less close to fourth and most the prompts the users input were in Arabic which turned out to be more expensive than English and the free tial turned out to also be just 3 months and I made my account before starting this project by like a 2 months so it ran out and the website started giving errors because the free trial ran out and I still haven't made a different account and told the website to use it yet, and I don't know if I will.
Technical Details
I used HTML, CSS, and JavaScript for this and I used Google's Cloud Functions for the backend and Namecheap and Cpanel for hosting and domain
Extra
Brought me a step closer.
KalemGPT
This is a SaaS (Software as a Service) tool with the main purpose of allowing users mainly from Egypt to access ChatGPT, becuase making a ChatGPT account with an account that is known to have been made in Egypt doesn't work, so this tool is an alternative. It is in the arabic language, which is the most popular language in Egypt. It uses the OpenAI api and sends the users inputs to the api and recieves chatgpt-3.5 answers from it. 47 anonymous conversations were made on this website.Challenges
I didn't have any previous experience with using any api or with making a whole website so I spent a lot of time understanding and trying things and I didn't have any experience with domains, hosting and how hosting tools work so that also caused some more pain and suffering. The most thing I suffered of was the backend, I didn't even know what the backend meant, (it's the server part of a website, I'll explain), I ended up using google's cloud functions, so the users click a button which sends what they wrote in the prompt to the cloud function, the function talks to the api and sends the answer to the client. This took me wayyyy too much time, maybe 2 weeks, most of the time just not understanding why the function is not working, the main reason it took me so long is because testing the code I wrote took 3 minutes, so if I wrote 1 letter wrong I would waste 6 minutes, and just forget everything I was doing or thinking about causing me to make more simple mistakes. I knew that the free trial OpenAI gave me in the api was enough for atleast maybe 1000 questions and answers and if that runs out I would just use another account, and if that runs out I would just pay for the api it would be worth it at this point. But then ChatGPT decreased the freetrial to much less close to fourth and most the prompts the users input were in Arabic which turned out to be more expensive than English and the free tial turned out to also be just 3 months and I made my account before starting this project by like a 2 months so it ran out and the website started giving errors because the free trial ran out and I still haven't made a different account and told the website to use it yet, and I don't know if I will.Technical Details
I used HTML, CSS, and JavaScript for this and I used Google's Cloud Functions for the backend and Namecheap and Cpanel for hosting and domainExtra
Brought me a step closer.
BizWebless
This is my second SaaS (Software as a Service) tool made for web designers and web design agencies to help them find nearby clients with bad or no websites, in a certain radius from a chosen location on the map and a chosen category (coffee, gym, etc.). The website allows them to sort the found businesses by rating, number of ratings, an average between the ratings and number of ratings, if the bussiness has a website or not, website performance or website SEO (Search Engine Optimization (how likely it is to appear on a google search)).
I made a landing page for this tool with the aim of making facebook ads and making it send people to it. It makes people input their email to spin a wheel to win an offer when the tool is launched. I made this to be able to verify how useful and wanted this tool is, and if it's worth making. I haven't made the facebook ads yet. I have made 95% percent of this tool, I just need to make the facebook ads.
Challenges
I also used google's cloud functions in this project (suffered from it in my project KalemGPT). Because it is pretty cheap, I still suffered, but this time I was more efficient, I did learn from my mistakes and use firebase realtime database(To store collected emails and login ids) instead of google cloud realtime database and I used firebase authentication to allow users to make accounts.
Technical Details
I used HTML, CSS, and JavaScript for this, I used Google's Cloud Functions and the Firebase Realtime Database for making accounts and talking to the Yelp api
Extra
I learnt at this point that verifying a project before making it is important and intend to do that from now on before starting my next project.
BizWebless
This is my second SaaS (Software as a Service) tool made for web designers and web design agencies to help them find nearby clients with bad or no websites, in a certain radius from a chosen location on the map and a chosen category (coffee, gym, etc.). The website allows them to sort the found businesses by rating, number of ratings, an average between the ratings and number of ratings, if the bussiness has a website or not, website performance or website SEO (Search Engine Optimization (how likely it is to appear on a google search)). I made a landing page for this tool with the aim of making facebook ads and making it send people to it. It makes people input their email to spin a wheel to win an offer when the tool is launched. I made this to be able to verify how useful and wanted this tool is, and if it's worth making. I haven't made the facebook ads yet. I have made 95% percent of this tool, I just need to make the facebook ads.Challenges
I also used google's cloud functions in this project (suffered from it in my project KalemGPT). Because it is pretty cheap, I still suffered, but this time I was more efficient, I did learn from my mistakes and use firebase realtime database(To store collected emails and login ids) instead of google cloud realtime database and I used firebase authentication to allow users to make accounts.Technical Details
I used HTML, CSS, and JavaScript for this, I used Google's Cloud Functions and the Firebase Realtime Database for making accounts and talking to the Yelp apiExtra
I learnt at this point that verifying a project before making it is important and intend to do that from now on before starting my next project.Desktop Application Development
20-20-20
I don't remember how I found out about this 20 20 20 rule but it means, every 20 minutes look for 20 seconds at something 20 feet away, and my parents would always tell me that the amount of time I spend on my laptop is unhealthy, so I made an app for the 20-20-20 rule.
The app makes a small box in the middle of the screen that counts down for 3 seconds as a warning before the 20 second full screen box appears, on top of every app until it finishes.
Pressing ESC skips the 20 second countdown.
I compiled the app to an exe file to allow it to work for people without having to install python.
Challenges
I used python and pygame which I was very experienced with at the time I made this, so I didn't stuggle in anything except making the 20 second countdown appear on top of everything, which was new to me, but wasn't a big deal.
Technical Details
I used Python and the library Pygame to create a window and draw things on it.
Extra
I really liked this app and I always have it running. I also send it to any programmer I know or anyone who does a lot of work on their computer.
20-20-20
I don't remember how I found out about this 20 20 20 rule but it means, every 20 minutes look for 20 seconds at something 20 feet away, and my parents would always tell me that the amount of time I spend on my laptop is unhealthy, so I made an app for the 20-20-20 rule. The app makes a small box in the middle of the screen that counts down for 3 seconds as a warning before the 20 second full screen box appears, on top of every app until it finishes. Pressing ESC skips the 20 second countdown. I compiled the app to an exe file to allow it to work for people without having to install python.Challenges
I used python and pygame which I was very experienced with at the time I made this, so I didn't stuggle in anything except making the 20 second countdown appear on top of everything, which was new to me, but wasn't a big deal.Technical Details
I used Python and the library Pygame to create a window and draw things on it.Extra
I really liked this app and I always have it running. I also send it to any programmer I know or anyone who does a lot of work on their computer.
2D Raycasting Experiment
I was really amazed by how 3D raycasting can make really beutiful renders of realistic looking things, showing the reflections and shadows amazings. So I made this 2D experiment hoping to later make a 3D one.
I draw a lot of lines (rays) in a 360 degree radius around the character (The blue circle) and if a ray hits a wall and the rays before or after it also hit a wall I draw the part of the wall between the two rays
Challenges
I also used google's cloud functions in this project (suffered from it in my project KalemGPT). Because it is pretty cheap, I still suffered, but this time I was more efficient, I did learn from my mistakes and use firebase realtime database(To store collected emails and login ids) instead of google cloud realtime database and I used firebase authentication to allow users to make accounts.
Technical Details
I used HTML, CSS, and JavaScript for this, I used Google's Cloud Functions and the Firebase Realtime Database for making accounts and talking to the Yelp api
Extra
I learnt at this point that verifying a project before making it is important and intend to do that from now on before starting any big project.
2D Raycasting Experiment
I was really amazed by how 3D raycasting can make really beutiful renders of realistic looking things, showing the reflections and shadows amazings. So I made this 2D experiment hoping to later make a 3D one. I draw a lot of lines (rays) in a 360 degree radius around the character (The blue circle) and if a ray hits a wall and the rays before or after it also hit a wall I draw the part of the wall between the two raysChallenges
I also used google's cloud functions in this project (suffered from it in my project KalemGPT). Because it is pretty cheap, I still suffered, but this time I was more efficient, I did learn from my mistakes and use firebase realtime database(To store collected emails and login ids) instead of google cloud realtime database and I used firebase authentication to allow users to make accounts.Technical Details
I used HTML, CSS, and JavaScript for this, I used Google's Cloud Functions and the Firebase Realtime Database for making accounts and talking to the Yelp apiExtra
I learnt at this point that verifying a project before making it is important and intend to do that from now on before starting any big project.In this project I wanted to understand how to make 2d raycasting to understand sin and cos and atan and be one step closer to being able to understand physics engines
AI Pong
I wanted to understand AI so I decided to make AI learn to play pong using a python library called neat
Aimbot
I decided to make a bot to destroy this aimbooster website because I wanted to learn how to automate mouse movement depending on what's on the screen and because it's cool
Challenges
I faced a lot of weird unexpected challenges though, one of them was that the bot would click 2 times on most targets (in the image with 50% accuracy), even if the game said that it's running on 60 fps and I set the bot to run on 30, it clicks on most targets two times, so it seems like the game checks for clicks at around 5 frames per second, but if I make the bot run on 5 fps it would be too slow, especially because I need 1 frame for every target to wait for it to dissapear because I don't want to click it multiple times and finding out what the diameter of the sphere is would be too slow because the diamater gets bigger then smaller over 3 seconds
So, I decided to find out the maximum size of any circle, around 70 pixels and whenever the bot clicks at any point it excludes a 140px by 140px square in the next frame with that point as it's center, the square is 140 by 140 because the bot doesn't know where in the circle it clicked, center, right, bottom, etc. (And the result is in the other image) (the accuracy was 100% but pressing the button to take the screenshot got identified as a click)
When I run the bot with 10 targets per second it seems to be doing good at the start but then random drop frames start happening and the fps gets worse as the bot fails to click more and more targets until targets get removed after being clicked by 1 second and all of my pain and suffering turn out to be useless.
Technical Details
I used python for this project and I used the libraries: win32api for clicking, win32con for mouse event values and pyautogui for taking screenshots
Extra
Note that the images have a lot of unclicked circles in them because I have to stop the bot to take a screenshot
Aimbot
I decided to make a bot to destroy this aimbooster website because I wanted to learn how to automate mouse movement depending on what's on the screen and because it's coolChallenges
I faced a lot of weird unexpected challenges though, one of them was that the bot would click 2 times on most targets (in the image with 50% accuracy), even if the game said that it's running on 60 fps and I set the bot to run on 30, it clicks on most targets two times, so it seems like the game checks for clicks at around 5 frames per second, but if I make the bot run on 5 fps it would be too slow, especially because I need 1 frame for every target to wait for it to dissapear because I don't want to click it multiple times and finding out what the diameter of the sphere is would be too slow because the diamater gets bigger then smaller over 3 seconds So, I decided to find out the maximum size of any circle, around 70 pixels and whenever the bot clicks at any point it excludes a 140px by 140px square in the next frame with that point as it's center, the square is 140 by 140 because the bot doesn't know where in the circle it clicked, center, right, bottom, etc. (And the result is in the other image) (the accuracy was 100% but pressing the button to take the screenshot got identified as a click) When I run the bot with 10 targets per second it seems to be doing good at the start but then random drop frames start happening and the fps gets worse as the bot fails to click more and more targets until targets get removed after being clicked by 1 second and all of my pain and suffering turn out to be useless.Technical Details
I used python for this project and I used the libraries: win32api for clicking, win32con for mouse event values and pyautogui for taking screenshotsExtra
Note that the images have a lot of unclicked circles in them because I have to stop the bot to take a screenshot
A Whatsapp Bot
A whatsapp bot that takes a list of messages and sends them to a selected person, I learned how to parse html to be able to select certain elements and use them
Bezier Curves
A Program to experiment with bezier curves, understand how they work and learn more maths to be able to understand technical things better
Chess
Chess!
Cloth Simulation
A cloth simulation to better understand and maneuver physics engines, You start and stop the simulation, you can add points and lines and remove lines
Controlled Sacrifice
A 2D platformer made in a game jam, with 8 levels, whenever you lose a life you need to choose a debuff, half gun damage, lose equipped gun, things like this, when all of the 9 debuffs are used you lose
Multiplayer rps
Rock Paper Scissors but multiplayer, this teached me a lot about networking, but it's multiplayer for players on the same network
My Own IDE
This is an unfinished attempt at making my own IDE
A*
The A* pathfinding algorithm to understand pathfinding and improve my technical thinking
Server Test
An experiment to try to make my laptop run my server and make anyone be able to connect to it
Sorting Algorithms
4 sorting algorithms to understand how to optimize things and improve my technical thinking