Waikit Kan /index
← back to /notes

Vibe coding

1 min read

Vibe coding a super powerful if you know how to use it but as a no-coder, how can I use it effectively? For devs, vibe coding can10x your productivity, but for no-coders, sometimes it can seem like magic, other times it seems like a frustrating black box.

My context is creating a web application that utilises AI, here are my learning from vibe coding:

  • You don’t need to vibe code the full stack, use other tools and products to help you do what you need.
  • Be very specific on what you tell the AI, if you want something done in the frontend, tell it specifically to do it as HTML, CSS or JS and ask it to use or not use a library or framework.
  • Give details on what you want, you can do this by understanding how something is built.
  • You don’t need to learn to code, but you need to learn the technology. It’s not magic, it’s logic. I was vibe coding something with 3d, I knew I had to use canvas and I knew I had to use a framework like three.js or model viewer. Reading the documentation helps provide you the lexicon to communicate effectively for the AI the understand better what you’re trying to do.
  • It’s like going deep but not that dee. Say I want to be able to import 3d objects to a page and rearrange the objects.
    • Not deep: I need 3d files and write code so that it can show up on the browser and add controls to manipulate it
    • A bit deep: I will need a 3d file and import it with HMTL and it will render on a canvas
    • Very deep: I will need to support importing .glb files and use three.js to help me render the objects in the scene, I will use ambient lighting and mesh on objects to create a lighting, the camera controls needs to be in HMTL, and etc
  • vibe coding
  • no code