Phonics ESL

A simple tool to review English Phonics based on Jolly Phonics.

This project was built in order to explore TailwindCSS.

This project was bootstrapped with Create React App.

Features

• React Hooks (useState, useEffect, useRef)
• Functional Components
• Search Functionality
• Simple Modal System
• Light / Dark Theme (saved in localStorage)
• Mobile First Design

Screenshots

Mobile

Desktop

Development

• Did you notice a bug? Please report it here
• Want to request a feature? Please let me know here

References

• React + Tailwind Setup
• Hover tooltips
• CSS Triangle for tooltip
• Referencing HTML audio element
• Jolly Phonics Sounds
• Jolly Phonics Gestures
• Modal with tailwindcss
• Modal closing behaviour