ACAD 275: Dev I
Iovine and Young Academy
ACAD 275: Dev I
Web Experiences
Aaron Siegel | | 2/21/2023
(use your left and right arrow keys to navigate slides)
Interactivity
Web Publishing
Basic production of web pages using HTML and CSS.
Web Development
Interactivity, database calls, dynamic pages, everything beyond publishing.
Server-side Web Development
Code that runs on the server using a server-side scripting language like PHP.
Client-side Web Development
Code that runs directly in the browser on the user's computer. This can only be done with JavaScript.
Frontend Technologies
HTML is for Structure
HTML allows you to define how your content is structured within your page.
CSS is for Appearance
CSS allows you to style the appearance of the content within your page.
JavaScript is for Behavior
JavaScript allows you to program the behavior and interactivity of the content within your page.
HTML: Hypertext Markup Language
Creates objects on a webpage.
Attributes of HTML objects are properties of that object.
CSS: Cascading Style Sheets
Does not create objects, only refers to ones that can exist.
Written in stylesheets or inline with HTML elements.
Pseudo-classes afford a limited amount of interactivity through CSS.
JavaScript
Redefine objects and their properties.
JavaScript libraries are packages of code that people can use to build more complex things in easier ways.
Frameworks are more complex combinations of technology that make production of more complex applications easier for the developer.
JavaScript allows pages to be dynamic after they are loaded.
JavaScript can provide logic and process data asynchronously.
Acts a bridge between (1) the user and the page, (2) the page and the server, and (3) the HTML and CSS.
JavaScript Functionality
Manipulate Objects.
Create Objects.
Store data in variables and arrays.
Calculate (perform mathematical operations).
Logical branches (conditional statements, comparators, operators).
Event based execution of code.
JavaScript Common Usage
Validate data in forms.
Respond to user interaction with objects on a page.
Change content or stylesheets.
Load data from a server.
Create dynamic menus.
Animate elements.
SAAS products.
JavaScript Examples
Image swapping and pre-caching.
Interactive UIs.
Storing/Retrieving Data.
Form Validation.
Interactive Data.
Dynamic HTML.
When Does JavaScript Work?
On page load.
After an established interval.
Upon user interaction (mouse rollover, click, etc).
When the user completes a requirement.
When a process is complete (an event is triggered).
If a bad condition is met (an error has occurred).
Fundamental JavaScript Concepts
All HTML tags are objects.
All objects can have properties (attributes).
Alter objects and their properties.
Event based code.
Add/bind events to objects.
Functions (arguments, returns).
What has JavaScript enabled?