Full Stack UI Developer

📍 Job Overview

Job Title: Full Stack UI Developer

Company: Citi

Location: Singapore, Singapore

Job Type: Full time

Category: Technology / Applications Development

Date Posted: 2026-09-03

Experience Level: Mid-Senior Level (3-8 years)

Remote Status: Hybrid

🚀 Role Summary

• This role is for a Full Stack UI Developer within Citi Equities Technology, focusing on developing and maintaining cutting-edge web applications.

• Responsibilities include designing, coding, and testing high-quality, maintainable front-end solutions using modern JavaScript frameworks and state management libraries.

• The position requires a strong understanding of application architecture, design patterns, and best practices for building scalable and performant user interfaces.

• Collaboration with cross-functional teams to foster a positive working culture and adapt to evolving development environments is essential.

📝 Enhancement Note: The raw job description mentions "Applications Development Intermediate Programmer Analyst" as the overarching role, but specifically calls out "Full Stack UI developer" with detailed responsibilities. The enhancement focuses on the specialized UI developer aspect, inferring a mid-to-senior level based on the 3-8 years of experience requirement and the complexity of stated responsibilities. The "Hybrid" work arrangement is inferred from the typical corporate environment of a company like Citi, especially in a hub like Singapore, where flexibility is common but in-office presence for collaboration is often expected.

📈 Primary Responsibilities

• Develop and maintain sophisticated web applications using React and TypeScript, ensuring adherence to high standards of code quality, maintainability, and testability.

• Implement and manage complex application state using Redux and associated middleware, such as Redux Toolkit, to ensure predictable and efficient data flow.

• Write comprehensive unit tests using Vitest or similar frameworks to achieve high test coverage and ensure the reliability of UI components and features.

• Design, develop, and maintain a library of reusable UI components that can be leveraged across various feature applications, promoting consistency and development efficiency.

• Actively contribute to the definition and evolution of the overall application architecture, providing valuable input on front-end frameworks, robust design patterns, and industry best practices.

• Conduct thorough code reviews, offering constructive feedback to peers to uphold software quality, enhance maintainability, and improve testability across the development team.

• Operate as a self-starter, independently planning and scheduling work for assigned tasks and projects, and implementing functionality with minimal direct supervision.

• Foster strong working relationships and collaborate effectively with cross-functional teams, demonstrating adaptability and contributing to a positive and productive team culture.

📝 Enhancement Note: The primary responsibilities have been expanded to provide a more detailed operational perspective, emphasizing the practical application of technologies like React, TypeScript, and Redux in a financial technology context. Specific mentions of code quality, testability, and architectural contributions are tailored to highlight the importance of robust development practices in enterprise environments.

🎓 Skills & Qualifications

Education:

• Bachelor’s degree in Computer Science, Engineering, a related field, or equivalent practical experience. Experience:

• 3 to 8 years of hands-on professional experience in front-end development, with a strong focus on UI/UX implementation and full-stack capabilities.

• Proven experience in designing and developing complex, scalable web applications within enterprise environments. Required Skills:

• Proficient in core front-end technologies: HTML5, CSS3/SASS/CSS-in-JS, and modern JavaScript (ES6+).

• Expertise in TypeScript for building robust and maintainable applications.

• Hands-on experience with React, including modern React Hooks.

• Strong understanding and practical application of application state management with Redux, Recoil, or React Context.

• Experience with reactive programming paradigms and real-time communication technologies such as RxJS, WebSockets, and Web Workers.

• Familiarity with build tools and module bundlers like Webpack or Vite.

• Demonstrated debugging skills, with an understanding of code performance optimization and benchmarking techniques.

• Experience with container-based development environments, potentially including Electron.

• Knowledge of RESTful APIs, JWT (JSON Web Tokens), and back-end technologies like NodeJS and Express JS.

• Experience in writing unit tests using Jest, React Testing Library, or similar frameworks. Preferred Skills:

• Exposure to CI/CD pipelines and version control systems: GitHub, Jenkins, Artifactory.

• Familiarity with collaboration and documentation tools: Confluence.

• Experience with NoSQL databases such as MongoDB.

