I design and build interfaces for data-driven organizational and educational systems with React and TypeScript, and contribute to the back-end when a product needs it.با React و TypeScript، رابط‌های کاربری سامانه‌های داده‌محور سازمانی و آموزشی را طراحی و توسعه می‌دهم و در صورت نیاز محصول، در بک‌اند هم مشارکت می‌کنم.
// Custom hook + TanStack Query
export function useRole() {
const { data } = useQuery({
queryKey: ["me"],
queryFn: fetchCurrentUser,
});
return data?.role ?? "guest";
}// Role-based protected route
export function Guard({ allow, children }) {
const role = useRole();
return allow.includes(role)
? children
: <Navigate to="/login" replace />;
}export const profile = {
name: "Erfan Khoshtabkh",
role: "Front-End Developer",
stack: ["React", "TypeScript", "Tailwind"],
founder: "GeekTest",
} as const;I’m a front-end developer with hands-on experience designing and implementing user interfaces and managing data in organizational and educational systems, including a smart school platform, a smart counseling platform and a data-monitoring system.توسعه‌دهنده فرانت‌اند هستم و در طراحی و پیاده‌سازی رابط‌های کاربری و مدیریت داده در سامانه‌های سازمانی و آموزشی تجربه عملی دارم؛ از جمله سامانه مدرسه هوشمند، پلتفرم مشاوره هوشمند و سامانه پایش مسیر داده.
As the founder of GeekTest, I led the product from idea to development: defining the vision, choosing features, prioritizing the roadmap, building the front-end with React and TypeScript, and contributing to key back-end features.به‌عنوان بنیان‌گذار GeekTest، محصول را از ایده تا توسعه هدایت کرده‌ام: تعریف چشم‌انداز، انتخاب قابلیت‌ها، اولویت‌بندی توسعه، پیاده‌سازی فرانت‌اند با React و TypeScript و مشارکت در قابلیت‌های کلیدی بک‌اند.
I care about maintainable code, clear architecture (SOLID, reusable hooks and components) and products shaped by real user needs.به کد قابل نگهداری، معماری شفاف (اصول SOLID، هوک‌ها و کامپوننت‌های قابل‌استفاده‌مجدد) و محصولاتی که بر پایه نیاز واقعی کاربران ساخته می‌شوند اهمیت می‌دهم.
Component-driven interfaces built with React, TypeScript and Tailwind CSS, with structured routing, state management and form validation.رابط‌های کامپوننت‌محور با React، TypeScript و Tailwind CSS، همراه با مسیریابی ساختارمند، مدیریت وضعیت و اعتبارسنجی فرم.
Reporting modules, dashboards, digital report cards and role-based access for organizational and educational platforms.ماژول‌های گزارش‌گیری، داشبورد، کارنامه دیجیتال و کنترل دسترسی نقش‌محور برای پلتفرم‌های سازمانی و آموزشی.
Defining product vision, scoping features and prioritizing development, from idea to delivery, as founder of GeekTest.تعریف چشم‌انداز محصول، تعیین قابلیت‌ها و اولویت‌بندی توسعه از ایده تا تحویل، به‌عنوان بنیان‌گذار GeekTest.
A small interactive sample of patterns I use in real systems: local state and role-based rendering.نمونه‌ای کوچک از الگوهایی که در سامانه‌های واقعی استفاده می‌کنم: مدیریت وضعیت و نمایش بر اساس نقش.
const [count, setCount] = useState(0);
const [admin, setAdmin] = useState(false);
return (
<>
<Counter value={count} />
{admin && <AdminPanel />}
</>
);