We're going to use JavaScript to make a webpage that displays a random quote. We'll use the built-in fetch
method to call an API that will give us quotes. An API means "Application Program Interface", but in web programmer vernacular, it typically means a 3rd party website that gives us some sort of data.
- Fork and clone this repository
- Run
npm install
to install dependenciesnpm start
- start the BrowserSync server- This will reload your code every time you save. How convenient!
- You need this. See note below.
- Setup your HTML page, and don't forget to include links to the CSS and JS files!
- Be creative in your choice of styling. Think about all of those different CSS properties.
Note: BrowserSync runs a local server on your machine - this means your code will be running on
http://localhost
instead of directly from the file itself.
Your instructor will provide an appropriate API. Stay tuned!
- Using HTML, CSS, and JavaScript, create a webpage that displays a random quote on the page when a button is clicked
- Every time the button is clicked, clear the old quote and replace it with a new random quote.
- Use the
fetch
function to obtain a quote from your chosen API.
- Use the dad joke API.
- Note that this requires you to send something in the request header!
- Take a look at the docs and see if you can figure it out!
- This API also allows you to use images! If you implement this, how will it change your code?
- All content is licensed under a CC-BY-NC-SA 4.0 license.
- All software code is licensed under GNU GPLv3. For commercial use or alternative licensing, please contact [email protected].