https://github.com/previousnext/frontend-challenge
PNX frontend challenge
https://github.com/previousnext/frontend-challenge
frontend
Last synced: about 2 months ago
JSON representation
PNX frontend challenge
- Host: GitHub
- URL: https://github.com/previousnext/frontend-challenge
- Owner: previousnext
- Created: 2026-03-16T02:35:07.000Z (3 months ago)
- Default Branch: main
- Last Pushed: 2026-03-25T02:45:36.000Z (2 months ago)
- Last Synced: 2026-03-26T08:42:12.920Z (2 months ago)
- Topics: frontend
- Language: TypeScript
- Homepage:
- Size: 181 KB
- Stars: 0
- Watchers: 0
- Forks: 1
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- Contributing: CONTRIBUTING.md
Awesome Lists containing this project
README
# Technical Challenge: Frontend Developer
## Overview
We'd like you to implement a modal dialog component using the codebase provided. We've kept the brief intentionally
loose in places - we're interested in the decisions you make, not just the end result.
## The task
Using the existing codebase as your starting point, implement a modal dialog component. A rough reference for behaviour
and appearance can be found here: [stripe.com](https://stripe.com/au) (see expand icon on homepage cards).
Consider this a starting point, not a strict spec. Your implementation should fit the patterns and conventions already
established in the codebase.
## Requirements
The dialog should:
- Open and close correctly
- Avoid using any external UI libraries - we'd like to see your own implementation
- Be keyboard accessible - including Escape to close, and correct focus management when opening and closing
- Follow the existing component patterns, naming conventions, and file structure in the codebase
- Be written in TypeScript
## What we're not prescribing
We've deliberately left the following open - please make your own decisions and note them down:
- Mobile behaviour and breakpoints
- What happens to page scroll when the dialog is open
- Animation and transition behaviour
- How the trigger element is handled
## What to submit
Along with your code, please include a brief README (a few bullet points is fine) covering:
- Any assumptions you made where the spec was unclear
- Any trade-offs or decisions you'd approach differently with more time
- Anything you noticed in the existing codebase you'd flag in a code review
## Time
We'd suggest around 2–3 hours, but there's no hard limit. We're more interested in quality and thoughtfulness than
completeness - if you run out of time, notes on what you'd do next are just as valuable.
## Follow-up
We'll schedule a short call to walk through your submission together. Be prepared to talk through your decisions - there
are no trick questions, we just want to understand your thinking.
## Ready to start?
Great! Please see the [CONTRIBUTING.md](./CONTRIBUTING.md) file for setup instructions and guidelines on how to submit
your work. We look forward to seeing your implementation!