Simple python desktop application for automating repetitive web-based input tasks which load the data from a spreadsheet. developed using selenium as webdriver and pysimplegui as GUI.

The main directory structure of the project. The structure is inspired by the mix of MVC (Model-View-Controller) pattern and DDD (Domain-driven design) pattern. I will briefly explain each directory and file below. 

1. The user enters the app with the specified number of rows of data.

2. when the app starts it will get the first row with the status "NONE" (will automatically add column status with value NONE if the excel sheet doesn't have one)

3. Each row on the GUI will be updated based on the outcome after the automation is completed.

4. Excel sheet row will be updated based on the outcome after the automation is completed.

4. If the automation "FAILED", the excel sheet will be updated with the reasoning why the automation failed (ex: username is invalid,  the user doesn't exist, etc.)

5. The automation continues until there are no more rows with the status "NONE" present.

I have always had a fascination towards automation, when I was in the university I made simple automation using OCR/Image recognition for a game I played back then to automate mundane & boring stuff. Fast forward I got an opportunity to solve repetitive tasks problem which can be very time-consuming if the task is performed manually.

I started using the same technology I used since I am somewhat familiar with the requirement,  which is using OpenCV for OCR/Image recognition. Although it works great on my PC, problems start to appear when a user has different resolution to mine which ended up the app not finding the image. Not only that, the app was resource-intensive as it needs to scan the whole desktop each time the automation moved. The speed also greatly depends on the user's computer specification.

, as it targets the browser DOM directly instead of relying on images. In addition to being lightweight, it is also much simpler to wire up to a functioning condition. While the automation itself works fine, I found a new problem I had to solve which is a way to make the app user-friendly as starting the script through a code editor is not very intuitive. After a little bit of research, I came across 

, the library's abundant examples and active maintainers were huge assistance to me.

During the process, I had to deal with a variety of problems, such as authentication, project architecture, compiling the app into an executable, and many other issues. In the end, I managed to finish the project in working order. The app was being used by multiple persons, as it improved the task completion speed significantly.

Although I can't show the actual project I made as it's confidential, I am able to make a simple 

 of how the app functions. I turned off authentication if you are interested to test the demo on your own. using the mock data I made to target this 

Project Description

Simple python desktop application for automating repetitive web-based input tasks which load the data from a spreadsheet. developed using selenium as webdriver and pysimplegui as GUI.

GitHub link Video demo

Directory structure

The main directory structure of the project. The structure is inspired by the mix of MVC (Model-View-Controller) pattern and DDD (Domain-driven design) pattern. I will briefly explain each directory and file below. 

Automation workflow 

1. The user enters the app with the specified number of rows of data.

2. when the app starts it will get the first row with the status "NONE" (will automatically add column status with value NONE if the excel sheet doesn't have one)

3. Each row on the GUI will be updated based on the outcome after the automation is completed.

4. Excel sheet row will be updated based on the outcome after the automation is completed.



4. If the automation "FAILED", the excel sheet will be updated with the reasoning why the automation failed (ex: username is invalid,  the user doesn't exist, etc.)

5. The automation continues until there are no more rows with the status "NONE" present.



Afterword

I have always had a fascination towards automation, when I was in the university I made simple automation using OCR/Image recognition for a game I played back then to automate mundane & boring stuff. Fast forward I got an opportunity to solve repetitive tasks problem which can be very time-consuming if the task is performed manually.



I started using the same technology I used since I am somewhat familiar with the requirement,  which is using OpenCV for OCR/Image recognition. Although it works great on my PC, problems start to appear when a user has different resolution to mine which ended up the app not finding the image. Not only that, the app was resource-intensive as it needs to scan the whole desktop each time the automation moved. The speed also greatly depends on the user's computer specification.



I refactor everything in favor to use selenium, as it targets the browser DOM directly instead of relying on images. In addition to being lightweight, it is also much simpler to wire up to a functioning condition. While the automation itself works fine, I found a new problem I had to solve which is a way to make the app user-friendly as starting the script through a code editor is not very intuitive. After a little bit of research, I came across PySimpleGUI, the library's abundant examples and active maintainers were huge assistance to me.



During the process, I had to deal with a variety of problems, such as authentication, project architecture, compiling the app into an executable, and many other issues. In the end, I managed to finish the project in working order. The app was being used by multiple persons, as it improved the task completion speed significantly.



Demo Example

Although I can't show the actual project I made as it's confidential, I am able to make a simple example repository of how the app functions. I turned off authentication if you are interested to test the demo on your own. using the mock data I made to target this sample practice website. you can see the full video demo here.

python webinput automation GUI with Selenium and PysimpleGUI

Tour travel website that allows users to register an account and make payments online. The website includes a CMS (Content Management System) for the admin to manage the website content and orders. The website also includes a payment processing feature.

I recently made a personal project to create a travel agency website for a family member who works as a tour guide for school groups. The goal of this project was to create a prototype for a potential future website for their business and to use it as an opportunity to improve my skills in web development. Through the process of designing and implementing the website, I learned a lot about building dynamic, user-friendly websites. In this write-up, I will share my progression in making the website including the tools and technologies I used, the challenges I faced, and the lessons I learned.

For my first big personal project, I wanted to pick technologies that I was already familiar with, but also push myself to learn something new. After some consideration, I decided to go with the PHP framework Laravel, which I have some experience with it, and the CSS framework TailwindCSS, which I've been wanting to try out.

I decided to use Laravel as the framework for this project because it has a lot of useful features,  is easy to use and also and is widely used in the industry. And I'm excited to learn TailwindCSS because it's a hot new framework that a lot of people are using. I'm confident that these technologies will be perfect for the project and help me create a really cool addition to my portfolio.

these are the basic functionalities I had in my mind for the project:

Update order status with the ID parameter

View the destination with the ID parameter

Filter destinations with tag or location parameter

Order and pay for the destination with an ID parameter and date parameter

Rate destination if they have ordered the package

as for the database, I made this simple diagram as a baseline for the project.

For the web design of this project, I utilized a variety of components from the collection of free Tailwind CSS components available from

. While design is not my strongest area, these components helped me create a result that I am proud of. I am grateful for the resources and inspiration provided by this collection.

In order to stay within the scope of the project, I tried my best sticking to the plans I had laid out for features, pages, and routes. I believe it helped me to stay on track and deliver a successful final product.

During the development process, I made a change to my initial database design. Initially, I planned to handle images manually, but I discovered a package called 

 that made it easier to manage files with Eloquent models. This package also provided a range of useful functions, such as the ability to convert images to different resolutions using the 

 method. This package helped me to improve my workflow by providing useful functions that allowed me to manage files and images within the project more.

Initially, I made the decision not to use any JavaScript libraries in order to keep the project lightweight. However, in hindsight, this was a mistake as it limited my ability to learn and explore more about JavaScript and also resulted in a clunkier user experience. As I continued with the project, I struggled to find a suitable WYSIWYG library that was both modern and user-friendly without the need for a JavaScript framework.

Looking back, I realize that using a lightweight JavaScript framework like AlpineJS could have greatly improved the website's performance and user experience. In the future, I will be more mindful of the role that JavaScript plays in my projects and consider its potential benefits more carefully.

here are a little demo of how the project looks

example page of the destination package where a user can:

rate the package if the user has a history order of the package

Demo when a user has to upload proof of payment for the admin to confirm the order

Admin update status of the order if the receipt is valid.

Admin CRUD with WYSIWYG editor for destination

What to be improved from this project (roadmap)

Improve the website's user interface and user experience with JavaScript

Upgrade the WYSIWYG editor for better content creation

Offer customizable package options with different pricing options

Add image and file management capabilities

Implement a report system for tracking and analysis

Optimize the website for search engine optimization

Add social media authentication options (Facebook, Google, Twitter)

Integration with marketing and analytics tools

What I learn & want to improve myself from this project

I noticed that I often forgot my work plan and jumped between tasks. To improve this, I will create a more organized plan by making lists of the tasks I want to complete and breaking them down into smaller, achievable pieces. This will help me stay on track and focus on one task at a time.

Use Git branches: In this project, I pushed everything into the main branch, which became messy at times. To improve my workflow, I will utilize Git branches more effectively and create a plan for how I will use them in my workflow. I will keep in mind the importance of learning more about Git and improving my skills in this area."

Improve code readability: Code readability is something I want to improve over time. To do this, I will follow best practices and standards for writing clean, readable code, and consider taking a course or working with a mentor to learn more.

Although the project was relatively simple, I encountered many problems that I had to solve, which helped me learn and grow as a web developer. Although it is not yet finished, I am proud of what I have accomplished and am excited to include it in my portfolio. Thank you for reading.

Technologies: PHP, MySQL, Laravel, TailwindCSS

GitHub | Demo

summary of the project (TL;DR Version)

Tour travel website that allows users to register an account and make payments online. The website includes a CMS (Content Management System) for the admin to manage the website content and orders. The website also includes a payment processing feature.

Background

I recently made a personal project to create a travel agency website for a family member who works as a tour guide for school groups. The goal of this project was to create a prototype for a potential future website for their business and to use it as an opportunity to improve my skills in web development. Through the process of designing and implementing the website, I learned a lot about building dynamic, user-friendly websites. In this write-up, I will share my progression in making the website including the tools and technologies I used, the challenges I faced, and the lessons I learned.

Choosing technologies

For my first big personal project, I wanted to pick technologies that I was already familiar with, but also push myself to learn something new. After some consideration, I decided to go with the PHP framework Laravel, which I have some experience with it, and the CSS framework TailwindCSS, which I've been wanting to try out.

I decided to use Laravel as the framework for this project because it has a lot of useful features,  is easy to use and also and is widely used in the industry. And I'm excited to learn TailwindCSS because it's a hot new framework that a lot of people are using. I'm confident that these technologies will be perfect for the project and help me create a really cool addition to my portfolio.

Database Design

these are the basic functionalities I had in my mind for the project:

Admin

Manage destinations (CRUD)

View orders and users page

Update order status with the ID parameter

User

Register for an account

View the destination with the ID parameter

Filter destinations with tag or location parameter

Update profile with username parameter

Order and pay for the destination with an ID parameter and date parameter

View and upload proof of payment

View order history

View Dashboard

Rate destination if they have ordered the package

View and upload proof of payment page

as for the database, I made this simple diagram as a baseline for the project.

Webdesign

For the web design of this project, I utilized a variety of components from the collection of free Tailwind CSS components available from Awesome things related to Tailwind CSS. While design is not my strongest area, these components helped me create a result that I am proud of. I am grateful for the resources and inspiration provided by this collection.

Development process

In order to stay within the scope of the project, I tried my best sticking to the plans I had laid out for features, pages, and routes. I believe it helped me to stay on track and deliver a successful final product.

During the development process, I made a change to my initial database design. Initially, I planned to handle images manually, but I discovered a package called media-library that made it easier to manage files with Eloquent models. This package also provided a range of useful functions, such as the ability to convert images to different resolutions using the registerMediaConversions method. This package helped me to improve my workflow by providing useful functions that allowed me to manage files and images within the project more.

problems I came across

Initially, I made the decision not to use any JavaScript libraries in order to keep the project lightweight. However, in hindsight, this was a mistake as it limited my ability to learn and explore more about JavaScript and also resulted in a clunkier user experience. As I continued with the project, I struggled to find a suitable WYSIWYG library that was both modern and user-friendly without the need for a JavaScript framework.

Looking back, I realize that using a lightweight JavaScript framework like AlpineJS could have greatly improved the website's performance and user experience. In the future, I will be more mindful of the role that JavaScript plays in my projects and consider its potential benefits more carefully.

here are a little demo of how the project looks

homepage

Destination Page

example page of the destination package where a user can:

order the destination package

check the package details

check other user reviews

rate the package if the user has a history order of the package

Demo when a user proder a package

Demo when a user has to upload proof of payment for the admin to confirm the order

Admin update status of the order if the receipt is valid.

Admin CRUD with WYSIWYG editor for destination

What to be improved from this project (roadmap)

Improve the website's user interface and user experience with JavaScript

Upgrade the WYSIWYG editor for better content creation

Offer customizable package options with different pricing options

Add image and file management capabilities

Implement a report system for tracking and analysis

Optimize the website for search engine optimization

Add social media authentication options (Facebook, Google, Twitter)

Integration with payment gateways

Integration with marketing and analytics tools

Implementation of security measures

What I learn & want to improve myself from this project

Be more organized

I noticed that I often forgot my work plan and jumped between tasks. To improve this, I will create a more organized plan by making lists of the tasks I want to complete and breaking them down into smaller, achievable pieces. This will help me stay on track and focus on one task at a time.

Use Git branches

Use Git branches: In this project, I pushed everything into the main branch, which became messy at times. To improve my workflow, I will utilize Git branches more effectively and create a plan for how I will use them in my workflow. I will keep in mind the importance of learning more about Git and improving my skills in this area."

Improve Code Readability

Improve code readability: Code readability is something I want to improve over time. To do this, I will follow best practices and standards for writing clean, readable code, and consider taking a course or working with a mentor to learn more.

Closing Statements

Although the project was relatively simple, I encountered many problems that I had to solve, which helped me learn and grow as a web developer. Although it is not yet finished, I am proud of what I have accomplished and am excited to include it in my portfolio. Thank you for reading.

My Progression in Making Travel website using laravel

Lbnursery - Ecommerce website

As a final project for my online bootcamp, I got assigned to a group of 3 and we were tasked with creating a Q&A forum website related to web development and Laravel. We were given 5 days to work and make a video demo for it. The project had several requirements, including:

Users have the ability to create an account and log in to the website.

A voting system, where users can upvote or downvote questions and answers.

All users have the ability to upvote a question or answer. and will receive 15 points if their post is upvoted.

Only users with points of 15 or higher can downvote and the owner of post get their point reduced by 1.

A tagging system, where users can add tags to their questions.

A search function, where users can search for specific questions or answers by keyword or tag.

A reputation system, where users can earn points based on their contributions to the website.

A feature where the author of a question thread can select the "right answer" and the user who provided it will be rewarded with 15 points.

Use Sweetalert library for the notification feature.

Use bootstrap CSS framework for the website design.

As we began working on this project, we quickly organized ourselves and divided the tasks among the members. As part of the requirement to make an ERD for the database, Unfortunately, I no longer have the original version of the Entity Relationship Diagram (ERD) that we created for the database. That being said, this is the final version of the ERD for the database:


Here is brief looks of how the website looks:

Working on this project was a great opportunity for me to improve my skills in web development and Laravel, as well as work as part of a team. The tasks I focused on were mainly related to the backend, which was a challenging and rewarding experience. I'm proud of the final product and happy for the chance to have worked on it.

As a final project for my online bootcamp, I got assigned to a group of 3 and we were tasked with creating a Q&A forum website related to web development and Laravel. We were given 5 days to work and make a video demo for it. The project had several requirements, including:

Users have the ability to create an account and log in to the website.

A voting system, where users can upvote or downvote questions and answers.

All users have the ability to upvote a question or answer. and will receive 15 points if their post is upvoted.

Only users with points of 15 or higher can downvote and the owner of post get their point reduced by 1.

A tagging system, where users can add tags to their questions.

A search function, where users can search for specific questions or answers by keyword or tag.

A reputation system, where users can earn points based on their contributions to the website.

A feature where the author of a question thread can select the "right answer" and the user who provided it will be rewarded with 15 points.

Use Sweetalert library for the notification feature.

Use bootstrap CSS framework for the website design.

Deploy the site to heroku.

As we began working on this project, we quickly organized ourselves and divided the tasks among the members. As part of the requirement to make an ERD for the database, Unfortunately, I no longer have the original version of the Entity Relationship Diagram (ERD) that we created for the database. That being said, this is the final version of the ERD for the database:


Here is brief looks of how the website looks:



Working on this project was a great opportunity for me to improve my skills in web development and Laravel, as well as work as part of a team. The tasks I focused on were mainly related to the backend, which was a challenging and rewarding experience. I'm proud of the final product and happy for the chance to have worked on it.

My Experience Building a Laravel Forum for My Online Bootcamp

Webinput automation desktop GUI

Lbursery is a company focused on online retail, selling plants, seeds, and garden tools. The website is using sanity as CMS, initially using Shopify as the backend. NextJS & Tailwind for the front end.

Lbnursery - Garden ecommerce

tour travel website agency where users can register an account and order a destination package with the desired date. The user has to provide proof of payment to make the order valid.

Aizhatravel - Travel tour agency

Final project for online bootcamp about Laravel, tasked to make a website about Q 
& A like quora where a user can asks, answers and votes (like or dislike) toward questions & 
answers

Howdy, I’m Fadil S Hardy

Fadil S Hardy

Little About Me

Frontend

Backend

I am also familiar with

Projects