• Portfolio Browser — Seamless Transition Image and Text Using GSAP

    GSAP really usefull to create animation and transition, I’m inspired by Seamless slider transition. I Try to recreate and add some custom animation like staggered transition image. See the Pen Portfolio Browser by Rio Chandra (@Rio-Chandra) on CodePen. I will not go to detail and explain code-by-code. But I will explain what obstacle I face…

  • Modern Border Gradient With Tailwindcss

    Border in css is boring just because can’t be gradient. Developer do much thing to make it not boring, codyhouse, digitalocean and community dev. But it have trade-off, the border can’t be rounded. Border gradient is modern design when comes to web design, sometimes it mimic how glass works. Let see how we re-create this…

  • Indicator Navigation Animation: Using GSAP and tailwindcss

    Day 1 create navigation indication animation, inspired by this page. I love how moving around the indicator of nav bar. I re-create this using vite, tailwind and gsap. First of all, I create html code And then, these basic structure is enough with nav-indicator as button–moving–thing. and then I add javascript script to make it…

  • Library: React Blob Viewer

    React Blob Viewer is library that I created to show blob data into page instantly using reactjs. For example: Using this library, you have no worries about handle different type of data. If you have unique type file, excel for example. I have add callback to give you option to handle unique cases.

  • ARUA: Responsive Money Management

    ARUA (Arus Uang) is an application money management initate by my wife and my self to manage our outcome. It included all basic money management: Web based application is easy to use, doesn’t required to install application, instant page load and useful feature. It’s built in react js and nest js, everything is Single Page…

  • Templix: Boilerplate Node.js Typescript

    Templix is a boilerplate to setup a full project! It has all basic feature to speed up your development using node.js typescript It’s a growing list to setup a fresh project, but with templix you can quick setup the project!. Why using boilerplate? Boilerplate accelerate initiation project, write everything from ground to up will take…

  • Perkembangan AI dan Pengganti Manusia

    Aku lebih suka sebut LLM Aku selalu mengikuti perkembangan teknologi, AI (Artificial Intelligence) yang sering dimaksud adalah chatgpt, gemini, atau grok yaitu sebuah aplikasi yang menjadi jembatan pengguna kepada LLM (Large Language Model). Asal dari kemampuan berpikir itu adalah LLM. Sedangkan AI sendiri punya banyak cabang, seperti Neural Network, Deep Neural Network, Algoritma Rekomendasi, Algoritma…

  • Kenapa ganti visual grafik di aplikasi keuanganku?

    Visual grafik memberikan informasi dari data, tapi visual yang buruk membuat informasi yang sebenarnya bermanfaat tidak mudah ditangkap oleh pengguna. Aplikasi keuangan punya banyak data yang bisa divisualkan, salah satunya adalah arus kas. Gambar dikiri adalah grafik pertama aku buat untuk merepresentasikan arus kas keuangan. Tetapi grafik ini tidak menjelaskan apapun selain penurunan keuangan, terlalu…