The Tomato Page

Tech task to convert Tomato PDF page to React Web App.

Live Link

Process from PDF to Build

• Extracted text from pdf tomato page to save to JSON files to support scalability.
• Optimised tomato image file size from 215kb to 60kb, keeping original high-res dimensions to support retina devices.
• Created rough layout in css with divs and placeholders, including tomato view page.
• Built scalable components; table, tab, form for tomato page view with data input from JSON files.
• Further development.
• Final testing.

Features

• Scalable App
• Custom fav icon
• Lazyloading for image and components
• PWA compliant
• Lighthouse testing pass
• HTML testing pass
• CSS testing pass
• Accessibility testing pass

Testing Results

React Testing
Basic test to check page h1 title loads with test id

Google Lighthouse

Accessiblity Testing Link

CSS Testing Link

HTML Testing Link

Author

Rishi Singh Bhachu