TEST
6/3/2026, 8:09:18 AM
Traceraft
Preparing your workspace...
Public profile
Product Engineer
@yt_techdev
React/Next
Premium feature
2025-06-01 — 2026-06-04
Total
18 activities
Active days
12 days
Longest streak
2 days
Trace history
11 total
6/3/2026, 8:09:18 AM
Do not retrieve all records and filter them on the application side. Define conditions in the DB query and fetch only the necessary data. This improves both performance and security.
Use WHERE, SELECT, ORDER BY, and TAKE to clarify who needs the data, which fields are required, how many records to return, and in what order.
Good queries reduce waste and help the system scale.
userIdA userId sent from the client should not be trusted.
The server should get the authenticated user from the session or auth system, then decide what data the user can access.
The client should handle UI behavior, such as clicks, inputs, animations, and local state. The server should handle DB queries, authentication, authorization, billing checks, and admin checks.
Do not store members as a simple array.
Use a relationship table like project_members to represent the connection between users and projects.
Relationship tables should store not only user_id and project_id, but also fields like role, status, and joined_at.
This makes permissions and membership states easier to model.
Do not fetch data first and decide later. Design access rules, permissions, data amount, and data shape before retrieving records.
5/22/2026, 5:54:01 AM
Update Details
This update mainly focuses on preparing Traceraft for paid features and improving the legal/navigation structure around the app. While this isn’t a flashy feature update, it is an important step toward making Traceraft more stable, trustworthy, and ready for future monetization.
5/22/2026, 5:44:53 AM
A short reflection on building interactive 3D UI with React Three Fiber.
For this project, I created an interactive page using Next.js/React, Tailwind CSS, Framer Motion, R3F, and other tools.
I struggled quite a bit until I began to understand whether the issue I was facing with R3F fell under front-end or back-end responsibilities. That’s because, from an R3F perspective, it seems like the camera is rendered on a per-frame basis, so in terms of how it’s implemented, it falls squarely within the backend’s domain. I think it’s hard to convey just how difficult this is without actually trying it out.
5/17/2026, 9:38:16 AM
R3F can be written with React, but the actual objects being controlled are Three.js objects such as Scene, Mesh, Geometry, Material, and Camera. Because of that, applying normal React UI responsibility separation directly to R3F can make things fragile. useFrame, refs, buffers, mode transitions, and initialization order are often tightly connected.
useFrame, refs, buffers, or mode transitions.The important point is that R3F has different responsibility boundaries from normal React. Normal UI should be separated declaratively. Inside an R3F Scene, stability and direct control of Three.js objects are more important. Especially when particles, buffer attributes, mode transitions, and useFrame are involved, keeping the logic together can be safer than splitting it too aggressively.
useFrameR3F should be treated as a React-based interface for controlling Three.js, not as ordinary React UI.
5/7/2026, 2:33:13 PM
Hey! Come to think of it, I forgot to update my Instagram, and I’ve been spending all my time thinking about the layout of my portfolio page! I had something I built with React before, but I figured, “If I’m going to build it anyway, I want to make it a 3D interactive page!” So I took this opportunity to try out Blender and Meshy AI! 3D web design is tough because there’s so much more to consider compared to regular web design.
Especially with R3F, it’s a completely different approach from front-end development, so I realized I need to study that as well! I’m implementing it while I learn.
5/1/2026, 10:24:30 AM
Hey there! Lately, I’ve been really into creating 3D animations. Since 3D is a completely new field for me, I decided to give it a try, but I’ve found the calculations to be really challenging. So, I’m currently studying the basics, like terminology and vector calculations.
Also, with security being such a hot topic lately, I took the opportunity to review this app’s security and fix some bugs. It’s so much fun working on 3D animations that I tend to get sidetracked, but I’m making sure to prioritize the public app! lol
P.S. Later on, I had GPT teach me how to use tools like Meshy AI and Blender, and I used them to create my own character—the results were pretty impressive, lol. Honestly, if I were to do everything on my own, it would take a lot of time to go through reference books and watch videos just to get the hang of things. But when I ask GPT about parts I don’t understand—even while I’m creating a new branch—it explains things thoroughly. It really makes me realize how much easier it is to learn now!
We’re living in an era where you can acquire a decent level of skill just by being motivated, so it’s really
4/24/2026, 4:59:48 AM
This app, which I introduced the other day, is designed to help you reflect on what you’ve built up as we enter the age of AI. In a sense, it’s an app that lets you trace the path of your development log. This is because we’re entering an era where creating apps will become increasingly easy. However, it’s not just about building an app and calling it a day; this app helps you visualize the various lessons learned, areas for improvement, and other aspects of your progress.
I also run a variety of personal blogs, so please feel free to check them out. Myblog & portfolio
4/16/2026, 12:42:40 PM
I recently got back into web development. Before this, I was working mostly on the backend side in a legacy Java environment with little to no documentation, so it had been quite a while since I last used Next.js.
That said, I keep studying web app architecture regularly, so I was able to approach the design side pretty much the same way I always do.
This time, I built the app with the latest version of Next.js (16.2.3). Sure, there were some tricky parts here and there, but honestly, it was more fun than difficult. lol
One of the main reasons I wanted to build this app is that, in the AI era, building apps is definitely going to get easier. At the same time, though, it may become harder to make personal growth visible. That’s why I made this app: to help track where you got stuck, what you learned, and the path your development took, whether you’re vibe coding or building things more traditionally.
I’m running this project entirely on my own, so if you have any requests, ideas, or feedback, feel free to contact me through the contact page.
4/16/2026, 12:34:23 PM
4/12/2026, 10:52:20 AM