Design-to-Code Translation
I translate design concepts into standard-compliant HTML5, semantic CSS3, and responsive React/Next.js components with pixel-perfect attention to detail.
Steven Morales
Full Stack Software Engineer & Tech Leader
Building high-quality, responsive, accessible full stack experiences that connect technology, creativity, and real human needs.
Role Focus: Developer, Front End
@ Critical Mass
This portfolio is intentionally designed as a live case study for the Developer, Front End position at Critical Mass:
Cross-Browser & Mobile-First
I implement mobile-first CSS strategies using SCSS variables and mixins for responsive breakpoints, tested across modern browsers and devices.
API Integration & Web Services
I integrate REST and SOAP APIs, JSON data structures, and client-side state management. This portfolio focuses on front-end; my GitHub showcases API integrations.
Modern Front-End Technologies
I build with Next.js 14 App Router, React 19, TypeScript, and SASS/SCSS, using modern patterns including server components and optimized image loading.
Design Systems & Reusable Components
I build complete reusable component libraries following BEM methodology, demonstrating design system thinking and component reusability.
Best Practices & Documentation
I implement industry best practices including BEM methodology, SMACSS architecture, TypeScript for type safety, and well-documented code following Next.js and React standards.
Key Highlights – What I Bring to Critical Mass
3+ Years Front-End Experience
Full Stack Software Engineer with more than 3 years of experience building robust, scalable, and high-performance software across web, desktop, mobile, and hybrid platforms. I work across the full development cycle—from design and architecture to deployment and optimization.
Modern Front-End Stack
Strong expertise in TypeScript, JavaScript, React, Next.js, HTML5, CSS3, SASS/SCSS, design systems, and reusable components. Experience with automation tools like Gulp, Vite, and modern bundlers for efficient front-end pipelines.
Design-to-Code Translation
I translate Figma designs and wireframes into standard-compliant HTML5, semantic CSS3, and responsive React/Next.js components with pixel-perfect attention to detail. Experience ensuring cross-browser compatibility and mobile-first, performant code.
Full-Stack & API Integration
Experience with RESTful APIs, SOAP, JSON, XML, HTTP, and integrating web solutions with external services, CMS systems, and third-party applications. While this portfolio focuses on front-end demonstration, most of my projects feature comprehensive API integrations—visible in my public GitHub repositories—including full-stack architectures with databases (PostgreSQL, MongoDB), API design, and performance monitoring.
Team Leadership & Collaboration
CEO & Lead Developer at Novaera, leading a six-member development team. I coordinate with design, business, QA, and tech leads to deliver high-quality, punctual web development. Strong in communication, organization, and mentorship.
Performance & Problem Solving
Expertise in performance optimization, scalability, debugging, and root cause analysis. I analyze and optimize code for quality, efficiency, and performance, identify and resolve scalability issues, and drive efforts to reduce technical debt.