Vendora

DEVLOG #10:
I just wrote the readme for the vendora and honestly it took more time than i expected lol.
the closing note is probably my favourite part. just being honest that this was built in between study sessions not as an assignment but just to keep building consistently even during a busy period. not perfect, never meant to be, but it works and it feels real and that is enough.
DISCOUNT CODES:
DISCOUNT30 or discount30

DEVLOG #9:
So this one is more of a polish and cleanup update than a feature drop but honestly these kinds of updates matter just as much if not more because a broken ui can make even the best features feel bad to use so let me get into it.

1. fixed the cart alignment mess that was bugging me for so long. the clear button was just floating off to the side doing its own thing, and the bill summary had no real structure. so i rebuilt the whole cart layout.
2. Also got rid of that horrible horizontal scroll in the cart. that was probably the most annoying thing in the previous version honestly. you’d add a few items and suddenly you’re scrolling sideways through some tiny strip just to see what’s in your cart, felt so clunky. now cart items stack vertically in a scrollable column, so you just scroll down. much better.
3. fixed the payment screen with the alignment of the items inside that div.
4. Aligned that loading bar in the middle.
5. In the review page also I fixed the alignment of the elements to the center and just took a bit of help from ai at this part.

DEVLOG #8:
okay so this one is a big one and i am actually really happy with how things turned out this update so let me just get into it without wasting too much time.

1. I have got the discount coupon working. type DISCOUNT30 or discount30 and it takes 30% off and shows a green message. wrong code shows red. small thing but makes it feel real.
2. I built the cash payment flow. pick cash and you get a loading animation then a thank you screen. also added a 34 second countdown that auto closes if you forget. really happy with this one.
3. Added a star rating system on the thank you page. You can click any star and it fills up from 1 to that star which is the standard way ratings work. Clicking the same star again resets it back to empty. Took a bit of logic to get right but it works cleanly now.
4. Added GPay as a payment option. When you choose GPay it shows the QR code page with a 5 second countdown timer that says Pay Within. Simple but it gives the whole thing a sense of urgency which feels realistic.
5. Added a clear function that reloads the page after payment is done so everything resets back to the start.

DEVLOG #7:
This is going to be a pretty good devlog not going to lie because a lot got done and the project is honestly starting to feel like a real working vending machine now which is a great feeling so let me walk you through everything.

1. Completed all 12 product cards with full plus minus functionality. Every single product now has its own add button that switches to a quantity counter when clicked and each one properly tracks its own stock and updates the cart count in real time. Took a while to get through all of them one by one but we got there.
2. Got the cart working properly. When you add products they actually show up inside the cart box with the product image, quantity and price all displayed nicely. The cart also updates live as you change quantities which makes the whole thing feel really smooth and responsive.
3. Implemented the total price calculation. The buynow function now adds up the price of every selected product and displays the total dynamically. So every time you press plus or minus the total updates instantly which is a really satisfying thing to see working.
4. Built out the payments module and hooked it up. Clicking proceed takes you to the payments section and the total amount carries over correctly so whatever you had in the cart shows up in payments without any issues.

DEVLOG #6:
So basically i was just sitting and grinding through the product cards one by one and honestly it took longer than i expected because of some bugs that kept annoying me but we got there eventually.

1. Completed the first row of product cards. Each card has an Add to Cart button that when clicked turns into a plus minus counter which i think looks really clean honestly. Took me a while to get the layout right but i’m happy with how it turned out.
2. Got the quantity controls working. So when you press plus it adds to the cart count and updates the stock and when you press minus it does the opposite. Simple stuff but had to make sure the stock doesn’t go negative and the quantity doesn’t go above 10.
3. Fixed a couple of bugs along the way. There was a missing equals sign in the kitkat function that was throwing a TypeError and the script was being loaded twice in the HTML which was causing a re-declaration error. Funny how such small things can break everything.

DEVLOG #5:
This one is a pretty satisfying devlog to write not gonna lie because this update is mostly visual stuff and seeing things actually look good after staring at raw unstyled divs for so long is a great feeling.

1. Added a QR code to the payment section. So now when you are checking out there is a QR code that shows up which makes the whole payment flow feel a lot more realistic and polished. Small addition but it genuinely makes the project feel like an actual shop and not just a school project.
2. Styled the cart and payment div. This took more time than i expected honestly. I had to think about spacing, alignment and making sure everything looked clean and readable. But i think it came out pretty decent. Feel free to tell me otherwise i can take it.
3. Added loading animations. This is probably my favourite part of this update. Instead of things just snapping into place instantly there is now a smooth loading animation which just makes everything feel so much more alive. Little details like this make a big difference in how the whole thing feels to use.

DEVLOG #4:
This devlog is a bit of a mixed one because i spent most of the day with my head buried in the payments module which honestly was more work than i thought it would be but let’s get into it.

1. Spent a good chunk of the day building out the basic structure of the payments module. Started from the morning and just kept going. It is not pretty yet and there is no real functionality hooked up to it but the bones are there and that is what matters for now. Styling and functionality are problems for future me and honestly future me is not going to be happy about it but that is okay.
2. Completed the cart box design and i am actually pretty happy with how it turned out. It took a few tries to get the layout feeling right but once it clicked it came together nicely. Small win but i will take it.
3. Now that the payments module structure is done the next big thing on my list is styling it and then getting the actual functionality working. There is still a lot to do there but at least i know what i am walking into which is more than i can say for most things in this project honestly.

DEVLOG #3:
Short one today not going to lie but hey progress is progress and i think that counts for something so let’s get into it.

1. Added more product cards to the vending machine. The shelf is slowly filling up and honestly seeing it come together card by card is a pretty satisfying feeling. It is starting to look like an actual vending machine now and not just a sad empty box sitting on a webpage. Still more products to go but we are getting there.
2. Currently in the middle of working on the cart box and mobile responsiveness. This one is taking a bit longer than expected because getting things to look good on both desktop and mobile at the same time is a bit of a juggling act if i am being honest. Every time i fix something on desktop something breaks on mobile and vice versa. Classic. But i am figuring it out slowly and i think once it is done it is going to make the whole project feel a lot more complete and usable.

DEVLOG #2:
I actually got some visible stuff done today and seeing things show up on the screen after just staring at code for a while is always a good feeling so let’s get into it.

1. Created the product cards for the vending machine. Now they are static for the time being which i know is not ideal but i just wanted to get them on the screen first and make sure everything looks the way i want it to before i start making things dynamic. Baby steps you know. Eventually i want to pull the product data dynamically so adding or changing products does not mean i have to go digging through the HTML every single time. But that is a problem for a future devlog.
2. Added a cart button with an item count on it which i am honestly pretty happy about. It updates as you add items which makes it feel a lot more alive. Also put in stock limits so you cannot just add infinite quantities of something which makes the whole thing feel a lot more like a real vending machine and less like a free for all. Small details but they add up.

DEVLOG #1:
I am currently working a browser based vending machine. Just initialized the project. I am building this as a hobby when i get bored I work on building this. So hope you love it.