myterial.id – Responsive e-products store for construction

So the main goal is to make a modern digital product store with our own design styling that's cheap and fast to develop and also the payment quite secure. The problem is how to achieve that? To achieve cheap development, we can press the hosting budget. So I decided to use Netlify because it's free. For email, we use Resend. For databases, we use Supabase because it's free. And for secure payment, we use Midtrans. To make it fast, we can use Vibe coding and tech stack that align with the other tools I mentioned before, like Vue.

So for the website project my role is to design and develop myterial.id website.

As a store website, the website has a Dashboard and other cool features too. Like a secret login page with password. Those features to make sure admin of the website. Which is my friend. Can manage products published while making sure he is secure too. And for the visitor I make the website have dark/light mode. I Also make the website have convety effect after buying products. Also thanks to Resend I able to make the website send the product link to their email.

The website base code is generated by AI and I anly change a bit of code. Why because the base design already included in the prompt to make the website. I include Our branding color and styling at the promt. Including the sidebar navigation in desktop view. Why? because I love sidenav design. and my parter at myterial like that too. For other design element I decide to use glashmorphism. to strengthen the modern impresion.

Althought I develop the website with Vibe Coding. But I always make sure what generated by AI is correct. Sometimes I found typo and error at the code. What I do is to fix those error manually and sometimes discuss whats error with AI. Especially the paymen process things. I test and discuss with AI to make sure payment process work well. Thanks to Midtrans sandbox features, I can test the overall payment process with ease. In deploying stage I face some problem like failed to Build in Netlify. Resend failed to connect. Custom domain not connect yet to Netlify. But I solve the problem well.

Well for overall what myterial.id webstie have achived. I as member of myterial.id can't say much. But atleast my friend like the website. And I promise to always make the website better.

Thanks to these project I learn to make website with Vue and how to press the budget. Yeah because it's my first proper Vue project. Previously I only know how to make website with React and Wordpress. And I also as myterial.id member I have responsibility to keep Improving the website.