• Understanding of workspace tools and concepts: npm workspaces, Micro Frontend architectures, ESLint/TSLint.

• Experience with containerization technologies: Docker management, OpenShift containers.

• Experience working with other UI frameworks like Angular.

• Exposure to backend programming languages and frameworks such as Java and Spring Boot.

📝 Enhancement Note: The skills section has been structured to clearly differentiate between required and preferred qualifications, aligning with the "3-8 years" experience level. Specific operations-related keywords such as "state management," "real-time communication," "performance optimization," and "CI/CD" are integrated. The preference for financial technology-specific tools and concepts (e.g., Equities Technology, AMPS Server) has been noted.

📊 Process & Systems Portfolio Requirements

Portfolio Essentials:

• Showcase at least 2-3 significant UI development projects, demonstrating end-to-end implementation from concept to deployment.

• Each project should clearly articulate the problem statement, the chosen technical approach, and the specific contributions made by the candidate.

• Highlight projects that involved complex state management, real-time data updates, or integration with various APIs.

• Include examples that demonstrate proficiency in React, TypeScript, and state management libraries like Redux. Process Documentation:

• Provide examples of how you have documented development processes, architectural decisions, or component usage guidelines.

• Demonstrate experience in creating user stories, technical specifications, or API integration documentation.

• Show evidence of contributing to or maintaining a component library or design system.

• Include documentation related to testing strategies, such as unit test plans or integration test scenarios.

📝 Enhancement Note: Given this is a development role, the "Process & Systems Portfolio Requirements" section is adapted to focus on showcasing technical projects and documentation relevant to UI development. The emphasis is on demonstrating practical application of skills and adherence to development best practices, which are crucial for operations-minded developers.

💵 Compensation & Benefits

Salary Range:

• Based on industry benchmarks for mid-senior level Full Stack UI Developers in Singapore, with 3-8 years of experience in a major financial institution like Citi, the estimated salary range is SGD 7,000 - SGD 12,000 per month. This range accounts for the specialized skills in React, TypeScript, and financial technology environments. Benefits:

• Comprehensive health insurance coverage (medical, dental, vision).

• Retirement savings plan (e.g., CPF contributions in Singapore).

• Paid time off, including vacation days, sick leave, and public holidays.

• Opportunities for professional development, training, and certifications.

• Employee assistance programs and wellness initiatives.

• Potential for performance-based bonuses and stock options/grants (depending on role level and company policy).

• Access to Citi's global network and resources. Working Hours:

• Standard full-time engagement, typically 40 hours per week.

• Flexibility may be offered through hybrid work arrangements, allowing for a balance between in-office collaboration and remote work. Specific in-office days will be determined by team needs and management.

📝 Enhancement Note: A salary range has been estimated for Singapore based on industry standards for comparable roles and experience levels. The benefits listed are typical for large, multinational corporations like Citi, with a focus on aspects beneficial to technical professionals. The working hours are clarified to reflect a standard full-time role with hybrid flexibility.

🎯 Team & Company Context

🏢 Company Culture

Industry: Financial Services (Banking & Technology)

• Citi operates within the highly regulated and dynamic global financial services industry. This context emphasizes a strong need for robust, secure, and compliant technology solutions, particularly in areas like Equities Technology. The pace of innovation is high, driven by market demands and technological advancements.

Company Size: Global Enterprise (Over 200,000 employees worldwide)

• As a large, multinational corporation, Citi offers a vast array of resources, opportunities, and established processes. For operations professionals, this size often means structured career paths, specialized teams, and significant impact potential due to the scale of operations. However, it can also imply more formalized decision-making processes and a need to navigate complex organizational structures.

Founded: 1812

• With a long and rich history, Citi has evolved significantly, adapting to numerous economic cycles and technological shifts. This longevity suggests a stable organization with deep industry expertise and a commitment to long-term growth and innovation. For operations roles, this history implies a foundation of established best practices alongside a forward-looking approach to technology adoption. Team Structure:

