Quote Translator

A small mobile first application that allows the user to get or enter a random quote and translate it to a "language" of their choice selected from a menu system

User Story

As a user who needs to have quirky and unique
I want to pull a random quote or translate my own quote
Then have it translated to a language I select from a drop down menu
When I refresh or return to the page I wish to still be able to view my translations

API's used

Quote API to generate text to be translated if the user does not what to input thier own text

Fun Translations API as the source of the translations

Moment.JS API to keep track of the time, as the user can only make 5 translation requests per hour at Fun Translations

CSS Framework

This application uses Materialize as its style framework. Using the grid system to set up the page, the built in color's for style, as well as using Materialize's modal code to have additional functionality to the page without taking up vertical space when on Desktop, allowing the app to transition from Mobile to Desktop smoothly.

A Mobile First & Interactive Design

This app was built with the Mobile Friendly design, the textareas are colored to be easier to indentify the different areas of the the app, and stacked vertically so that the user can interact easily. The last 'row' / text area that displays the users translations is transformed into a modal that pops up and dispaears in order to keep the desktop version readable and easy to use as well.

Current Build Status

Version 1.0 - Initial build and planning

Github Deployed

Currently the site is hosted with github

link to live site: https://saunderseddie.github.io/QuoteConvertor/index.html

Code:

Developed with HTML5, CSS3, JavaScript, JQuery, and Materialize using Visual Studio Code

Credits:

reset.css - Eric Myer https://meyerweb.com/eric/tools/css/reset/
translation API - https://funtranslations.com/
Quote API - https://favqs.com/api/qotd
Materialize - https://materializecss.com/
Elma Fudd - https://www.warnerbros.com/company/divisions/television
Hamlet - https://www.sonypictures.com/
Cockney - https://www.youtube.com/watch?v=1WvIwkL8oLc&t=50s
Pirates of the Caribbean - https://pirates.disney.com/
Swedish Chef - https://www.henson.com/

Development:

Lauren Cameron https://github.com/lolo-bc
Tevin Ward https://github.com/TevinWard7
Yalmar Mairena https://github.com/YalmarMV
Eddie Saunders https://github.com/SaundersEddie