-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathindex.html
More file actions
380 lines (361 loc) · 22.5 KB
/
Copy pathindex.html
File metadata and controls
380 lines (361 loc) · 22.5 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>Amil Mirzayev — Senior Frontend Engineer</title>
<meta name="description" content="Amil Mirzayev — Senior Frontend Engineer with full-stack experience. React, Next.js, TypeScript, Node/NestJS. Geospatial analytics, high-traffic iGaming, enterprise systems." />
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin="anonymous" />
<link href="https://fonts.googleapis.com/css2?family=Newsreader:ital,opsz,wght@0,6..72,300..600;1,6..72,300..500&family=Instrument+Sans:wght@400;500;600&display=swap" rel="stylesheet" />
<link rel="stylesheet" href="styles.css" />
<link rel="icon" href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'><text y='.9em' font-size='90'>👨💻</text></svg>" />
</head>
<body>
<div class="container">
<nav class="nav">
<a href="#top" class="nav-logo">Amil Mirzayev</a>
<div class="nav-links">
<a href="#work">Work</a>
<a href="#experience">Experience</a>
<a href="#stack">Stack</a>
<a href="#about">About</a>
<a href="#contact">Contact</a>
</div>
</nav>
<header id="top" class="hero">
<div>
<div class="badge">
<span class="badge-dot"></span>
Open to senior / lead roles & contract work
</div>
<h1 class="hero-title">
I build the front of large products — and the <em>systems</em> that keep them fast.
</h1>
<p class="hero-lede">
Senior Frontend Engineer with full-stack experience — 6+ years across geospatial analytics, high-traffic iGaming, enterprise data-exchange systems, real-time industrial dashboards and full-stack admin platforms.
</p>
<p class="hero-sub">
React, Next.js, TypeScript, Node/NestJS. Strong in frontend architecture, system design, REST/GraphQL contracts, performance and release management — owning features from discovery through production launch.
</p>
<div class="hero-actions">
<a href="mailto:amilamil1999@icloud.com" class="btn btn-dark">Get in touch</a>
<a href="uploads/CV-Amil-Mirzayev.pdf" target="_blank" rel="noopener" class="btn btn-outline">Résumé — product / iGaming</a>
<a href="uploads/CV-Mirzayev.pdf" target="_blank" rel="noopener" class="btn btn-outline">Résumé — enterprise</a>
</div>
</div>
<aside class="card current-card">
<div class="eyebrow">Currently</div>
<div class="current-role">Senior Frontend Developer</div>
<div class="current-org">2GIS PRO / URBI — geospatial analytics platform</div>
<div class="fact-list">
<div class="fact-row"><span>Based in</span><span>Antalya, Turkey</span></div>
<div class="fact-row"><span>Email</span><a href="mailto:amilamil1999@icloud.com">amilamil1999@icloud.com</a></div>
<div class="fact-row"><span>Telegram</span><a href="https://t.me/front_mirzoev">@front_mirzoev</a></div>
<div class="fact-row"><span>GitHub</span><a href="https://github.com/dropex7">dropex7</a></div>
<div class="fact-row"><span>LinkedIn</span><a href="https://www.linkedin.com/in/amil-mirzayev/">amil-mirzayev</a></div>
</div>
</aside>
</header>
<section id="work" class="section section-work">
<div class="section-head">
<h2>Selected work</h2>
<span class="section-note">Four projects</span>
</div>
<article class="case">
<div>
<div class="case-num">01 — Geospatial analytics</div>
<h3 class="case-title">2GIS PRO / URBI</h3>
<div class="case-role">Senior Frontend Developer</div>
<p class="case-desc">A B2B geoanalytics and big-data visualization platform: demand, footfall, competitors and dozens of other data layers across <strong>1,400+ cities</strong> in Russia and the CIS — on a configurable map, with customer data upload and an AI assistant.</p>
<p class="case-desc">Used by retail networks, franchises, developers and city planners to choose locations, size markets and find growth zones. Ships as SaaS and as an on-premise deployment.</p>
<div class="case-facts">
<div class="fact-row"><span>Coverage</span><span>1,400+ cities</span></div>
<div class="fact-row"><span>Data layers</span><span>Demand, traffic, demography, transit</span></div>
<div class="fact-row"><span>Delivery</span><span>SaaS + on-premise</span></div>
</div>
<div class="case-links">
<a href="https://dev.2gis.ru/pro" target="_blank" rel="noopener">dev.2gis.ru/pro →</a>
<a href="https://www.urbi.ae/" target="_blank" rel="noopener">urbi.ae →</a>
</div>
</div>
<div>
<ul class="bullets">
<li><span>—</span><span>Owned end-to-end delivery of <strong>4 analytics features</strong> — two-level chart grouping, statistics widget, date-based grouping, unit metrics: requirements clarification and decomposition, coordination of backend, design and analytics teams, and releases from feature flags to documentation and post-release improvements.</span></li>
<li><span>—</span><span>Rescued a critical analytics flow for a major enterprise customer whose <strong>3M+ point</strong> datasets crashed the map visualization — moved heavy processing to <strong>Web Workers</strong> and introduced clustering and viewport-based rendering, turning a broken flow into a fully usable one.</span></li>
<li><span>—</span><span>Built production-grade Next.js App Router interfaces for map-heavy analytics workflows, from complex filtering and reporting to chart-driven dashboards.</span></li>
<li><span>—</span><span>Led technical discovery for platform role management — aligned product and technical requirements and cut scope by proving a separate admin service and full RBAC model were unnecessary.</span></li>
<li><span>—</span><span>Raised frontend maintainability by driving migration to Feature-Sliced Design — eliminating circular dependencies, reducing module coupling and unifying UI Kit components.</span></li>
<li><span>—</span><span>Built the SEO layer for international rollout — metadata and dynamic sitemap generation for localized public pages.</span></li>
<li><span>—</span><span>Removed a recurring release blocker with AI-assisted localization: Arabic translation turnaround dropped from <strong>~2 weeks to minutes</strong>.</span></li>
</ul>
<div class="chips">
<span class="chip">React</span>
<span class="chip">Next.js App Router</span>
<span class="chip">TypeScript</span>
<span class="chip">GraphQL</span>
<span class="chip">Deck.gl</span>
<span class="chip">Leaflet</span>
<span class="chip">Web Workers</span>
<span class="chip">Feature-Sliced Design</span>
<span class="chip">SEO</span>
<span class="chip">i18n</span>
</div>
</div>
</article>
<article class="case">
<div>
<div class="case-num">02 — High-traffic iGaming</div>
<h3 class="case-title">Stoloto</h3>
<div class="case-role">Senior Frontend Developer</div>
<p class="case-desc">One of Russia's largest B2C services for state lotteries. Animation-heavy, gamified draw experiences that had to stay in sync with live draw data — on web, PWA and in-app WebView.</p>
<div class="case-links">
<a href="https://www.stoloto.ru/" target="_blank" rel="noopener">stoloto.ru →</a>
</div>
</div>
<div>
<ul class="bullets">
<li><span>—</span><span>Designed and delivered large Next.js features for a high-load B2C platform where traffic surged roughly <strong>10x</strong> during New Year draw peaks — owning frontend architecture, task decomposition and production releases.</span></li>
<li><span>—</span><span>Built a synchronization mechanism for live game-like lottery flows — keeping API requests, incoming draw data and animation timelines consistent without blocking the UI thread.</span></li>
<li><span>—</span><span>Built interactive, animation-heavy gaming experiences with Framer Motion and Lottie that stayed in production and kept evolving over multiple release cycles.</span></li>
<li><span>—</span><span>Code splitting, lazy loading and SVG/PNG optimization for cross-platform PWA and WebView delivery.</span></li>
<li><span>—</span><span>Mentored through cross-team code reviews across a <strong>~20-engineer</strong> frontend group, improving shared patterns and testing discipline.</span></li>
</ul>
<div class="chips">
<span class="chip">Next.js</span>
<span class="chip">TypeScript</span>
<span class="chip">NX Monorepo</span>
<span class="chip">Framer Motion</span>
<span class="chip">Lottie</span>
<span class="chip">Redux</span>
<span class="chip">PWA / WebView</span>
<span class="chip">Jest</span>
</div>
</div>
</article>
<article class="case">
<div>
<div class="case-num">03 — Enterprise systems</div>
<h3 class="case-title">CIT</h3>
<div class="case-role">Lead Frontend Developer</div>
<p class="case-desc">Information systems supporting Eurasian Economic Union process management and cross-border data exchange — heavy forms, strict validation, many modules.</p>
<div class="case-note">Under NDA — details on request</div>
</div>
<div>
<ul class="bullets">
<li><span>—</span><span>Led frontend delivery for enterprise information systems supporting EAEU process-management and data-exchange workflows.</span></li>
<li><span>—</span><span>Built a reusable UI Kit and shared business-logic layer with pixel-perfect components, cutting duplicated work across modules.</span></li>
<li><span>—</span><span>Delivered data-heavy workflows: multi-level forms, custom validation, nested object transformation and notification flows.</span></li>
<li><span>—</span><span>Coordinated a frontend team of up to <strong>5 engineers</strong> through estimation, task distribution, reviews and deadline-driven release planning.</span></li>
<li><span>—</span><span>Partnered directly with stakeholders to clarify requirements and accelerate approval of implementation details.</span></li>
</ul>
<div class="chips">
<span class="chip">React</span>
<span class="chip">TypeScript</span>
<span class="chip">Redux Toolkit</span>
<span class="chip">Module Federation</span>
<span class="chip">Webpack</span>
<span class="chip">BlueprintJS</span>
<span class="chip">DevExtreme</span>
<span class="chip">Formik + Yup</span>
<span class="chip">Ladle</span>
<span class="chip">CSS Modules</span>
</div>
</div>
</article>
<article class="case case-last">
<div>
<div class="case-num">04 — Full-stack, side project</div>
<h3 class="case-title">inMap</h3>
<div class="case-role">Full-Stack Engineer<br />Indoor navigation platform</div>
<p class="case-desc no-margin">Built the admin frontend from scratch and worked across the stack — extending the NestJS/GraphQL services, maintaining the data layer and wiring the operational plumbing around them.</p>
</div>
<div>
<ul class="bullets">
<li><span>—</span><span>Built the React/Vite admin frontend from scratch and worked across the stack — extending NestJS/GraphQL services and maintaining the Prisma/PostgreSQL data layer.</span></li>
<li><span>—</span><span>Built type-safe GraphQL contracts with Apollo Client and GraphQL Codegen, reducing integration risk across UI, API and data models.</span></li>
<li><span>—</span><span>Set up platform integrations hands-on — S3 file storage, Firebase Admin, Sentry error monitoring and Meilisearch full-text search — improving debuggability and admin workflows.</span></li>
</ul>
<div class="chips">
<span class="chip">React + Vite</span>
<span class="chip">NestJS</span>
<span class="chip">GraphQL Codegen</span>
<span class="chip">Prisma</span>
<span class="chip">PostgreSQL</span>
<span class="chip">Ant Design</span>
<span class="chip">S3</span>
<span class="chip">Sentry</span>
<span class="chip">Prometheus</span>
<span class="chip">Meilisearch</span>
</div>
</div>
</article>
</section>
<section id="experience" class="section">
<div class="section-head">
<h2>Experience</h2>
<span class="section-note">6+ years</span>
</div>
<div class="exp-list">
<div class="exp-row">
<div>
<div class="exp-title">Senior Frontend Developer</div>
<div class="exp-org">2GIS PRO / URBI · Geospatial analytics platform</div>
</div>
<div class="exp-stack">Next.js App Router, Deck.gl, Web Workers, FSD</div>
</div>
<div class="exp-row">
<div>
<div class="exp-title">Lead Frontend Developer</div>
<div class="exp-org">CIT · Enterprise data-exchange systems</div>
</div>
<div class="exp-stack">Module Federation, Redux Toolkit, UI Kit, team of 5</div>
</div>
<div class="exp-row">
<div>
<div class="exp-title">Senior Frontend Developer</div>
<div class="exp-org">Stoloto · High-traffic iGaming platform</div>
</div>
<div class="exp-stack">Next.js, NX, Framer Motion, Lottie, PWA</div>
</div>
<div class="exp-row">
<div>
<div class="exp-title">Middle Frontend Developer</div>
<div class="exp-org">Element-soft · Industrial monitoring dashboards</div>
</div>
<div class="exp-stack">React, Server-Sent Events (SSE), RBAC, maps & panoramas</div>
</div>
</div>
<div class="exp-detail">
<div>
<h3>Real-time industrial dashboards</h3>
<p>Element-soft — workforce access, equipment tracking, safety and environmental monitoring across physical sites, including a monitoring system for Gazprom.</p>
</div>
<ul class="bullets bullets-tight">
<li><span>—</span><span>Built real-time dashboards tracking <strong>30–40 vehicles</strong> and <strong>60–70 workers</strong> per site — live geolocation, speed, fuel level and equipment status streamed via Server-Sent Events onto maps and dashboards.</span></li>
<li><span>—</span><span>Implemented a safety alerting system covering geofence exits, on-site speed violations, sudden fuel drains and worker SOS signals — plus RBAC workflows for compliance and secure access to employee and equipment data.</span></li>
<li><span>—</span><span>Delivered maps, floor-plan schemes and panorama views for pollution and site-condition monitoring.</span></li>
<li><span>—</span><span>Improved release reliability through code reviews, unit/E2E testing, API collaboration and Nginx routing setup.</span></li>
</ul>
</div>
<div class="also-shipped">
<div class="eyebrow">Also shipped</div>
<div class="cards-grid">
<div class="card mini-card">
<div class="mini-card-title">Corporate sites & landings</div>
<p>High-performance Next.js marketing and booking platforms — localization, reusable UI components and brand-specific theming across several sites.</p>
<div class="mini-card-links">
<a href="https://en.manteracongress.ru/" target="_blank" rel="noopener">manteracongress</a>
<a href="https://manteratravel.ru/" target="_blank" rel="noopener">manteratravel</a>
<a href="https://manterasupreme.ru/" target="_blank" rel="noopener">manterasupreme</a>
<a href="https://kino-proekt.ru" target="_blank" rel="noopener">kino-proekt</a>
</div>
</div>
<div class="card mini-card">
<div class="mini-card-title">Enterprise, under NDA</div>
<p>A workforce and equipment monitoring system for Gazprom, and a cross-border data-exchange system between EAEU member states.</p>
<div class="mini-card-note">No public links — details on request</div>
</div>
<div class="card mini-card">
<div class="mini-card-title">Anonymous desktop browser</div>
<p>An Electron desktop application with an admin panel and documentation site — React, TypeScript, GraphQL/Apollo, Docusaurus, Jest and Puppeteer.</p>
<div class="mini-card-note">IMPRINT · Electron</div>
</div>
<div class="card mini-card">
<div class="mini-card-title">inMap</div>
<p>Indoor navigation platform — React/Vite admin built from scratch, plus full-stack work on the NestJS GraphQL API, PostgreSQL data layer and infrastructure integrations.</p>
<div class="mini-card-note"><a href="#work">See case 04 above</a></div>
</div>
</div>
</div>
</section>
<section id="stack" class="section">
<div class="section-head">
<h2>Stack</h2>
<span class="section-note">Day-to-day tools</span>
</div>
<div class="stack-list">
<div class="stack-row">
<div class="stack-name">Frontend</div>
<div class="stack-items">React · Next.js · TypeScript · JavaScript · Vite · Webpack · Tailwind CSS · SCSS · Redux · Zustand · TanStack Query · Apollo Client · Design Systems · Ant Design · Material UI · Framer Motion · Lottie · D3 · Deck.gl · Leaflet · PWA · i18n</div>
</div>
<div class="stack-row">
<div class="stack-name">Backend</div>
<div class="stack-items">Node.js · NestJS · GraphQL · Apollo Server · REST API · Prisma · Firebase Admin · S3 · Meilisearch · WebSockets · Server-Sent Events (SSE)</div>
</div>
<div class="stack-row">
<div class="stack-name">Data</div>
<div class="stack-items">PostgreSQL · MongoDB</div>
</div>
<div class="stack-row">
<div class="stack-name">DevOps & infra</div>
<div class="stack-items">Docker · Kubernetes · Nginx · CI/CD · NX Monorepo · Module Federation · Sentry · Prometheus · Monitoring</div>
</div>
<div class="stack-row">
<div class="stack-name">Testing</div>
<div class="stack-items">Jest · React Testing Library · Vitest · Unit testing · E2E testing</div>
</div>
<div class="stack-row">
<div class="stack-name">Architecture</div>
<div class="stack-items">Frontend architecture · System design · Feature-Sliced Design · API design · Data modeling · Performance optimization · SEO · Scalability · RBAC · Release management</div>
</div>
</div>
</section>
<section id="about" class="section">
<div class="section-head">
<h2>Beyond the code</h2>
</div>
<div class="about-grid">
<div>
<h3>Leadership & mentoring</h3>
<p class="about-lede">Feature ownership, technical planning, architecture decisions and release coordination — working cross-functionally with product, backend and QA.</p>
<ul class="bullets bullets-tight">
<li><span>—</span><span>Code reviews across <strong>20+ engineers</strong>; direct coordination of a frontend team of up to 5.</span></li>
<li><span>—</span><span>Mentoring junior and mid engineers, plus an internal JavaScript/React course.</span></li>
<li><span>—</span><span>Turning ambiguous product goals into architecture proposals, estimates and release scopes.</span></li>
</ul>
</div>
<div class="about-cards">
<div class="card">
<div class="eyebrow">Education</div>
<div class="edu-item">
<div class="edu-title">Internet of Things & Cyber-physical Systems</div>
<div class="edu-org">ITMO University, Saint Petersburg · 2021–2023</div>
</div>
<div class="edu-item">
<div class="edu-title">Internet Technologies & Programming</div>
<div class="edu-org">ITMO University, Saint Petersburg · 2017–2021</div>
</div>
<a href="https://diploma.itmo.ru/docs/06A98658C9DC6E976FC2DBCBA0B29EBB" target="_blank" rel="noopener" class="edu-link">Verify diploma →</a>
</div>
<div class="card">
<div class="eyebrow">Languages</div>
<div class="lang-list">
<div class="fact-row"><span class="lang-name">Russian</span><span>Native</span></div>
<div class="fact-row"><span class="lang-name">English</span><span>Advanced</span></div>
<div class="fact-row"><span class="lang-name">Turkish</span><span>Proficient</span></div>
<div class="fact-row"><span class="lang-name">Azerbaijani</span><span>Proficient</span></div>
</div>
</div>
</div>
</div>
</section>
<section id="contact" class="section section-contact">
<div class="contact-box">
<h2>Let's talk about what you're building.</h2>
<p>Open to senior and lead frontend roles with full-stack scope, and to contract work. Remote from Antalya, comfortable across EU and CIS time zones.</p>
<div class="contact-actions">
<a href="mailto:amilamil1999@icloud.com" class="btn btn-primary">amilamil1999@icloud.com</a>
<a href="https://t.me/front_mirzoev" class="btn btn-outline">Telegram</a>
<a href="https://www.linkedin.com/in/amil-mirzayev/" class="btn btn-outline">LinkedIn</a>
<a href="https://github.com/dropex7" class="btn btn-outline">GitHub</a>
</div>
</div>
<footer class="footer">
<span>Amil Mirzayev — Senior Frontend Engineer, Full-Stack Experience</span>
<span>Antalya, Turkey</span>
</footer>
</section>
</div>
</body>
</html>