• Operations Team Aspect: The role sits within Citi Equities Technology, part of the broader Technology division. This implies a team focused on delivering and supporting the technology infrastructure and applications that drive the equities trading business. The team likely comprises specialized roles in front-end development, back-end development, quality assurance, DevOps, and product management.

• Reporting Structure: The Full Stack UI Developer will likely report to a Team Lead or Engineering Manager within the Equities Technology group. This manager will oversee project assignments, performance, and career development. Collaboration will extend to product owners, business analysts, and other developers.

• Cross-functional Collaboration: This role necessitates close collaboration with back-end developers to integrate APIs, product managers to understand business requirements, UX/UI designers for visual implementation, and QA engineers to ensure quality. Working within Equities Technology means frequent interaction with traders, sales teams, and compliance officers to ensure technology meets stringent financial market needs.

Methodology:

• Data Analysis and Insights: While primarily a development role, understanding data is key. Developers will use data from performance monitoring tools, user feedback, and A/B testing to inform UI improvements and feature development.

• Workflow Planning and Optimization: The team likely follows Agile methodologies (Scrum or Kanban) for workflow management. Developers are expected to contribute to sprint planning, daily stand-ups, and retrospectives, focusing on efficient task execution and continuous process improvement.

• Automation and Efficiency: A strong emphasis is placed on automating repetitive tasks, from testing to deployment. This role will involve leveraging build tools and CI/CD pipelines to streamline the development lifecycle and improve overall efficiency.

Company Website: https://www.citigroup.com/

📝 Enhancement Note: The company context has been elaborated to provide a nuanced view of working at a global financial institution like Citi. The "Operations Team Aspect" is specifically tailored to the "Equities Technology" context, highlighting the specialized nature of this team within the broader organization.

📈 Career & Growth Analysis

Operations Career Level: Mid-Senior Level UI Developer

• This role represents a significant step beyond junior development. As a Mid-Senior Level UI Developer, you are expected to not only implement features but also to contribute meaningfully to architectural decisions, mentor junior developers, and take ownership of complex components or modules. Your impact extends beyond coding to influencing the technical direction and quality standards of the team's output. Reporting Structure:

• You will report to an Engineering Manager or Team Lead within Citi Equities Technology. This structure typically involves regular one-on-one meetings to discuss project progress, career goals, and feedback. You will also work closely with Product Owners and Business Analysts who define the requirements and priorities for the development backlog. Operations Impact:

• As a Full Stack UI Developer in Equities Technology, your work directly impacts the user experience of critical trading platforms. This includes enhancing the efficiency of traders, providing intuitive interfaces for complex financial data, and ensuring the reliability of user-facing systems. Your contributions are vital for Citi's ability to execute trades effectively, manage risk, and maintain a competitive edge in the financial markets. The quality and performance of the UI directly influence operational efficiency and client satisfaction. Growth Opportunities:

• Specialization & Technical Mastery: Deepen expertise in React, TypeScript, state management, and performance optimization for financial applications. Explore advanced UI patterns and real-time data visualization techniques relevant to trading.

• Architectural Leadership: Progress into roles like Senior UI Developer or Lead Front-End Engineer, where you will be responsible for designing system architecture, setting technical standards, and mentoring a team of developers.

• Cross-Disciplinary Expansion: Leverage your understanding of front-end development to explore adjacent areas such as back-end development (NodeJS, Java), DevOps, or even product management within financial technology. Citi often provides pathways for employees to broaden their skill sets and move into different functional areas.

• Management Track: Develop leadership skills to transition into an Engineering Manager or Technical Program Manager role, overseeing teams and strategic technology initiatives.

📝 Enhancement Note: The "Operations Career Level" is defined to clarify expectations for a mid-senior role. The "Operations Impact" section specifically links UI development to critical business functions within equities trading, emphasizing how technical contributions translate into business value and operational efficiency. Growth opportunities are tailored to a financial technology context.

🌐 Work Environment

Office Type: Corporate Financial Institution Hub

• This role is based in Singapore, a major financial and technological hub. The office environment at Citi will be professional, structured, and likely adhere to corporate standards for security and compliance, which are paramount in the financial services industry. Office Location(s):

