diff --git a/week-8/Homework/.vscode/settings.json b/week-8/Homework/.vscode/settings.json new file mode 100644 index 000000000..6f3a2913e --- /dev/null +++ b/week-8/Homework/.vscode/settings.json @@ -0,0 +1,3 @@ +{ + "liveServer.settings.port": 5501 +} \ No newline at end of file diff --git a/week-8/Homework/mandatory/1-practice/1-practice.md b/week-8/Homework/mandatory/1-practice/1-practice.md index 02aa34989..155167dd3 100644 --- a/week-8/Homework/mandatory/1-practice/1-practice.md +++ b/week-8/Homework/mandatory/1-practice/1-practice.md @@ -25,7 +25,10 @@ The following endpoint is publicly available from Github 1. What would you put in the following fields? `{owner}`, `{repo}`, `{pull_number}`? - +`{owner}`- username +`{repo}` - name of repo +`{pull_number}`- pull request number 2. Describe in a sentence what this API endpoint returns when all of the fields are completed? +Lists details of a pull request by providing its number \ No newline at end of file diff --git a/week-8/Homework/mandatory/2-fetch-exercise/exercise.js b/week-8/Homework/mandatory/2-fetch-exercise/exercise.js index fb3a39c2a..7b6663478 100644 --- a/week-8/Homework/mandatory/2-fetch-exercise/exercise.js +++ b/week-8/Homework/mandatory/2-fetch-exercise/exercise.js @@ -17,10 +17,23 @@ Open index.html in your browser. Every time you refresh the page, a different greeting should be displayed in the box. */ -fetch('*** Write the API address here ***') - .then(function(response) { - return response.text(); +fetch('https://codeyourfuture.herokuapp.com/api/greetings') + .then((response )=> { + return response.text(); }) - .then(function(greeting) { - // Write the code to display the greeting text here - }); \ No newline at end of file + + .then((greeting)=> { + + addGreeting(greeting) + }) + + // .catch((error) => { + // console.log(error); + + // }) + + const addGreeting = (greetingObj) => { + const pElement = document.getElementById("greeting-text"); + pElement.textContent = `${greetingObj}`; + + } \ No newline at end of file diff --git a/week-8/Homework/mandatory/3-dog-photo-gallery/index.html b/week-8/Homework/mandatory/3-dog-photo-gallery/index.html new file mode 100644 index 000000000..785e240a3 --- /dev/null +++ b/week-8/Homework/mandatory/3-dog-photo-gallery/index.html @@ -0,0 +1,37 @@ + + + + + + + Document + + + +
+ +
+ + + \ No newline at end of file diff --git a/week-8/Homework/mandatory/3-dog-photo-gallery/script.js b/week-8/Homework/mandatory/3-dog-photo-gallery/script.js new file mode 100644 index 000000000..4fc17771f --- /dev/null +++ b/week-8/Homework/mandatory/3-dog-photo-gallery/script.js @@ -0,0 +1,41 @@ +function getImage(){ +fetch ('https://dog.ceo/api/breeds/image/random') +.then((response )=> { + return response.json(); + }) + + .then((randomDogImg)=> { + //console.log(randomDogImg.message); + + getRandomDogImg(randomDogImg) + }) + + .catch((error) => { + console.log(error); + + }) +} + + +const main = document.getElementById('main') +const btnElement = document.createElement('button') + btnElement.innerText = 'Show next image' +const ulElement = document.createElement('ul') + main.append(btnElement, ulElement) +const liElement =document.createElement('li') + liElement.classList='list' +const imgElement =document.createElement('img') +const containerList = ulElement.appendChild(liElement) +const imgList = liElement.appendChild(imgElement) + + const getRandomDogImg= (dogImg) => { + imgElement.src = dogImg.message + +} + +// Next button +btnElement.addEventListener('click', getImage) + + + + \ No newline at end of file diff --git a/week-8/Homework/mandatory/4-programmer-humour/index.html b/week-8/Homework/mandatory/4-programmer-humour/index.html new file mode 100644 index 000000000..4f967874a --- /dev/null +++ b/week-8/Homework/mandatory/4-programmer-humour/index.html @@ -0,0 +1,15 @@ + + + + + + + Document + + +
+ +
+ + + \ No newline at end of file diff --git a/week-8/Homework/mandatory/4-programmer-humour/script.js b/week-8/Homework/mandatory/4-programmer-humour/script.js new file mode 100644 index 000000000..299d38826 --- /dev/null +++ b/week-8/Homework/mandatory/4-programmer-humour/script.js @@ -0,0 +1,30 @@ +function getHumour(){ + fetch ('https://xkcd.now.sh/?comic=latest') + .then((response )=> { + return response.json(); + }) + + .then((data)=> { + console.log(data.title); + console.log(data.alt); + + getData(data) + }) + + .catch((error) => { + console.log(error); + + }) + } + + const main = document.getElementById('main') + const imgEl =document.createElement('img') + main.append(imgEl) + + const getData= (data) => { + + imgEl.src = data.img + + } + + getHumour() \ No newline at end of file diff --git a/week-8/Homework/mandatory/4-programmer-humour/style.css b/week-8/Homework/mandatory/4-programmer-humour/style.css new file mode 100644 index 000000000..e065d3f1d --- /dev/null +++ b/week-8/Homework/mandatory/4-programmer-humour/style.css @@ -0,0 +1,12 @@ +*{ + box-sizing: border-box; + background-color: rgb(132, 91, 138); +} + +img{ + display: flex; + padding: 70px 500px; + height: 600px; + border-inline: rgb(218, 64, 97); + +} \ No newline at end of file