SAPUI5 assignments — Lessons 1–5

Use each assignment after its matching guided lesson and work at your own pace. Complete the required work and verification before attempting an optional challenge.

Lesson	Assignment	What you will practise
1	Build your welcome page	XML controls, controller handlers and debugging.
2	Make a reusable greeting reliable	Modules, string handling, repeatable checks and Git.
3	Extend the employee details check	Two-field validation, clear feedback and accessible controls.
4	Extend the Employee Directory	Add a property through the JSON model, form, record creation and table.
5	Finish Employee Task Manager	Complete, verify and explain Project 1.

Prepare your workspace

Use the same setup as the guided lessons: VS Code, Node.js 24.x, npm, Git and a current browser. The supplied checkpoints use SAPUI5 1.148.12 and the existing training.fiori.day1 application ID. Internet access is required; an SAP account or backend is not required.

Lessons 1–4: copy your completed guided lesson project into a separate assignment working folder, such as day-01-assignment, day-02-assignment, and so on. Copy webapp, package.json, package-lock.json, ui5.yaml, .gitignore and README.md. Dependencies, build output and the original .git directory do not need copying. Keep the original folder intact for the next guided lesson: its complete-file replacements may otherwise remove assignment handlers while leaving their buttons behind.

If you need to recover, extract the completed checkpoint linked in the assignment into a new folder. Rename only its outer folder; leave the application namespace and source-file names unchanged.

Lesson 5: continue the same Employee Task Manager project you began in the guided lesson. The guide and assignment describe stages of the same project.

Stop the previous server with Ctrl+C. Open the correct working folder in VS Code. For a fresh copy, run:

npm ci
npm start

Use the local URL printed in the terminal, with /index.html appended if necessary. Leave the server running while you work. If the port is occupied, stop the other server or use npm start -- --port 8081.

Record your work

Copy the notes template into your application root and name it assignment-day-01.md, changing the lesson number for each assignment. Record actual results as you test. Mark a test Pass, Fail or Not tested; a screenshot or successful build alone does not prove every interaction works.

From Lesson 2 onward, keep a Git checkpoint. If git status reports that your assignment folder is not a repository, run git init. Follow Lesson 2, Git checkpoint to inspect, stage and commit. Include the completed notes in the commit. Keep the final commit hash in your submission message rather than editing the notes again just to record that same hash.

Package your submission

Create day-01-assignment.zip, changing the lesson number as needed. Include the application files listed above and your completed assignment notes. Include any optional screenshots referenced by the notes. Exclude node_modules, dist, .git and credentials. Make sure .gitignore is included even if your file manager hides it.

Keep the ZIP outside the application folder so it is not accidentally included in itself or committed. Submit it through your course's submission location. On Lessons 2–5, include the output of git log -1 --oneline in the submission message. Lesson 1 does not require a Git commit.

Catch up independently

Open the matching guide under lessons/, verify its completed checkpoint, then begin the assignment. Hints reveal a small next step without supplying a full solution. If you use reference code, record the source and explain the part you adapted. Finish required behavior before adding extra features.

The sidebar links to each guided lesson and companion; the Downloads page contains recovery checkpoints. These assignments add practice; they do not introduce a backend, navigation or dialog requirements ahead of their lessons.