Skills
Frontend development transforms content, data, and actions into an interface that is understandable, accessible, and reliable. The skill is not limited to reproducing a mockup: hierarchy must be built, states managed, layout adapted to available width, keyboard navigation preserved, changes announced correctly, and the cost of browser resources limited.
With React and Next.js, I distinguish components that can remain server-rendered from those that genuinely require interactivity. This separation reduces shipped JavaScript, clarifies responsibilities, and preserves initial-load performance. Animations remain isolated in client components, respect reduced-motion preferences, and use explicit scope. Internationalization, metadata, and localized routes are part of the architecture rather than additions made after pages exist.
I evaluate an interface through several kinds of evidence: actual responsive behavior, component and journey tests, visual inspection, semantic accessibility, and performance measurement. A Lighthouse score helps reveal a gap, but remains a dated measurement and does not replace usage or code review.
React 19.2 added the Activity component, partial pre-rendering, and dedicated tracks in Chrome DevTools. These tools move frontend work beyond display alone: developers must also prioritize rendering, preserve state, and measure real performance.
Read the source: ReactFor the new corporate website, I transformed three Figma mockups into a continuous responsive layout rather than separate versions for a few screens. I built shared components, separated server elements from interactions, centralized translations, and assigned animation responsibilities across GSAP, Motion, and Lenis. Videos and images are integrated according to their use, reduced-motion preferences are considered, and Lighthouse is measured after important milestones. Prototypes allowed designers to refine direction without requiring the technical foundation to be rebuilt.
Result — The homepage and contact page are already presentable across several browsers and formats, with a reusable component system. The old website's most visible mobile defect was addressed during development rather than after launch.
In CAP2vie, I was mainly responsible for the D3.js life-trajectory visualization. Questionnaire answers had to become exact or estimated periods distributed across five dimensions and readable in two modes. The chart also had to allow corrections that flowed back into the form. I worked with Vue and Nuxt, used D3.js primitives rather than a ready-made component, and evolved the display through three main versions to progressively align the representation with the researchers' method.
Result — The prototype made answers visible, comparable, and editable from two entry points. It taught me that a data interface must preserve scientific meaning before pursuing spectacular visual polish.
The portfolio combines Next.js 16, React 19, Tailwind CSS, shadcn/ui, MDX, and GSAP. I built bilingual routes, server and client dictionaries, navigation, theme, transitions, Lenis scrolling, the blog, forms, and long-form editorial pages. The homepage is statically rendered without a client-side React runtime for its main content, while interactions remain isolated. Achievement and skill pages use table-of-contents navigation, limited reading widths, and genuine heading levels so their volume does not become a wall of text.
Result — The site is published, responsive, and covered by unit, browser, visual, and end-to-end tests. A July 2026 Lighthouse measurement reports scores of 95 for performance, 96 for accessibility, and 100 for best practices and SEO. I retain these values as a dated snapshot rather than a permanent guarantee.
The evidence items describe specific episodes. This synthesis places them back in the complete case studies: context, my contribution, and outcome show what this skill made possible, while keeping the appropriate level of caution for each result.
I assess myself as a strong intermediate. I can build a responsive, bilingual application, organize its components, integrate animation, and cover its main journeys. I still need to improve original visual design, validation by novice users, and optimization based on performance profiles more detailed than a global audit.
My advice is to design with actual content and actual text volume before finalizing cards or animations. Extremes should then be checked: narrow screens, keyboard use, reduced motion, longer translations, network errors, and missing content. A successful interface does not depend on its most visible effect but on remaining clear when ideal conditions disappear.
Reach an advanced level by strengthening component architecture, manual accessibility testing, React performance measurement, and the ability to turn an art direction into a coherent system without relying on conventional solutions.
I continue studying React and Next.js, Playwright testing, and Performance Tracks analysis. Finalizing the corporate website and future portfolio iterations will provide deeper practice in composition, accessibility, and component reuse.
