The file intro.js contains examples of basic JavaScript syntax as in the slides. You can run this file by running the following in the terminal.
$ node intro.js
Note: if node is not installed, please install it here
The files index.html, style.css, and button.js form a sample web page that uses JavaScript. You can see the web page by simply opening index.html in the browser of your choice. One way to do this is the following terminal command.
$ open index.html
This week's activity will involve you returning to the recipe website from Week 2! You will use what you have learned about JavaScript and/or learn more HTML/CSS in order to improve the functionality of your recipe website. This will also be an open-ended task as you can apply HTML/CSS/JavaScript to this website in many different ways.
Some ideas are listed below with tips. Feel free to use as many or as few of them as you like. You are also encouraged to think of your own ways to improve the website.
- Create a navigation bar to move between different parts of the website
- Possible without JS, see <nav>
- Connect each recipe on the list page to its specific recipe page
- Possible without JS, see <a>
- Create an editable recipe page
- Use JS to create text fields
- Add a button to recipe pages that changes measurement units
- Use JS to handle click event and change text