Frontend Javascript Developer for Static Site Project
About Ranktracker:
Ranktracker is a premier SEO platform that helps users track and optimize their search engine performance using cutting-edge technology. Our mission is to provide accessible and actionable SEO tools that empower our clients' success.
About Job Position:
We are embarking on an ambitious greenfield project to create a high-performance, globally accessible website using Eleventy (11ty) (https://www.11ty.dev) as the static site generator, with data managed by Directus (https://directus.io/) and fetched via a GraphQL API at build time.
With 180,000 pages and translations in 28 languages, this is a high-impact, large-scale project that requires a developer skilled in performance, scalability, and maintainability.
Our goal is to deliver a 400 Lighthouse score (https://www.11ty.dev/speedlify/) while supporting advanced features like incremental builds, reusable components, and seamless internationalization.
This project is a unique opportunity to create a global, highly performant website from scratch, with an emphasis on internationalization, scalability, and accessibility.
Role and Responsibilities:
Translate Figma Designs: Accurately translate high-fidelity Figma designs into responsive, pixel-perfect 11ty templates.
Reusable HTML Components: Develop reusable and modular HTML components that integrate seamlessly with Directus.
Incremental Builds: Implement a build process that only compiles new or edited pages, ensuring efficient handling of our large content base (130,000 pages).
Implement Internationalization (i18n): Ensure proper multilingual support with accurate file organization and build processes to manage translations across 28 languages seamlessly.
File Organization: Set up a clean, maintainable file structure that supports internationalization and scaling.
Sitemap Generation: Implement automatic sitemap generation to enhance SEO and navigation.
Achieve Performance Excellence: Optimize site performance to hit a perfect 400 Lighthouse score for Performance, Accessibility, Best Practices, and SEO.
Staging/Dev Environment: Set up a fast and reliable staging/development environment to test builds and features efficiently.
Integrate GraphQL and Directus: Fetch data dynamically at build time using a GraphQL API connected to Directus, ensuring robust and scalable data management.
Testing: Rigorously test the site for performance, accuracy, and language support.
- Documentation: Provide clear, maintainable documentation for components and processes to ensure ease of use for future developers.
Key Qualifications:
Frontend Expertise: Strong knowledge of HTML, CSS, JavaScript, and templating languages like Markdown, Nunjucks or Liquid.
Eleventy (11ty): Proven experience in building static sites using 11ty, including advanced features like incremental builds.
Directus and GraphQL: Experience working with Directus or similar headless CMSs, and integrating GraphQL APIs for static site generation.
Scalability: Expertise in handling large-scale projects with tens of thousands of pages, ensuring efficient builds and performance.
Internationalization (i18n): Deep understanding of multilingual site structures, translation file management, and localization best practices.
Performance Optimization: Proven ability to achieve perfect Lighthouse scores using techniques like lazy loading, image optimization, critical CSS, and caching strategies.
SEO Best Practices: Familiarity with sitemap generation, structured data, and meta-tag implementation.
- Testing and Debugging: Proficient with tools like Lighthouse, Axe, or similar for performance and accessibility testing.
Preferred Qualifications:
- Experience with advanced 11ty plugins or custom plugin development.
- Familiarity with setting up automated CI/CD pipelines for static site deployment.
- Contributions to the Eleventy or Directus ecosystems.
- Knowledge of progressive web app (PWA) principles.
Why Join Us?
- Work on a cutting-edge project that pushes the boundaries of performance and scalability.
- Collaborate with a highly skilled and passionate team.
- Build a global website with advanced features and reach a large audience.
Enjoy a flexible, remote work environment.
Additional Information:
- Start Date: ASAP
- Project Objective: A blazing-fast, multilingual, scalable static site with perfect Lighthouse scores and efficient incremental builds.
We look forward to your application and welcoming you to the team!