31:[] 2f:{"title":"My First Javascript Call","cells":[{"id":0,"value":"md`# My First Javascript Call\n\nWhen writing code you often need to ask computers for information. This page shows you how to use Javascript to ask websites for information by calling information from their **application programming interface** (API).\n\nThe code below shows you how to request information:\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":212,"value":"md`\n## Ask an API for a picture of a dog\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":211,"value":"\n// This is the code which asks dog.ceo for a picture of a dog.\ndogPicture = {\n return fetch(`https://dog.ceo/api/breeds/image/random`) \n .then((data) => {\n return data.json();\n })\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":298,"value":"md`\nThe request gives you a URL to a picture of a dog: ${dogPicture.message}.\n\nTo get the URL add \\`.message\\` to \\`dogPicture\\` in the code below.\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":231,"value":"html`\n

\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":242,"value":"md`# Asking NASA for a Picture`","pinned":false,"hidden":false,"mode":"ojs"},{"id":47,"value":"md`\nNext, use the NASA Astronomy Picture of the Day API to get a picture and information about the picture.\n\nChange the date below to change the picture and information. Change the date to your birthday and see what picture and information comes up!\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":200,"value":"pictureDate = '2018-11-12'","pinned":false,"hidden":false,"mode":"ojs"},{"id":295,"value":"md`This is what you will build using HTML and CSS code:`","pinned":false,"hidden":false,"mode":"ojs"},{"id":285,"value":"html `${nasaDemo}`","pinned":false,"hidden":false,"mode":"ojs"},{"id":4,"value":"nasaData = { \n return fetch(`https://api.nasa.gov/planetary/apod?api_key=DEMO_KEY&date=${pictureDate}`)\n .then(data => {\n return data.json();\n });\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":275,"value":"md`\n## Make your own NASA website\n\nYou will now learn the code to make your own version of the Astronomy Picture of the Day website!\n\nPut your code below!\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":276,"value":"// YOUR CODE GOES HERE!!!\nhtml`\n

Put your heading here

Put your paragraph here

\n\n\n\n`\n// ==================================","pinned":true,"hidden":false,"mode":"ojs"},{"id":163,"value":"md`## References`","pinned":false,"hidden":false,"mode":"ojs"},{"id":249,"value":"nasaDemo = `\n \n

${nasaData.title}

${nasaData.explanation}

\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":316,"value":"// Get many doge !","pinned":false,"hidden":false,"mode":"ojs"},{"id":315,"value":"quantityOfDog = 5;","pinned":false,"hidden":false,"mode":"ojs"},{"id":321,"value":"\n// This is the code which asks dog.ceo for a picture of a dog.\nmanyDogs = {\n return fetch(`https://dog.ceo/api/breeds/image/random/${quantityOfDog}`) \n .then((data) => {\n return data.json();\n })\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":324,"value":"dogs = {\n \n let dogObj = {};\n \n manyDogs.message.forEach((dog, index) => { // Loops over the dog image urls returned\n dogObj[`dog${index}`] = dog; // Adds each URL to a dog object\n })\n return dogObj;\n \n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":323,"value":"html`\n

\n`","pinned":false,"hidden":false,"mode":"ojs"}],"files":"$W31","stdlib":"1","titling":"auto"}