Dynamic Web Programming

582-21B-VA

Bruce Norton

our sites

THE plan (or at least plan B)

day 22 23 of 24

project 4 presentations: Oct. 2 & 5th. You will have until Tuesday, October 10th @8a.m. to update your apps.

day 21 of 2 dozen

day 20 of 24

relations and links

day 19 / 24

week 22 of 24

are we related?

logins make it more complex.

ex 4.1: project 4 description

Add a short description of your project to to your dynamic website that includes:

due: 09/21

ex 4.2: relational db select

Create a page that displays data from 2 related tables

Just that. 2 tables. Display data from both using primary & foreign keys in your query.

Display your query on your page.

due: 09/21

day 17 of 24

presenting... [drum roll please] ...data

Project 4: relational db group project

Create an application that uses a relational database to share & gather information that helps solve a problem, provoke thought, entertain or delight. Work in a group in one of the following ways:

The minimum requirements include doing the following:

Ideally your database should build on what we have learned in projects 1 & 2 & 3 including:

evaluation

due: presentations on Sept. 28 / Oct. 2

final: Oct. 5th at midnight

day 16

focus on the base... the data base

class 15/24

based on data

day 24-10 / 24

collaborating and iterating

getting & giving feedback

Plus an article regarding feedback:

ex 3.3: db app alpha version or working draft

Share your app alpha version with your partners.

Save this feedback to incorporate into a Case-Study for your portfolio.

to share 09/11

ex 3.2: db app plan (started)

Share your app plan including:

to share 08/31 & 09/07

another day /24

Project 2: Personal API feedback

Project 3: dynamic db app

Create an application that uses a database share & gather information that helps solve a problem, provoke thought, entertain or delight. The minimum requirements include doing the following:

Ideally your database should build on what we have learned in projects 1 & 2 including:

evaluation

due: Sept 14th presentation with a few days to fix up based on feedback!

ex 3.1: select & insert

Create a necessary pages to select & insert data. At a minimum you will probably need 3 files.

day 12: half full or half empty?

day 11/24: db baby!!

This is the day your life will surely change. Or at least we are taking a step backwards towards... well forwards really but towards the backend.

db resources

Note that we are using php & mySQL, administered through PHP MyAdmin.

The programming style we are using is "procedural" using plain php without any framework. Object oriented and PDO are 2 other popular styles. Better, but more complex to start.

day 10/24: we be interfacing

here's the plan

day 9/24: maps & objects

feeling lost? Consult the maps!

ex2.2 maps API

Do like Dora. Call a map, any map. Your map API should use Google API to call a map. It can be any one of the following.

Bonus challenge: add a feature based on the Google Maps JS documentation, or an idea of your own.

due: August 14 or 21st

1/3 of the way (day 8/24): personal API

other good resources

Let's take a look at @media queries with this gallery example.

homepages feedback

some general feedback on homepages

day 7/24: review? maps?

review??

share your plan in small groups

The first step in being able to create a good application is to be able to express it in plain language.

Google Maps API?

day 6/24: popular APIs

here is a list of popular APIs suggested by chatGPT

ex2.2 MVP API (minimum viable product)

Choose an API that interests you. Google topics of interest or check out this list from ChatGPT above. The idea is that you use this as a first step towards developing your app fully. Your app should include:

due: August 10th at the end of class

day 5/24: we are now dynamic!!

day 4/24: CSS & grid

Project 2: API app

Your API app project is designed to learn how to integrate a dynamic data source, using UI/UX principles. In the next project we will be creating our own API from an original database that we create.

Create an app using an API that allows user interaction. Your app should:

evaluation

due: August 17th before class

ex2.1 weather app

Using the openweathermap.org api (or similar) create a weather app that uses a public API. You app development should include:

Focus on js coding, keep the design simple & utilitarian.

due: Thursday August 3 by the END of class

API resources

in-class weatherAPI demo

in-class demo videos

my videos

APIs There are thousands of APIs available. Here are a few we will look at in class. Find one about a topic that you are intested in.

PHP / db resources

We will use mySQLi procedural coding. While OOP (Object Oriented Programming) may be better & less verbose, it is also more difficult for beginners.

day 3/24: scrum

resources

agile development resources

"Daily scrum or stand up: This is a daily super-short meeting that happens at the same time (usually mornings) and a place to keep it simple. Many teams try to complete the meeting in 15 minutes, but that's just a guideline. This meeting is also called a 'daily stand-up' emphasizing that it needs to be a quick one. The goal of the daily scrum is for everyone on the team to be on the same page, aligned with the sprint goal, and to get a plan out for the next 24 hours.
What is scrum and how to get started, Atlassian

day 2/24: clean up & semantic HTML

layout & moodboards

Here are a few resources to help you. A short video and 2 articles.

sketching an app / webpage

It's important to develop a design process. Here's a basic one that you can use, build on and refine as needed.

Here are some helpful resources:

video demos

exercise 1: sitemap

Create a site map for your webroot homepage.

Your sitemap will probably resemble the example I provided.

It should:

file naming convention:: I strongly suggest you use ONLY the following letters, numbers and characters when naming files:

Do NOT use capitals, spaces or other special characters. Trust me... it will make your life simpler.

due: Thursday, July 20 (end of day)

exercise 2: wireframe

Create a mobile-first sketch and then a wireframe for your /dynamic homepage.

Refer to the videos above for examples.

Your sketch should give a rough idea of your site layout.

Your wireframe should include all the page's elements.

due: Monday, July 24 before class.

exercise 3: moodboard

Create a moodboard based on your sketch and wireframe for your /dynamic homepage.

Your moodboard should include the following:

My suggestion is to keep it simple at this point.

due: Thursday, July 27 before class.

project 1: homepages

Create a homepage that links to all your classes and class homepages that link to your assignments

You will create at least 2 pages, but as many as 10 or more.

Your web root (httpdocs) homepage should include:

Your class homepages should include:

All your pages should apply web design and UI/UX best practices, what you have learned in your classes including these principles:

Your pages should probably include the following elements

Also use CSS grid for layout.

Note that we'll do some exercises with the following deliverables:

due: Monday, July 31 Thursday July 27 at beginning of class when you will present your home & dynamic web programming pages to the class.

house keeping

Here is a list of house-keeping things we need to do.