Module A — Mini Test Projects

Static website design, front-end development and back-end development.

Design implementation

A1 — Floating Label
A1Level 1

Floating Label

Label that floats to the top edge of the input, CSS only.

 A2 — Progress Animation
A2Level 1

Progress Animation

Reading progress bar driven by the scroll position, CSS only.

 A3 — 3D Can Rotation Effect
A3Level 2

3D Can Rotation Effect

Wrapped drink can that spins and scales on hover, CSS only.

Front-end development

B1 — World's Tallest Buildings
B1Level 1

World's Tallest Buildings

Skyline rendered from data, scaled to the tallest tower.

 B2 — Turntable
B2Level 3

Turntable

Record player with play, volume, next track and stop.

 B3 — Lines and Dots Animation
B3Level 1

Lines and Dots Animation

40 random dots connected to the cursor with lines.

Back-end development

C1 — Registration Form Validation
C1Level 1

Registration Form Validation

Form validated in PHP, needs a PHP server.

 C2 — API Request Logger
C2Level 2

API Request Logger

POST endpoint that logs every JSON request, needs a PHP server.