Senior Front-End Engineer - React.js & Next.js

Leonardo.Ai

Location: Australia
Job Type: full-time
Salary: Unknown
Posted: August 11, 2025

Job Description

At Leonardo.Ai, we are advancing our generative AI platform to empower millions, regardless of expertise, with intuitive tools for creating high-quality images and videos. Now part of the Canva family, we're ready to build a world-class R&D team to seamlessly integrate AI products, tools, and features, making creativity limitless for nearly 250 million users.

The Role:
As a Front-End Engineer at Leonardo.Ai, you won’t just build features, you’ll help shape how millions of creators, designers, and storytellers interact with AI-powered tools.

Our engineering function is organised into cross-functional tribes, each focused on key product areas or platform capabilities. These squads move fast and think deeply, working closely with product, design, and research to build meaningful, user-first solutions.

Depending on your experience, you could be building creative tools that empower users directly, optimising real-time rendering for seamless experiences, or developing secure, scalable features that power enterprise workflows. Your work will help people move from idea to creation faster, with more clarity and creative freedom than ever before.

What you'll do:

Create AI Features That Don’t Yet Exist: Bring new creative tools to life, from real-time canvas interaction to advanced prompt editing and video generation, shaping the way millions engage with generative AI.
Own Technical Planning: Help set the direction for projects by contributing to architecture and technical decisions that ensure our systems are fast, reliable, and scalable.
Collaborate Closely with Product and Design: Work hand in hand with designers, PMs, and ML engineers to deliver polished, intuitive features that genuinely delight users.
Write High-Quality, Maintainable Code: Develop clean, scalable front-end code using React, Next.js App Router, TypeScript, and GraphQL — with performance and future-proofing top of mind.
Raise Engineering Standards Across the Team: Participate in code reviews, share constructive feedback, and contribute to building a culture of craftsmanship and continuous improvement.
Stay Curious and Bring Fresh Ideas: Keep up with emerging trends in front-end development and creative tooling, bringing new perspectives that help us build smarter and faster.

Skills we like:

Proven experience delivering production-ready front-end applications
Deep knowledge of React and Next.js, including App Router and rendering patterns
Strong proficiency in TypeScript and working with GraphQL APIs
Experience partnering closely with designers and product teams
Comfortable working in a fast-paced, collaborative environment
Clear communicator who shares context and embraces feedback
Passionate about creative tools, UX, and front-end performance

If you want to build at the intersection of design and AI, in a team that values speed, autonomy, and trust, we’d love to hear from you.

Our Culture:

Inclusive Culture: We celebrate diversity and are committed to creating an inclusive environment where everyone feels valued and empowered. At Leonardo AI, your unique perspectives and experiences are welcomed and essential to our success.
Flexible Work Environment: We understand the importance of work-life balance. Enjoy the flexibility to work remotely or from our vibrant offices. We have employees all over Australia, ensuring you can thrive personally and professionally.
Empowering Growth: Your development is our priority. We offer continuous learning opportunities and career growth tailored to your goals. You’ll be encouraged to grow and excel in your career at Leonardo AI.
Impactful Work: Join us in shaping the future of AI. You'll work on innovative projects that have a meaningful impact, and your contributions will help drive advancements in AI creativity.

What's in it for you?

A range of benefits to set you up for every success in and outside of work. Here's a taste of what's on offer:

Impact the future of AI
Private Healthcare
20 days of annual leave
Reward package including equity - we want our success to be yours too
An inclusive parental leave policy that supports all parents & carers with 18 weeks of paid leave
An annual Vibe & Thrive allowance to support your wellbeing, social connection, office setup & more
Flexible leave options that empower you to be a force for good, take time to recharge and support you personally, including remote working abroad
Support with your professional development
Fun and engaging company events, both virtual and in-person

🎯 Who is this job for?

This role suits a Senior Front-End Engineer with strong expertise in React.js, Next.js (App Router), TypeScript, and GraphQL, ideally experienced in building scalable, production-ready applications. It’s perfect for someone who thrives in fast-paced, cross-functional teams, partnering closely with product and design to deliver high-performance, user-focused creative tools. Candidates should be familiar with architecture planning, performance optimization, and modern front-end rendering patterns, especially in the context of AI-powered products.

💬 Potential Interview Questions

Explain the difference between Next.js App Router and the Pages Router.
The App Router uses a file-based routing system with server and client components, enabling advanced features like streaming and nested layouts. The Pages Router is the older system, with simpler routing but less flexibility for server-side rendering patterns.
How would you optimize a React component that re-renders too frequently?
Use React.memo for functional components, useCallback or useMemo for expensive computations, and ensure props/state changes are minimal and shallowly equal where possible.
What strategies can you use in Next.js to improve Core Web Vitals performance?
Implement image optimization with next/image, leverage static site generation (SSG) where possible, enable caching headers, and minimize JavaScript bundle size through code splitting and tree shaking.
How would you handle GraphQL queries in a React/Next.js app for both client and server rendering?
Use Apollo Client or urql for client-side queries, and set up server-side data fetching with Next.js’ getServerSideProps or generateStaticParams/fetch inside server components for optimal performance.
Describe how you would implement real-time updates in a Next.js front-end.
Use WebSockets, GraphQL subscriptions, or services like Firebase, integrating them with state management to update the UI instantly without full page reloads.
How do you ensure accessibility (a11y) in a React application?
Follow WCAG guidelines, use semantic HTML, implement ARIA attributes where needed, and test with tools like axe-core or Lighthouse to identify and fix accessibility issues.
What are some common pitfalls when working with TypeScript in large front-end codebases?
Overusing any, poor type inference, and neglecting strict mode can lead to runtime bugs; maintaining proper type definitions and leveraging generics improves scalability and safety.
How would you design a reusable, themeable component library in React?
Use styled-components, Tailwind, or CSS modules with a consistent design system; build components with configurable props and ensure they are isolated and composable.
What’s your approach to handling large media files (images, videos) in a Next.js app for performance?
Implement lazy loading, use CDN delivery, optimize formats (WebP/AVIF for images, MP4/WebM for videos), and leverage Next.js image optimization for responsive sizing.
How do you debug hydration errors in Next.js when using server and client components together?
Compare server-rendered and client-rendered markup, ensure deterministic rendering by avoiding non-deterministic values (like Date.now()), and isolate client components where necessary to prevent mismatches.

📋 Job Summary

Join Leonardo.Ai, now part of the Canva family, and help shape the future of AI-powered creativity for nearly 250M users worldwide. We’re looking for a Senior Front-End Engineer skilled in React, Next.js (App Router), TypeScript, and GraphQL to craft innovative tools for image and video generation. You’ll work in fast-moving, cross-functional teams, owning technical decisions, collaborating with design and product, and building high-performance, scalable features. This full-time role offers remote or hybrid options across Australia, competitive salary with equity, private healthcare, generous leave, and a culture that values speed, autonomy, and impact. If you’re passionate about design, UX, and AI innovation, this is your chance to make creativity limitless.