https://github.com/jodieaddis/online-dictionary

Dictionary application providing definitions accompanied by examples, as well as synonyms for the chosen words.
https://github.com/jodieaddis/online-dictionary

chromatic cicd fetch-api react storybook tailwind typescript

Last synced: about 2 months ago
JSON representation

Dictionary application providing definitions accompanied by examples, as well as synonyms for the chosen words.

• Host: GitHub
• URL: https://github.com/jodieaddis/online-dictionary
• Owner: JodieAddis
• Created: 2024-03-04T08:27:08.000Z (11 months ago)
• Default Branch: master
• Last Pushed: 2024-05-22T12:42:18.000Z (8 months ago)
• Last Synced: 2024-05-22T13:53:14.932Z (8 months ago)
• Topics: chromatic, cicd, fetch-api, react, storybook, tailwind, typescript
• Language: TypeScript
• Homepage: https://jodieaddis.github.io/online-dictionary/
• Size: 1.93 MB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# Online Dictionary

## About the project

Dictionary application providing definitions accompanied by examples, as well as synonyms for the chosen words.

This application features 2 contexts:

- a dark mode

- a font choice for the page

All stories are hosted on Chromatic at this [URL](https://66028c5f30a593dce34bd401-kelrxyxbxg.chromatic.com/)

![Dictionary screen](public/assets/img/dictionary-desktop.png)

## Objectives

- Search for words using the input field

- See the Free Dictionary API's response for the searched word

- See a form validation message when trying to submit a blank form

- Play the audio file for a word when it's available

- Switch between serif, sans serif, and monospace fonts

- Switch between light and dark themes

- View the optimal layout for the interface depending on their device's screen size

- See hover and focus states for all interactive elements on the page

## Technologies Used