Cathy Hu's IST 276 Portfolio

IST 276 - Spring 2020

Assignments

Cathy's Recipe Book
Final project for IST 276.


Final Presentation
My Google Slides presentation for my final project.


Bootstrap Hobbies
A Bootstrap project listing my hobbies.


Test 2 Project Proposal
My proposal of creating a recipe book for my project.


Hobbies Project
An HTML5 file that lists my hobbies with images and links to external sites.


Styled Hobbies Project
An HTML5 file linked to a CSS stylesheet that decorates my hobbies page.


JavaScript Photo Collage
An HTML5 file that generates a photo collage of my hobbies with however many pictures the user decides to have.


SVG Web Graphic
An HTML5 file that includes an SVG based on the Arc de Triomphe in Paris.

Web Development Tools

W3Schools
W3Schools is an educational website for learning web technologies online. This website includes tutorials and references relating to HTML, CSS, JavaScript, and more.


Codecademy
Codecademy is an online interactive platform that offers free coding classes in 12 different programming languages including Python, Java, JavaScript, Ruby, SQL, C++, Swift, and Sass, as well as markup languages HTML and CSS.


HTML.com
HTML.com includes tutorials and guides for learning about tags, attributes, and everything else needed to master HTML and CSS.

Classmates' Portfolios

Bassett, Liam
Con-Roma, Sameal
Cutchens, Kyle
Elton, Sandy
Gambill, Evan
Garcia, Alvaro
Gumarin, JR
Hullfish, Noel
Iakovidis, Georgios
Idris, Kyra
Johnson, Jared
Langill, Trevor
Leicht, Rabun
Mayfield, David
Mitchell, Daniel
Pulliam, Jeremiah
Rangan, Anish
Rasmuson, Spencer
Robinson, Andrew
Sampson, Siriah
Sexton, Benjamin
Stuckey, Willow
Vaughan, Ian
Weber, Gabriel
Wessells, Karen

Current Trends

HTML (HyperText Markup Language) is the most basic building block of the Web. It defines the meaning and structure of web content.


Stop using so many divs! An intro to semantic HTML
One of the primary advancements of HTML5 was introducing a standardized set of semantic elements. The term "semantic" refers to the meaning of a word or a thing, so "semantic elements" are elements designed to mark up the structure of a document in a more meaningful way, a way that makes it clear what they're for, what purpose they serve in the document. And importantly, since they're standardized, these elements define the document in a way that everyone can use and understand, robots included.
Stop using so many divs! An intro to semantic HTML by Ken Bellows

Modern HTML Explained For Dinosaurs
Modern HTML can definitely be frustrating to work with as it continues to change and evolve at a rapid pace. Yet we’re able to do more now than ever before, and we are all essentially at the ground floor of a new industry with the potential to shape it into the platform we want it to become.
Modern HTML Explained For Dinosaurs by Peter Jang

CSS (Cascading Style Sheets) is a style sheet language used for describing the presentation of a document written in a markup language.


Time-saving CSS techniques to create responsive images
As a web developer, there is a high probability that you have encountered the two enemies of this article: images and deadlines. Sometimes, for some reasons, your images won’t fit the layout and you don’t want to wrap your head around this for hours.
Time-saving CSS techniques to create responsive images by Adrien Zaganelli

Scroll to the future
Most of the web pages do not fit on a single screen, so the ability to scroll information is taken for granted by all users. For front-end developers and UX designers, though, implementing scrolling experiences that work well across browsers, fit nicely into a design, and still perform well, can be a challenge.
Scroll to the future by Anna Selezniova and Andy Barnov

JavaScript is the programming language of HTML and the Web. It programs the behavior of web pages.


Clean up your code by removing ‘if-else’ statements
When we write JS code, we often encounter the situation of complex logic judgment. Generally, you can use if/else or switch to implement multiple conditional judgment, but there will be a problem: With the increase of logic complexity, if/else and switch in the code will become more and more bloated. This article will take you to try to write more elegant judgment logic.
Clean up your code by removing ‘if-else’ statements by bitfish

Intro to Generative Art
Often, generative art draws inspiration from modern art, especially pop art that makes heavy use of orderly geometric patterns. However, it is a very broad and rich category of art created with code with a central characteristic: Generative art is art built with code, but, on top of that, it incorporates a self-governed or autonomous system in some way.
Intro to Generative Art by Ali Spittel