Roadmap
NeoJET is an ongoing experiment to modernize Oracle JET using today's React ecosystem. The roadmap outlines how the project evolves from foundational parity to a unified, cross-platform design system built with accessibility, performance, and developer experience at its core.
1. Foundational Components & Styles
Laying the groundwork for NeoJET's visual consistency and system architecture.
Completed
- Implementing a subset of the foundational OJET components using React, Tailwind, and React Aria.
- Establishing the initial design token system for colors, spacing, typography, and motion.
- Deploying the first version of the NeoJET Cookbook, a live documentation site showcasing each component and design token.
2. Polishing the UX & Component APIs
Refining NeoJET into a cohesive, high-performance design system.
In Progress
- Establishing intuitive component APIs that are aligned with modern React patterns.
- Improving reusability and internal consistency across all components.
- Introducing Server-Side Rendering (SSR) with React Router v7 to enhance performance and optimize SEO for the Cookbook and demos.
- Leveraging new React features such as Activity and the View Transitions API for seamless, fluid navigation experiences.
- Adding micro-interactions and animations powered by Framer Motion for a refined user experience.
- Strengthening accessibility and keyboard interactions with React Aria primitives.
3. Common Tailwind Presets
Building a shared styling foundation for the entire NeoJET ecosystem.
In Progress
- Creating the neojet-tailwind package, a reusable Tailwind preset and tokens.css generator.
- Unifying color, radius, motion, and typography tokens across all NeoJET apps.
- Updating the web Cookbook to consume this preset, ensuring a single source of truth for visual design.
4. NeoJET Mobile Cookbook
Extending NeoJET's reach beyond the browser.
In Progress
- Building the NeoJET Mobile Cookbook with React Native + Expo.
- Using NativeWind v5 to map the same Tailwind classes and token values used on web.
- Demonstrating true cross-platform theming with consistent colors, spacing, and motion across web and mobile.
5. Automated Accessibility & Performance Checks
Ensuring quality, accessibility, and performance at scale.
In Progress
- Integrating automated accessibility testing with axe-core and jest-axe into the CI/CD pipeline.
- Setting up performance monitoring and benchmarks using Lighthouse CI and React performance profiling tools.
- Implementing automated visual regression testing to catch UI inconsistencies.
- Establishing performance budgets and alerts for bundle sizes, load times, and runtime metrics.
- Creating automated WCAG compliance checks for all components and documentation pages.
Looking Ahead
NeoJET's upcoming milestones focus on real-world data, accessibility, and developer tooling:
- Introducing DataProviders and Filters for dynamic data fetching, sorting, and pagination.
- Expanding Collections (List, Table, Tree) to support real-time data and server-side operations.
- Strengthening accessibility, performance, and DX with automated a11y checks and documentation polishing.
- Continuing to refine component APIs and design patterns.