• 3 Changi Business Park Crescent, Singapore. This location is a well-established business park area, providing a conducive environment for technology and research-focused companies. It's accessible via public transport and offers amenities typical of such business districts. Workspace Context:

• Collaborative Environment: Expect a blend of individual focused work and team collaboration. This involves working in open-plan office spaces or dedicated team areas, with access to meeting rooms and collaboration tools for brainstorming and project discussions.

• Operations Tools and Technology: You will have access to a robust technology infrastructure, including high-performance workstations, reliable network connectivity, and a suite of development tools and platforms managed by Citi's IT department. This includes secure access to code repositories, CI/CD pipelines, and testing environments.

• Team Interaction: Regular interaction with your immediate development team, as well as with product managers, business analysts, and potentially stakeholders from trading desks or operations. This fosters a dynamic exchange of ideas and ensures alignment on project goals and technical solutions.

Work Schedule:

• The standard work schedule is full-time, typically Monday to Friday, with 40 hours per week. While the role is hybrid, specific days in the office will be determined by team needs and management to facilitate in-person collaboration, team meetings, and knowledge sharing sessions. This structure aims to balance flexibility with the operational requirements of a fast-paced financial technology environment.

📝 Enhancement Note: The work environment description is tailored to a corporate setting in Singapore's business park, emphasizing professionalism, security, and the blend of individual and collaborative work necessary for a UI developer in a financial institution.

📄 Application & Portfolio Review Process

Interview Process:

• Initial Screening: A recruiter or hiring manager will conduct an initial phone screen to assess basic qualifications, experience, and cultural fit.

Be prepared to briefly discuss your background and interest in the role.

• Technical Assessments: Expect one or more technical interviews. These may include:

  • Live Coding Challenge: Solving a coding problem in real-time, often focusing on algorithms, data structures, or front-end logic using technologies like React and JavaScript.
  • System Design/Architecture Discussion: Discussing how you would approach building a specific UI feature or system, focusing on scalability, performance, and maintainability.
  • Technical Deep Dive: In-depth questions about your experience with React, TypeScript, state management, testing, and other relevant technologies.

• Portfolio Presentation: You may be asked to present a selection of your work from your portfolio, explaining your role, the technical challenges, and the outcomes.

• Manager/Team Interviews: Interviews with the hiring manager and potential team members to evaluate your problem-solving skills, teamwork capabilities, and alignment with the team's culture and working style.

• Final Interview: A concluding interview, possibly with a senior leader, to confirm suitability for the role and organization.

Portfolio Review Tips:

• Curate Selectively: Choose 2-3 of your strongest, most relevant projects that showcase your skills in React,

TypeScript, state management, and ideally, experience with financial data or complex UIs.

• Structure Your Narrative: For each project, clearly define:

  • The problem you were solving.
  • Your specific role and contributions.
  • The technologies and architectural decisions made.
  • The challenges encountered and how you overcame them.
  • The impact or outcome of the project (e.g., improved performance, user satisfaction, efficiency gains).

• Demonstrate Process: Be ready to discuss your development process, including how you approach requirements, design, coding, testing, and deployment. Highlight your use of version control, CI/CD, and other development tools.

• Quantify Achievements: Whenever possible, use metrics to illustrate the impact of your work. For example, "reduced page load time by 20%" or "increased user engagement by 15%."

• Technical Depth: Be prepared to answer detailed questions about the code, design choices, and technologies used in your portfolio projects.

Challenge Preparation:

• Practice Coding Problems: Utilize platforms like LeetCode, HackerRank, or Codewars to practice JavaScript and React-specific coding challenges. Focus on algorithmic thinking and efficient code implementation.

• Review Core Concepts: Brush up on fundamental computer science concepts, data structures, algorithms, and design patterns. Revisit React principles, Hooks, state management patterns (Redux), and TypeScript best practices.

• Prepare for System Design: Think about how you would build common web application features (e.g., a real-time dashboard, a complex form, an authentication flow). Consider scalability, performance, security, and maintainability.

• Articulate Your Thought Process: During live coding or design challenges, communicate your thinking clearly. Explain your assumptions, potential trade-offs, and why you are making certain decisions. This is as important as the final solution.

