If you'd like to tackle another project, check out the prompts below.
Follow along with the same set of lessons you've just completed. This time, instead of creating a website to list your programming goals, create one of the sites detailed below. Moving from following a lesson exactly to simply referencing a lesson is the next step to internalizing the concepts you've learned today.
Create a website to display basic information for a (real or fictional) local business such as a food cart or shop.
This time, instead of using HTML to list your programming goals, list relevant information about that local business. What might visitors to their site need to know? Examples include address, phone number, hours of operation, and images of the business.
Next, add some custom classes and ids to the various HTML elements you added in the last step. Then create CSS rules to style them.
Finally, create a form where visitors to the site may leave comments and/or reviews about the local business.
Make sure to save your work by pushing it to GitHub. You may also want to save this site to GitHub Pages.
Create a basic "discussion board" website where users can converse about a topic of your choosing. Examples include board games, other hobbies, food, and so on.
Use HTML to list relevant information about the discussion group. What might visitors need to know? What is the focus of the discussion board? Are there any rules for posting? Perhaps an image relevant to the discussion topic?
Add custom classes and ids to the various HTML elements you added in the last step. Create CSS rules to style them.
Create a form where visitors to the site may post comments about the topic at hand. If you'd like an extra challenge, try experimenting with adding two text fields to your form: One for the user's name and another for their comment. Note that this will require each field to have a unique
id property. You'll also need to fetch user input from each unique field with a separate line of jQuery code.
Make sure to save your work by pushing it to GitHub.
Are you ready to learn something new? Check out the Divs and Spans lesson from our full-time Intro to Programming class.
<span></span> tags can be used to apply CSS styles to multiple HTML elements at once. After reading and/or watching the lesson in its entirety, experiment with including divs and spans in one of your projects from today.
Lesson 8 of 8
Last updated April 30, 2020