PERSONAL PORTFOLIOENGINEERING / ACROSS THE STACK

// HELLO, I’M SANTOSH.
SENIOR FULL-STACK DEVELOPER.

Santosh Ray.

Full-stack engineer.
Architecture to interface.

I turn complex business problems into clear, working software. Frontend, backend, cloud—and the details that make them work together.

Currently at SAVARI
REACT / NEXT.JSTYPESCRIPTTAILWIND / CONVEX
santosh / portfolio
portfolio architecture.ts
// A small request. Every layer connected.
const request = { text: "A clearer workflow." };
validate(request);
store.save(request);
return response.created(request);
REQUEST / THROUGH THE STACKLOCAL SAMPLE
  1. 01UI
  2. 02Validate
  3. 03API
  4. 04Store
  5. 05Reply
SAMPLE STORE 0Waiting for a valid request.

Follow a sample request through the stack.

PORTFOLIO SHORTCUTS

Explore a file above. Or use a shortcut below.

mainUTF-8 TypeScript

Curious how this works? Inspect and customize the components.

SCROLL TO EXPLORE
01 / WHAT I BUILD

Selected work.
Built across the stack.

A live personal product.
Professional engineering experience.

PROFESSIONAL WORK / SAVARIDecember 2025–Present

Senior Full-Stack Developer

Connected workflows. Consistent records.

At SAVARI, I build customer interfaces, financial workflows, reporting, and integrations. My focus is clear interactions, consistent data, and dependable operations.

SAVARI company website
Explore my engineering workInterfaces, business rules, and connected data.
// FOLLOW THE CONNECTIONSELECT A NODE / EXPLORE MY WORK
INTERFACE → RULES → RECORDS → FEEDBACK
Play a connected workflowSYNTHETIC DATA / LOCAL SIMULATION
ONE ACTION / CONNECTED RECORDS

Every view should tell the same story.

A sample credit changes an invoice, its booking balance, and the ledger. Watch the map above, then compare the records below.

This example accepts positive whole units, up to the outstanding balance.

04 / FEEDBACK

Apply a sample credit and follow its path through the map.

SAMPLE-01 / INVOICE
Invoice balance

800units

Outstanding

SAMPLE-01 / BOOKING
Booking balance

800units

Outstanding

SAMPLE-01 / LEDGER
Ledger balance

800units

  1. Opening charge+800

Simplified in-memory illustration, with fictional records and sample rules. It does not represent SAVARI’s internal architecture or call any service. Reload clears sample changes.

Read my settlement contribution
INTERFACE / ENGINEERING SCOPE

Make complex work feel clear.

Customer and operator interfaces that make progress, balances, and next actions understandable.

ReactNext.jsTailwind CSS
My contribution
Build responsive screens, useful filters, and clear loading and feedback states.
Engineering approach
Keep the information on screen consistent with the rules behind it.
// DECISIONS BEHIND THE WORK

The details that make it hold together.

Open a story to follow the problem, my contribution, and the engineering choice.

01
An invoice view people can act on.
Customer experience
The problem
People need to understand payment progress and the next available action.
My contribution
Built responsive customer invoice interfaces and improved filtered lists and loading feedback.
Engineering decision
Use consistent rules for summaries and visible records, with clear feedback while data loads.
Implementation & verification
Interface checks cover filters, pagination, and recovery after a failed read.
02
Connected views should tell one story.
Financial workflows
The problem
Related financial views need to agree after a payment or adjustment.
My contribution
Improved reconciliation across connected financial records.
Engineering decision
Validate changes before applying them and preserve the history needed to explain a balance.
Implementation & verification
Regression checks exercise connected balances and invalid changes.
03
Reports grounded in the records.
Reporting
The problem
Reports need consistent calculations and understandable preparation states.
My contribution
Worked on ledger-based balance calculations and reporting interfaces.
Engineering decision
Separate calculations from presentation and read large datasets in bounded batches.
Implementation & verification
Model and backend checks connect report calculations to their source records.
04
Automation with clear conditions.
Scheduled workflows
The problem
Scheduled actions need to run under the intended conditions without duplicate work.
My contribution
Implemented reminder automation across the interface and backend.
Engineering decision
Make timing and eligibility explicit, and account for retries and time zones.
Implementation & verification
Focused checks cover scheduling conditions and repeated actions.
05
Make integration state understandable.
IntegrationsIN DEVELOPMENT
The problem
An integration can be waiting, running, or require attention.
My contribution
Contribute to integration architecture and explicit operation state.
Engineering decision
Separate shared workflow rules from external adapters and make uncertain outcomes visible.
Current stage
Ongoing engineering work; described as a contribution in progress.

Public engineering summaries. The playable example uses synthetic data.

View experience
Read all three layers

Interface · Make complex work feel clear.

Customer and operator interfaces that make progress, balances, and next actions understandable. Build responsive screens, useful filters, and clear loading and feedback states.

Approach: Keep the information on screen consistent with the rules behind it.

React · Next.js · Tailwind CSS

Logic · Give the workflow clear boundaries.

Financial actions and scheduled workflows need explicit rules and predictable outcomes. Work on financial consistency and workflow automation across connected product features.

Approach: Validate changes at the boundary and make repeated actions safe.

TypeScript · Convex