📝 Enhancement Note: The interview process and portfolio review tips are tailored to a development role within a financial institution, emphasizing technical depth, problem-solving, and the ability to articulate complex technical solutions and their business impact.

🛠 Tools & Technology Stack

Primary Tools:

• Front-End Framework: React (with extensive use of Hooks).

• State Management: Redux (including Redux Toolkit), Recoil, React Context API.

• Languages: TypeScript, JavaScript (ES6+).

• Styling: CSS3, SASS, CSS-in-JS solutions.

• Build Tools: Webpack, Vite.

• Testing Frameworks: Vitest, Jest, React Testing Library.

• Real-time Communication: WebSockets, RxJS.

• Containerization/DevOps: Docker, potentially OpenShift.

• Backend Integration: NodeJS, Express JS, RESTful APIs, JWT.

Analytics & Reporting:

• While not a primary focus for this UI role, understanding how to integrate with analytics SDKs (e.g., for user behavior tracking) and interpret performance metrics from monitoring tools is beneficial. This may involve tools like Datadog, Splunk, or internal Citi analytics platforms. CRM & Automation:

• This role is focused on the front-end application development within a financial technology context, rather than CRM or sales automation tools. However, understanding how front-end applications integrate with broader enterprise systems is key. Version Control & Collaboration:

• Version Control: Git (primarily GitHub).

• Collaboration: Jira, Confluence, Slack/Teams.

• CI/CD: Jenkins, Artifactory.

📝 Enhancement Note: This section consolidates the technologies mentioned in the job description and adds context relevant to their use in an enterprise financial technology environment. It clarifies the primary focus on front-end development tools while acknowledging broader system integration and collaboration tools.

👥 Team Culture & Values

Operations Values:

• Integrity & Trust: As part of a financial institution, upholding the highest standards of integrity, ethical conduct, and data security is paramount. Decisions must reflect a commitment to protecting client assets and sensitive information.

• Excellence & Quality: A drive for delivering high-quality, robust, and reliable software solutions. This involves meticulous attention to detail, rigorous testing, and a commitment to continuous improvement in code and processes.

• Innovation & Adaptability: Embracing new technologies and methodologies to stay ahead in the fast-paced financial markets. This requires a willingness to learn, experiment, and adapt to evolving client needs and technological advancements.

• Collaboration & Teamwork: Fostering a supportive and inclusive team environment where ideas are shared freely, and collective success is prioritized. Effective communication and mutual respect are key to navigating complex projects.

• Client Focus: Understanding that the ultimate goal is to serve clients effectively. This means building user-friendly, performant, and secure applications that meet the needs of traders, operations teams, and Citi's clients.

Collaboration Style:

• Cross-functional Integration: Developers are expected to work seamlessly with product management, business analysts, QA engineers, and back-end developers. This involves active participation in requirement gathering, design discussions, and integrated testing phases.

• Process Review Culture: Encouraging a culture where development processes, code quality, and architectural decisions are regularly reviewed and discussed openly within the team. Constructive feedback is valued as a tool for growth.

• Knowledge Sharing: Promoting the sharing of technical expertise, best practices, and lessons learned through pair programming, code reviews, internal tech talks, and documentation. This ensures collective learning and skill enhancement across the team.

📝 Enhancement Note: The "Operations Values" are framed through the lens of a financial institution, emphasizing integrity, security, and client focus alongside typical tech values like innovation and excellence. The collaboration style highlights the integrated nature of development teams in enterprise settings.

⚡ Challenges & Growth Opportunities

Challenges:

• Navigating Complex Legacy Systems: While modernizing, you may encounter and need to integrate with older, complex systems, requiring careful planning and robust integration strategies.

• Real-time Data Handling: Developing for financial markets often involves managing high-volume, real-time data streams, which presents unique challenges in performance optimization and state synchronization.

• Stringent Security & Compliance: Adhering to rigorous security protocols and regulatory compliance requirements inherent in the financial services industry. This means development must be secure-by-design.

• Fast-Paced Market Demands: The need to quickly respond to market changes and evolving client needs requires agile development practices and efficient iteration cycles.

