This is a translation app built with React and React-Bootstrap
During the planning process, we created two user profiles to help guide us build the app.
There are six language translation options: English-French, French-English, English-German, German-English, English-Italian, and Italian-English.
Take a look at the live site here: translr
This app uses the Collins Dictionary API, which provides six different bilingual dictionary options. Once the user has entered a search query, made a dictionary selection, and clicked “Search”, the app returns an HTML string of the translation.
Since this is a small project, we used the Context API to manage state.
To keep elements consistent, we used React Bootstrap with some custom CSS.
We utilized Lighthouse and Axe as tools to help identify and fix any accessibility issues.