Data · Keep every view in agreement.

Operational views and reports need a coherent account of the underlying records. Build ledger-based reporting and contribute to integration work.

Approach: Keep state explicit, retain meaningful history, and distinguish pending work from confirmed results.

Convex · TypeScript

02 / EXPERIENCE

The work.
The experience.

From full-stack development to engineering leadership.

December 2025–PresentCURRENT ROLE

Senior Full-Stack Developer

SAVARI

Building customer interfaces, financial workflows, reporting, and integrations with React, Next.js, TypeScript, Tailwind CSS, and Convex.

ReactNext.jsTypeScriptTailwind CSSConvex
Explore my work at SAVARI
2024–November 2025

Senior Software Engineer

Nitor Infotech (Ascendion)

Enterprise modules with Vue, Nuxt, and Java; micro-frontend architecture; CI/CD; API and UI automation; collaboration across QA, architecture, and product.

2021–2024

Senior Software Developer

Prodo Technologies

React and Next.js modules, interface optimization, role-based access, workflow automation, code reviews, and architecture decisions.

2020–2021

Software Developer

Nile Technologies (Genpact)

Vue and TypeScript enterprise modules, API-driven dashboards, and production support.

2019–2020

Full Stack Developer

Rewoke Technology

Node.js and AWS Lambda APIs, React and Vue applications, and WebRTC communication systems.

03 / THE TOOLKIT

Tools I use.
Experience behind them.

Select a tool. Follow it to experience,
a decision, or a working example.

EVERY LAYER HAS A PURPOSE
SAVARI + personal project · SiteBahi

Interfaces with a product behind them.

At SAVARI, I use React for responsive customer invoice screens and connected operator interfaces. My personal project SiteBahi also shows role-specific interfaces and shared components in a live product.

  • 01Role-specific interfaces
  • 02Shared application components
  • 03Mobile-first workflows
04 / HOW I WORK

Think it through.
Then build it well.

Clear architecture. Thoughtful interfaces.
A delivery process the team can trust.

// 01

Understand the problem

Start with the people, the constraints, and the outcome. The technology follows the problem.

// 02

Connect the layers

Keep interfaces, services, and data coherent. Give each part a clear responsibility.

// 03

Build with the team

Use reviews, automation, documentation, and mentoring to make good decisions easier to repeat.

AI / ENGINEERING PRACTICE

Building with AI.

I use AI for exploration and implementation. I set the context, review the changes, protect private data, and verify the behavior before delivery.

See my review processA real portfolio change, from brief to verified result.
portfolio / interaction-revealREAL FIX · GUIDED RECONSTRUCTION
REVIEW A CHANGE

A better reveal. A reliable click.

A real correction from building this portfolio with AI: a scroll animation could move a control during a quick click. Follow the change from its brief to the evidence behind the fix.

01 / BRIEF
Define what good looks like.

Make the portfolio feel alive while keeping its controls dependable. The visual effect and the interaction both have to work.

AI ASSISTANCE
Explore motion treatments and turn the chosen direction into reusable components.
ENGINEERING DECISION
Keep normal scrolling, keyboard access, and reduced-motion support in the acceptance criteria.
THE WORKING BRIEF
# A portfolio that feels alive
 
01  Reveal relationships with motion.
02  Keep every control easy to use.
03  Respect motion preferences.
04  Verify the result in a browser.
ACCEPTANCE CRITERION

A good-looking interaction should still work at the moment someone uses it.

PREWRITTEN WALKTHROUGH · LOCAL INTERACTION
Read the full review
Brief: Define what good looks like.

Make the portfolio feel alive while keeping its controls dependable. The visual effect and the interaction both have to work.

Engineering decision: Keep normal scrolling, keyboard access, and reduced-motion support in the acceptance criteria.

AI proposal: A clean idea. An overlooked detail.

The initial implementation used a shared fade-and-slide entrance. It looked consistent, but interactive containers moved along with the surrounding content.

Engineering decision: Treat the implementation as a proposal to inspect and exercise, even when it looks convincing.

Review: Test the moment someone clicks.

Browser checks exposed missed selections during a reveal. Moving a target while someone is clicking it can make the intended action unreliable.

Engineering decision: Keep interactive targets stationary. Let headings and static content retain their movement.

Verified result: The change earns its place.

After the correction, browser checks confirmed the selections worked. The animation pass also checked keyboard access, motion preferences, responsive layouts, and both themes.

Engineering decision: Keep the behavior that has supporting evidence. A passing local check is one part of deciding what is ready to publish.

Want to look under the hood?Explore a small, interactive application model.
portrait.tsxBEHIND THE CODE
Santosh Ray
SANTOSH RAYFULL-STACK ENGINEER
05 / BEHIND THE CODE

Hi, I’m Santosh.
I connect the dots.

I'm Santosh, a senior full-stack developer at SAVARI. I've worked across enterprise applications, backend services, cloud infrastructure, and real-time systems since 2019.

I enjoy taking a complicated workflow and making it understandable. That means caring about the interface, the rules behind it, and the people who will maintain it.

Clear interfaces Explicit rules Connected systems
Read the résumé
06 / LET’S CONNECTLET’S MAKE SOMETHING USEFUL.

Have a complex problem?
Let’s make it clear.