Hands-on AI-Assisted Development, IT track, Day 2 handouts


[About the ZIP]

IT_Day2_handouts.zip   Use this ZIP on Windows.
IT_Day2_handouts.zip   Use the same ZIP on Mac.

The file names have no Japanese characters, so one ZIP works on both Windows and Mac.


[Where to extract]

Extract it into the tpro-work folder you used on Day 1.
The top level of the ZIP is the day2 folder, so extracting it creates a day2 folder inside tpro-work.

On Windows
  1. Right-click the ZIP and choose "Extract All"
  2. Click "Browse" and select the tpro-work folder on the desktop
  3. Click "Extract". You are done when day2 appears inside tpro-work

On Mac
  1. Double-click the ZIP. A day2 folder appears in the same place as the ZIP
  2. Drag the new day2 folder into the tpro-work folder on the desktop

If your PC cannot write to the desktop and you created tpro-work directly under your Documents folder, select that folder instead.


[First, copy index.html directly under tpro-work]

On Day 1, you added a filter and totals to index.html in the worklog-app folder.
Today's and Day 3 materials assume that index.html is directly under tpro-work.

  1. Copy index.html in the worklog-app folder
  2. Paste it directly under tpro-work (the same level as the .github folder)
  3. Keep the original worklog-app/index.html. Use it when you want to go back to the state at the end of Day 1

If you do not have the Day 1 index.html, or the filter and totals do not work,
copy day2/fallback/index_day1.html directly under tpro-work and rename it to index.html.

After extracting, open the tpro-work folder in VS Code with File > Open Folder.
If you open only the day2 folder, Copilot cannot read the Day 1 instructions file and index.html.


[Included files]

day2/docs/import-spec_v1.md
  Material for after lunch. The specification for adding CSV import to the Worklog app, with requirements R-01 to R-12 and a table of warning codes.
day2/docs/category-map.csv
  A table that maps the category names of the legacy timesheet system to the 4 categories of the Worklog app.
day2/docs/holidays_2026.csv
  The list of holidays in 2026. Used to decide which dates are days off.

day2/data/worklog_2026-07-08.csv
  Hours for July and August exported from the legacy timesheet system. Used from the import implementation onward.

day2/review/review_target.js
  A file you only read in the exercise on gaps in display and export. No HTML file loads it.

day2/fallback/
  Replacement files for anyone missing files. Use them only when the instructor tells you to.
  index_day1.html            The Worklog app with the Day 1 filter and totals by category
  testcases_sample.md        A test case table for the hours input check (12 rows)
  data_sample.csv            Sample test data (31 rows)
  copilot-instructions.md    The full instructions file placed on Day 1
  lib/papaparse.min.js       Library that reads CSV. Copy it only if tpro-work/lib does not have it


[If you need a replacement]

Follow the instructor and copy the files as below. Do not delete the original file; rename it and keep it.

  testcases.md is missing or has fewer than 10 rows
    Copy fallback/testcases_sample.md directly under tpro-work and rename it to testcases.md
  data.csv is missing
    Copy fallback/data_sample.csv directly under tpro-work and rename it to data.csv
  copilot-instructions.md is not read
    Copy fallback/copilot-instructions.md into tpro-work/.github
  tpro-work/lib/papaparse.min.js is missing
    Create a lib folder in tpro-work and copy fallback/lib/papaparse.min.js into it

Write the names of the replaced files as one line in decision-log.md, which you create today. You use it when you submit the Day 3 practical exam.


[Files you create today]

Put the files you create today directly under tpro-work (or in the specified folder), not inside day2.
They are not in the handouts. You create them in the exercises.

  index_ok2.html (backup before debugging)
  testcases.md, prompt-memo.txt
  decision-log.md, open-questions.md
  data.csv, data-memo.txt
  report.md, report.html, report.pdf
  docs/core-contract.md
  worklog-core.js, worklog-config.js
  tests.html, tests/assert.js, tests/core.tests.js
  security-notes.md


[How to open a file in the browser]

1. Open the tpro-work folder in File Explorer (Finder on Mac)
2. Double-click index.html. The page opens in your default browser
3. If the address bar starts with file:///, the page is open correctly
4. After you edit a file in VS Code, save it, then reload the browser
   If you reload without saving, the page does not change

If double-clicking opens another app such as VS Code, right-click the file and choose your browser from "Open with".
If nothing appears on the page, press F12 and check the Console for red lines.


[If you need help]

This course is online. Contact the instructor in the Zoom chat.
You can also ask during breaks.


[Notes]

You do not use Python, Node.js or the command line. You do not need to install anything.
The apps do not load libraries from the internet. For reading CSV, use the library in the lib folder handed out on Day 1.
All data, companies and people in this folder are fictional.
In the exercises, do not use real data or code from your work, or names of your clients.

Givery, Inc.