Learning & Development Opportunities:

• Advanced Front-End Technologies: Opportunities to deepen expertise in React, explore emerging front-end frameworks, and master advanced state management and performance optimization techniques specific to high-frequency applications.

• Financial Technology Specialization: Gain in-depth knowledge of financial markets, trading platforms, and regulatory frameworks, becoming a specialist in FinTech UI development.

• Leadership and Mentorship: As you gain experience, opportunities to mentor junior developers, lead technical initiatives, and potentially move into team lead or architectural roles.

• Cross-Functional Exposure: Possibility to gain exposure to back-end development, DevOps practices, or product management within the Equities Technology domain, broadening your overall technical and business acumen.

📝 Enhancement Note: Challenges are framed to be specific to a FinTech environment, such as real-time data and regulatory compliance. Growth opportunities focus on specialization within FinTech and progression within Citi's structured career paths.

💡 Interview Preparation

Strategy Questions:

• Operations Strategy: "How would you approach designing a real-time dashboard for equity traders that needs to display multiple data streams with minimal latency?" Focus on scalability, data fetching strategies, rendering optimization, and error handling.

• Collaboration & Stakeholder Management: "Describe a time you had to work with a non-technical stakeholder (like a trader or product manager) to define UI requirements. How did you ensure clear communication and alignment?" Emphasize active listening, translation of technical concepts, and iterative feedback loops.

• Problem-Solving: "Imagine a critical UI component in production is causing intermittent errors. Walk me through your process for debugging and resolving this issue." Highlight systematic troubleshooting, use of developer tools, logging, and testing strategies.

Company & Culture Questions:

• Company Operations: "What do you understand about Citi's role in the global financial markets, and how do you see UI development contributing to that?" Research Citi's business lines, especially Equities, and connect your role to business objectives.

• Team Dynamics: "How do you prefer to collaborate with back-end developers and QA engineers? What's your approach to code reviews?" Prepare examples of effective cross-functional teamwork and constructive feedback.

• Impact Measurement: "How would you measure the success of a new UI feature you developed? What metrics would you track?" Discuss KPIs related to user engagement, task completion time, error rates, and performance.

Portfolio Presentation Strategy:

• Storytelling: Structure your portfolio presentation as a narrative. Start with the problem, introduce your solution, detail your technical contributions, and conclude with the impact.

• Visuals: Use screenshots, mockups, and short video demos where appropriate to illustrate your work. For live coding or system design components, use a shared editor and clearly explain your thought process.

• Technical Depth & Trade-offs: Be prepared to discuss the rationale behind your technical choices, including any trade-offs you made. For example, why you chose Redux over Context API, or why you opted for a specific testing approach.

• Company Alignment: Briefly touch upon how your skills and approach align with Citi's values (integrity, excellence, innovation, etc.) and the specific needs of Equities Technology.

📝 Enhancement Note: Interview questions are designed to probe the candidate's understanding of operations within a financial context, their problem-solving skills, and their ability to articulate technical solutions and their business impact. Portfolio presentation advice focuses on clarity, impact, and technical justification.

📌 Application Steps

To apply for this operations position:

• Submit your application through the Citi Careers portal via the provided job URL.

• Customize Your Resume: Tailor your resume to highlight experience with React, TypeScript, Redux, and any relevant financial technology projects. Use keywords from the job description and quantify your achievements with specific metrics.

• Prepare Your Portfolio: Select your most impactful UI projects and prepare a concise presentation that clearly outlines your role, the technical challenges, your solutions, and the outcomes. Ensure you can speak confidently about the technologies used and your design decisions.

• Practice Technical Interviews: Rehearse coding exercises focusing on JavaScript and React. Be ready to discuss system design principles and architectural choices for scalable web applications.

• Research Citi: Understand Citi's business, particularly its Equities Technology division, and its commitment to innovation and client service. This will help you tailor your responses and demonstrate genuine interest.

⚠️ Important Notice: This enhanced job description includes AI-generated insights and operations industry-standard assumptions. All details should be verified directly with the hiring organization before making application decisions.

---