Write a JSON mobile app using JavaScript: fetch API for 5 authors (Lao Tzu, Abraham L.,...

Question

Question

Write a JSON mobile app using JavaScript: fetch API for 5 authors (Lao Tzu, Abraham L., Aristotle, Bo Jackson, Leonardo Da V.) inspirational quotes using below links. Describe code in comments, include HTML and style pages to be processed in brackets. Use the below example format for the app: Keep it simple.

Current Weather Get Weather San Diego, CA Select the city then press button for current weather City: San Diego Condition: sc https://www.freecodecamp.org/forum/t/free-api-inspirational-quotes-json-with-code-examples/311373

https://type.fit/api/quotes

engineering Computer-Science

Add a comment Improve this question Transcribed image text

Answer 1

Answer #1

A house divided against itself cannot stand. Abraham Lincoln Be the chief but never the lord. Lao Tzu Well begun is half done

<!DOCTYPE html>
<html>
   <head>
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
        <style>

        body {
            font-family: Verdana, Arial, Helvetica, sans-serif;
            font-size: 87.5%;
            width: 650px;
            margin: 0 auto;
            border: 2px solid blue;
        }
        div {
            margin: 5px;
            padding: 5px;
        }
        p, h4 {
            margin: 3px;
        }
        </style>
   </head>
   <body>
        <div id="quotesDiv">

        </div>
        <script>
            var authors = ['Lao Tzu', 'Abraham Lincoln', 'Aristotle', 'Bo Jackson', 'Leonardo da Vinci'];
            const settings = {
              "async": true,
              "crossDomain": true,
              "url": "https://type.fit/api/quotes",
              "method": "GET"
            }

            $.ajax(settings).done(function (response) {
              const data = JSON.parse(response);
              var div = $('#quotesDiv');
              for(var i=0; i<data.length; i++) {
                var quoteDiv = "<div><h4>" + data[i].text + "</h4>";
                quoteDiv += "<p>" + data[i].author + "</p></div>";

                if(authors.includes(data[i].author)) {
                    div.append(quoteDiv);
                }
              }
            });

        </script>
   </body>
</html>

**************************************************

Thanks for your question. We try our best to help you with detailed answers, But in any case, if you need any modification or have a query/issue with respect to above answer, Please ask that in the comment section. We will surely try to address your query ASAP and resolve the issue.

Please consider providing a thumbs up to this question if it helps you. by Doing that, You will help other students, who are facing similar issue.

Add a comment

Answer 2

Write a JSON mobile app using JavaScript: fetch API for 5 authors (Lao Tzu, Abraham L.,...

Homework Answers

Add Answer to:
Write a JSON mobile app using JavaScript: fetch API for 5 authors (Lao Tzu, Abraham L.,...

Post as a guest

Earn Coins

Write a JSON mobile app using JavaScript: fetch API for 5 authors (Lao Tzu, Abraham L.,...

Homework Answers

Add Answer to: Write a JSON mobile app using JavaScript: fetch API for 5 authors (Lao Tzu, Abraham L.,...

Post as a guest

Earn Coins

Add Answer to:
Write a JSON mobile app using JavaScript: fetch API for 5 authors (Lao Tzu, Abraham L.,...