code icon

CSCI 1720

Intermediate Web

assignment logo


Homework 0 - Office Visit

An important part of the academic experience is seeking out and meeting with your instructors when you have issues with their classes. Or are bored (IMO) and have downtime. So....

Homework 0.1 - Vocabulary

Mastering vocabulary

Homework 0.2 - Vocabulary

Mastering vocabulary

Homework 1 - Typography

In this assignment, we will further explore typography by installing a custom font into a site, instead of using Google Fonts

Homework 2 - Personas

This exercise will help us better understand a fundamental aspect of design for websites. We'll create a pair of user personas. Personas allow our developers to make informed decisions regarding the design of websites that are user-centric

Homework 3 - BS Landing Page

This assignment will start us out with Bootstrap, creating a landing page for a mini-site that we're going to create with Bootstrap. Over the course of several activities, we're going to create a Bootstrap site including a landing page, a page illustrating the grid layout, and one with a Bootstrat carousel

Homework 4 - Bootstrap Carousel

In this assignment, we will create an image carousel using Bootstrap. It will include some images from past sci-fi movies. As a bonus, you'll get to figure out which movies

Homework 5 - Cards

In this assignment, we'll create cards with embedded CSS. Plus a little JavaScript/jQuery. Cards are a popular HTML/CSS construct for constructing pages that are user-friendly. They can be used as 'teasers' to draw a user into the site

Homework 6 - More Animation

With this assignment, we'll further explore some of the advanced features of CSS 3 and animate some pictures

Homework 6.1 - More Vocabulary

With this assignment, we'll do some more vocabulary work - past & future

Homework 7 - Javascript I

We're going to start a series of assignments that will ultimately result in a page with the lyrics of a song and an 'introductory' modal; and an embedded audio player with custom controls to play the song. With this assignment, we'll set up the project and complete some of the CSS we'll need along the way. HW 8 & HW 9 will further style the page and add the audio player

Homework 8 - JavaScript II

We'll continue working on our music page by customizing the audio controls and using custom icons for the play/pause and volume controls

Homework 9 - JavaScript III

Just some final touches (last minute, that occurred to me) to HW7 & HW8 that'll help demonstrate audio controls, dynamically adding/removing CSS, forEach(), drop-caps, and more!

Homework 10 - jQuery III

Let's work a little more with form validation. A nice feature to include with form validation is some feedback to show the user exactly where he or she screwed up. Adding a red border or highlighting text are often used. We want to prevent form submission until the form is properly completed. This will build on our jQuery 2 lab, so we'll also have the animation in place

Homework 11 - JS Bitcoin Ticker

This excersize will give you practice with asynchronous JS - We'll create a page that queries a remote site every 10 seconds to obtain the current value of Bitcoin and update a display. It will also calculate the change in value from the last check. Finally, it will generate a table that updates every 30 seconds to provide a running tally

Homework 12 - jQuery Use-Case

This exercize will provide you with an opportunity to solve a real-life use-case. The 'use-case' is a page with several ordered lists that we want to present to the user like a single list with correctly numbered items. Each list will have a single list item. The list items, then, should display with numbers 1, 2, 3, and so on

HW 13 - HTML Color Picker

This exercise will provide more practice with CSS, Flexbox, and JavaScript, as well as introducing you to the Color Picker HTML 5 form element. We'll take a starter page and add the color picker form control to it, style the page (including Flexbox), and add JavaScript that will allow users to select custom colors interactively