NewtFire logo: a mosaic rendering of a firebelly newt
newtFire {dh}
Maintained by: Elisa E. Beshero-Bondar (eeb4 at Creative Commons License Last modified: Monday, 14-Sep-2020 15:30:42 UTC. Powered by firebellies.

Fall 2020 Syllabus (Schedule) Classes meet M W F 10:10 - 11am over Zoom and in Kochel 77. Zoom attendance is required for all students in all class meetings. The classroom is optional, but even in the classroom you will be connecting to Zoom to team up with your classmates. We plan to host Wednesday meetings only in Kochel 77, as long as the class is willing and it is safe. For in-class meetings, we must all wear masks and maintain a safe social distance. Remember: Your mask protects me, my mask protects you.

Read the Course Description

This contains a detailed explanation of course policies and the basis for grades.

Jump Down to the Schedule

This link jumps to the closest day to today's date. Review the schedule as we get started to get a sense of how this course will work on a daily basis.

All the Tools You Need As We Begin:

Download and install the following software on your own personal computer(s) on or before the first day of class. These software tools are available in our campus computing labs, too.

  1. <oXygen/>. The DIGIT program has purchased a site license for this software, which is installed in Kochel 77 and the Lilley Library computers. The license also permits students enrolled in the course to install the software on their home computers (for course-related use only). When installing this on your own computers, you will need the license key, which we have posted on our course Announcements section of Canvas.
  2. Zoom: Make sure your Zoom installation is up-to-date, and you are ready to connect. The Zoom link for our regularly scheduled class meetings is posted in Canvas: Look for the Zoom menu option.
  3. All students require a good means of secure file transfer (SFTP) for homework assignments and projects (also available in the campus computer labs). There are several good options available. We recommend you download and install on your own computers one (or more) of the following, depending on your platform: (Feel free to experiment with these and others!)
    • Windows users: one of the following FTP clients—the functionality is similar:
      • FileZilla (This is our favorite client because it behaves the same way across platforms.)
      • WinSCP (This is one we used for a long time, since the 1990s, but we now use SSH and Filezilla more frequently.)
      • SSH Secure Shell Client
    • Mac users:
    • Linux users: You probably don’t need to install anything, but look at how your system handles secure file transfer (SFTP). (FileZilla or other clients designed for Linux environments.)
  4. Rusty with coding? Don‘t remember anything from DIGIT 110? Don’t worry! Past students in this course who never saw anything like markup or XML code have designed projects (like these) and even spoken about them at undergraduate conferences! You will learn to develop your own digital tools and how to manage digital projects as teamwork.
Class Web Resources:
Week 1 Topics Do before class

M 08-24

Welcome! Introduction to the course. Clay Shirky on Love, Internet Style and the Ise Shrine (9 minutes) What does an ancient wooden shrine have to do with digital projects? Intro to XML in oXygen and some things we can build with it. Respond to Dr. B's Poll (see Canvas / Penn State email). Find the Zoom link for class (on Canvas / Penn State email).

W 08-26

XML coding: a recipe for Whipt Syllabub. Elements, attributes, comments, escape characters, and "pretty-printing" in <oXygen/>. How file systems recognize XML documents (File extension, and XML declaration line). Introduce XML Exercise 1. Install oXygen XML Editor and add our license key so we can all use this during our meeting today. Read my Introduction to XML and experiment with the code in the tutorial: Can you tell what makes markup well-formed or not?

F 08-28

Complete XML Exercise 1
Week 2 Topics Do before class

M 08-31

Discussion of homework (XML Exercise 2). Introduce the Bash shell and GitHub. Complete XML Exercise 2: Revise the code in your XML Exercise 1 to do the following:
  • Add @xml:id attributes to either equipment or food items (or both), and come up with distinct identifier codes.
  • Look for words in the steps that reference the distinct identifiers and apply new markup with attributes that point to or reference the xml:ids
  • Look for historical details of interest and/or action words to code and reference.
  • Revise the code of the Syllabub recipe to match the new code of your Shrewsbury Cake recipe. Consider putting @xml:ids on the recipe root elements, and pointing to those codes from each recipe when it refers to the other one.
  • Submit your revised Syllabub and Shewsbury Cake recipes on Canvas for XML Exercise 2.

W 09-02

Getting started with command line, git, and GitHub. Mindful file management. Markdown vs. markup in GitHub issues: Hands-on work with our class GitHub repo. Git Exercise 1 (setting up your GitHub account). Watch my video introducing the Bash shell and "home" on your computers and practice the shell commands I am introducing.

F 09-04

Adding cp and mv to the shell commands list. Learning git commands and working at command line (hands-on exercise). Building a code repository for a digital project.
Week 3 Topics Do before class

M 09-07 Labor Day, PSU classes in session anyway!

  • Overlapping Hierarchies: Group Exercise with "Ozymandias."
  • User Experience (UX): Launch discussion.
  • Git Shell Practice (starting today for seven days): Make sure your personal repo and the class repo are properly set up and cloned to your computer. Using your Bash shell, practice some basic git commands to build a habit. On alternating days, push to the other repo (if you pushed to your personal repo today, tomorrow you will pull and push a file to our class repo).
  • Complete XML Exercise 3: Mark up a text of your choice (any genre, manageable but reasonable size, any language). Work on applying attributes with your elements in a careful and systematic way.
  • Review feedback on your coding exercises so far and submit revisions if I asked you to.

W 09-09

Hands-on introduction to schemas with Relax NG: How to write the rules for an XML project

F 09-11

Relax NG: data types, mixed content. Document data modeling.

Watch my video on Relax NG and how to write it in oXygen, and complete Relax NG Exercise 1:
  • Make a folder to hold this homework, since it will contain two files. Save the folder using our homework filenaming conventions.
  • Open this ozyMeta.xml file (open the link, and right-click to save on your computer with your homework, then open in oXygen).
  • Open a new Relax-NG Compact syntax file in oXygen, and set your editor in tile view so you can see the ozyMeta.xml file next to your schema file. Delete the code in the Relax NG file so you have a blank slate to start with.
  • Write a Relax NG Schema in Compact Syntax that models the content of this XML file as you study it. (Save the schema in the same directory with your XML file so you can easily find it.)
  • Associate the schema with the XML file (in oXygen go to Document > Schema > Associate Schema, and browse to locate the schema. Click OK and note the new schema line at the top of your XML file.
  • Zip (compress) the file directory holding your XML file and the Relax NG schema file, and submit this on Canvas at the upload point for this assignment.
Review XML syntax and consult the Intro to Relax NG as you work on this, and ask for help on out digitProjectDesign-Hub by opening an issue if you get stuck. Continue GitHub practice!
Week 4 Topics Do before class

M 09-14

Troubleshooting and debugging Relax NG issues. Tour of course projects with strong research questions. Initiate Class GitHub Project Proposals
  • Complete Relax NG Exercise 2: Write a Relax NG schema for one of the XML documents you created for the XML homework assignments (making changes to the XML as you wish). Upload both your XML and your schema file in a zipped (compressed) directory on Canvas.
  • Post in Discussion of student digital projects on digitProjectDesign-Hub

W 09-16

Relax NG and project team management. Work on Relax NG issues. Discuss project ideas, research questions.
  • Complete Relax NG Exercise 3: This time, choose a new text that you haven't marked up before and perform document analysis (study the document's structure and interesting features). Then write a Relax NG schema, mark up the text according to the schema, and upload both your XML and your schema file to Canvas.
  • Post project proposal idea on digitProjectDesign-Hub
    • Beginning from today through F 9-18: Post proposal ideas (each in its own issue) for team projects to work on this semester. Each student should post an idea for the class to consider: a project involving XML markup to be managed within a team of 2-4 students to investigate something we could study and visualize from our markup more effectively with computers than with human reading and description alone. All projects must involve a team of at least two persons, but this first exploratory proposal is an individual assignment.
    • Each student must respond to at least one of the proposed ideas from another student and indicate suggestions or further ideas. You may respond to more than one if you like, and indicate which proposals interest you to work on.
    • Proposal discussions will run until class time on M 9/21 when we will form project teams.

F 09-18

Project ideas and research questions to explore patterns and concepts. Locating your web space using FileZilla. Setting up SSH keys
  • Post / respond to project proposal (now through M 9/21). Each student must respond to at least one proposed idea from another student and indicate suggestions or further ideas.
  • Install FileZilla (or other SFTP client) if you have not done so already: we'll use it in class to find your webspaces! Follow instructions posted on Canvas for setting up SSH keys to access your personal webspace on Newtfire.
Week 5 Topics Do before class

M 09-21

Form project teams! Post a project proposal / respond to another. Each student must respond to at least one proposed idea from another student and indicate suggestions or further ideas.

W 09-23

Review Relax NG: Common issues in homework. Project discussion / initiation time in class.
  • Project Checkpoint 1: Launch the project GitHub repo and invite your teammates and me to join (using Settings > Manage settings). Post in the Issues board of your new project rep your available meeting times to help determine a regular meeting time for your group.

  • Revise and resubmit Relax NG exercises on Canvas if you were asked to do that.

F 09-25

  • Building on the Web: What is "index.html" to a web server? Website addresses and file directories on a remote web server
  • Hands-on: Work with FileZilla (or other SFTP client) to connect with your SSH keys to the Apache Server for newtFire.
  • File directories on the server and their association with web URLs.
  • Workflow from GitHub to Website: How to customize SFTP (Filezilla) to work with your GitHub repo.
  • Initiate first take-home test: Relax NG.
Read our Introduction to HTML.
Week 6 Topics Do before class

M 09-28

Continue with learning and workshopping HTML / CSS. Develop an index.html page and link to other pages in your web space. Absolute vs. relative links (and file associations). Make a simple CSS page. CSS resemblance and difference from Relax NG (those curly braces). Test / troubleshoot using SSH Keys to access our web server.

W 09-30

F 10-02

  • Mindful file management: mirroring directory structures on GitHub and the web server
  • Web browsers and display variations
  • CSS Box Model
  • Introduce Flexboxes (see tutorial)
Complete HTML / CSS Exercise 2 (submit this to personal or project web space). Consult Learn CSS Layout, Flexbox tutorial, and w3 Schools CSS Reference as you code. (Also, check out Paletton (or hunt for other color scheme generators on the web) to help think about choosing a balanced color scheme for your website. Experiment with writing CSS to control font, layout, color, backgrounds.
Week 7 Topics Do before class

M 10-05

Slack chat and GitHub project management tools for improving communication, completing tasks. Project web work. Project customizations and boilerplate with Server Side Includes (examples). Decide on project website directory names and URLs. Project Checkpoint 2:
  • Locate all sources for project XML markup
  • Establish a clear flie directory structure on yoru project GitHub, including a distinct directory for website files
  • Make sure all project team members work consistently with the GitHub directory structure (all agree on it, no one changes it without notice)
  • Strong start on a project schema (Relax NG)
  • A good quantity of documentation and/or markup is present in the GitHub repo.

W 10-07

Introducing Regular Expressions and autotagging. Regular patterns in documents. How to start? inside-out or outside in. "close-open" strategy. Read Intro to Regular Expressions

F 10-09

Regular Expressions: thinking algorithmically. Greedy matching. Work on Regex together. Regex Exercise 1
Week 8 Topics Do before class

M 10-12

Regex: simplifying over-complicated expressions. Selecting for what's not there. Searching over highlighted portions of a document. Regex Exercise 2

W 10-14

Project review Project Checkpoint 3:
  • Some web development for site; navigation menu, page organization
  • Refined schema
  • XML markup: significantly more progress than the last checkpoint. Everyone's files are working with the project schema

F 10-16

Navigating XML with XPath: Introducing the XPath window in <oXygen/>, functions, axes, path steps /, and predicate filters [ ] Hands-on XPath navigation with Hamlet. Read our Introduction to XPath: Follow the XPath! As you read, try experimenting with the XPath expressions on our page, by downloading the explainXPath.html file, opening it in oXygen, and experimenting in the XPath window with some of our expressions.
Week 9 Topics Do before class

M 10-19

Work on XPath 1 and 2 together. Using XPath axes. Predicate expressions [ ], (grouping). XPath Exercise 1

W 10-21

Go over XPath 2, start XPath Exercise 3 together. XPath Functions, simple map vs. arrow operator. Using functions inside predicates. Complete XPath Exercise 2

F 10-23

Go over XPath Exercise 3. Introduce string functions Complete XPath Exercise 3, or get as far as you can
Week 10 Topics Do before class

M 10-26

Combining regular expressions with XPath. String functions. Getting ready for XSLT Get as far as you can with XPath Exercise 4: String functions

W 10-28

Introducting XSLT (eXtensible Stylesheets Language Transformations). XML to XML, XML to HTML. Namespaces Setting up oXygen to write XSLT. Read Introduction to XSLT / orientation video

F 10-30

How to write XSLT to change XML into HTML XSLT Exercise 1: An Identity Transformation
Week 11 Topics Do before class

M 11-02

Go over XSLT to HTML. XPath in XSLT. Initiate XPath take-home test. XSLT Exercise 2 (HTML list)

W 11-04

XPath from test, worked into XSLT Complete XPath test

F 11-06

XSLT: How templates work. Push and pull processing. Write XSLT to make an HTML table together in class. XSLT Exercise 3
Week 12 Topics Do before class

M 11-09

XSLT for editions: push processing. Styling: working with XSLT and CSS together. XSLT Exercise 4 (review Attribute Value Templates with this). Read about Modal XSLT

W 11-11

Review/ work on Modal XSLT in XSLT Ex 5. Introduce xsl:sort XSLT Exercise 5

F 11-13

XML to HTML with CSS. Apply to projects XSLT Exercise 6
Week 13 Topics Do before class

M 11-16

Work toward Project Checkpoint 5 XSLT Exercise 7: Applied to your projects.

W 11-18

XML that makes graphics: SVG (Scalable Vector Graphics: Drawing elements and screen grid coordinates Project Checkpoint 5:
  • Goal: XML markup is mostly complete and ready for active processing with XSLT
  • Work on XSLT to HTML transformations to build content for the project website
  • Improve the project website, update its organization and navigation
  • Project intros: introduce the team members
  • Other goals specific each team

F 11-20

XSLT to SVG: working with variables to plot coordinate space SVG Exercise 1
Topics Do before class

M 11-23 - F 11-27

Thanksgiving Holiday Have a peaceful and productive week! See you online. Work on SVG Exercise 2 and project development
Week 14 Topics Do before class

M 11-30

XSLT to SVG to make a graph SVG Exercise 2 (XSLT to SVG)

W 12-02

XSLT to SVG work together. Introducing simple JavaScript. SVG Exercise 3 (options: a timeline?, graph from project data?)

F 12-04

Associating JavaScript files with HTML, and coordinating with CSS JavaScript Exercise 1
Week 15 Topics Do before class

M 12-07

JavaScript for projects JavaScript Exercise 2 (options: Toggling @class attributes, or working on SVG: show/hide). Project sprint

W 12-09

Putting it all together: JavaScript with CSS to interact with SVG. Project sprint. Prepare for Project Checkpoint 6

F 12-11

Last day: Project Checkpoint 6: Teams present their projects to the class, invite comments and feedback. Classmates from other teams ask questions, offer commentary on project GitHub repos through early next week. Prepare to share your project (nearing completion) with the class
Finals Week: M 12/14 - F 12/18 Due

H 12-17

Projects due by 11:59pm

Finish developing projects on newtfire, and send a post to me on GitHub to indicate your team is finished.