RefactorFlow

From passing tests to thinking better - that's RefactorFlow

Comment

RefactorFlow

Inspiration

Most coding platforms tell learners only whether their answer passed or failed. They do not show how someone approached the problem: where they paused, rewrote their logic, got stuck, or found a productive flow.

RefactorFlow was inspired by the idea that a developer’s process matters as much as the final solution. I wanted to build a coding-practice platform that helps learners understand their problem-solving habits, not just collect completed exercises.

What it does

RefactorFlow is a behavioural coding-practice platform for Python challenges.

A user can choose a challenge, work in a focused Monaco editor, and submit their solution for testing. During the session, RefactorFlow captures a coding trail: meaningful edits, rewrites, pauses, timing, and completion behaviour. After submission, the user receives a session report that turns that activity into understandable feedback.

The current platform includes:

  • Python challenges across beginner, intermediate, and advanced levels
  • Timed coding sessions in a distraction-free editor
  • Secure code execution against private tests
  • Session reports with coding-trail and behavioural insights
  • Authentication, profiles, settings, dark mode, progress, and session history

How I built it

I built RefactorFlow with Next.js 15, Supabase, and Monaco Editor. Supabase handles authentication, challenge data, tests, profiles, and session information.

For safety, submitted Python code is not executed inside the web application. Instead, RefactorFlow sends it to a separate execution service that creates an isolated Docker container, runs the challenge tests, returns the results, and removes the container afterwards. This keeps untrusted user code separate from the main platform.

I used Codex with GPT-5.6 throughout the build to accelerate implementation, refine the interface, debug Next.js and deployment issues, design the database-backed challenge system, and improve the secure execution workflow.

Challenges I faced

The biggest technical challenge was making code execution safe. Running arbitrary code directly in a web app would create a serious security risk, so I designed the execution flow around short-lived isolated Docker containers.

Another challenge was making behavioural data useful rather than overwhelming. A raw list of every keystroke is not helpful by itself, so I focused on recording meaningful editing events and presenting them as a readable coding trail and session report.

I also spent significant time improving the experience of the challenge environment. The editor needed to feel focused and familiar, while still giving learners useful feedback without distracting them from solving the problem.

What I learned

Building RefactorFlow taught me how product design, developer experience, security, and learning outcomes all connect. I learned more about secure execution architecture, Supabase-backed application design, session tracking, Docker isolation, and building a polished full-stack experience with Next.js.

Most importantly, I learned that developer tools can be more supportive when they explain the journey behind the answer. RefactorFlow is my first step toward making coding practice more reflective, personal, and useful for learners.

Built With

Share this project:

Updates