Deliverables
- A theme for your site that you feel comfortable with
- Complete all technical requirements for HTML, CSS, and Javascript
- Have markups of your pages
- Research for a public API that can provide you with content (Optional)
- Include a README file. The file should include technical specifications and description of your website.
- Host on GitHub, include the link to your GitHub account in the README file(optional)
- Submit the project in a ZIP file
HTML:
- Have at least 3 pages, keep the grid system consistent as much as possible
- Use at least 10 different HTML tags
- Use HTML tables
- Implement at least two uses for forms
- Dropped Down Menu
- Use web fonts
- Use different types of content in the form of text, images, videos, and GIFs
- Use regex validation
CSS:
- Inline, internal, and external styling
- Use five different CSS selectors
- Don’t use too many fonts
- Use colors that complement each other
- Use Flexbox (Optional)
- Use SASS/SCSS (Optional)
- Use animations (Optional)
Javascript:
- External scripts
- Use variables, if statements, loops, at least one form of collections, functions/call back, and events
- Use AJAX (Optional)
- Use JSON or XML (Optional)
- Use JQuery (Optional)
I have just come up with a wonderful new electronic item, and need to start taking preorders! This simple site will include a description of the device, preorder registration form, and a contact form. Images included will be open license (pexels, etc.), and videos/gifs will need to be sourced similarly. Javascript will be used to store and log data for now, though AJAX or JSON may be explored within the time constraints. Will also handle mouseover/mouseleave events. I'll do this while attempting to inject a little humor into it all: it's just as important to enjoy the ride as it is to get to your destination.
8/22/2020: I am calling this complete until I revisit it to improve it (after submission). There are a number of improvements to make:
- responsive pages. I did not feel comfortable making this one responsive in such a short time, but responsive is really the only way to go.
- I'd like to find a way to handle button click events on different pages in ONE JS script - my scripts would try to handle ALL button clicks in one go, which is... weird. Thanks, javascript.
- my styling is probably too excessive. I almost certainly repeated myself; this is something I need to practice.
- It's a little hard to come up with "reasons" to use some of the JS specified. Perhaps I should have chosen something else, but I am not sure what would have used those well. Perhaps a tutorial site?
Regardless, this site covers most, if not all, of the required deliverables.: many tags, 2 forms, 3 pages, tables, different content (all royalty free!), dropdown, regex, CSS all ways, 2 fonts (one web), variables, loops, arrays/objects, functions, and events.
This was certainly a useful exercise: I have some idea of what I need to do to improve, and I still feel accomplished. Onto the next!