We are a not-real organization looking to spread the word about our quickly dissolving polar ice reserves.
We've decided to launch a donation-driven monthly physical newsletter, delivered straight to your home, for our recent climate change awareness campaign. We need to build a web form so donators can sign up for the newsletter (don't worry about actually billing and charging people, we'll handle that separately).
This form needs to collect the recipient's name and phyiscal home address so they can get their newsletter. Marketing would also like to have the customer's gender, date of birth, and/or income level, if possible, so they can send follow-up letters asking for more donations; this information is useless otherwise, though, so whether or not you think we should ask for this is up to you.
We also need to let donators decide on how much to donate (at least 1 Euro) and if they want to subscribe to the monthly newsletter, or just one-off purchase the next edition. To make this enticing, let's use a checkbox to let people opt-out of the subscription, with some guilt-tripping text like "I hate polar bears -- select this to opt out of a recurring donation". This should help us get more donations!
As a proudly GDPR-compliant organization, we need to make sure the user agrees to our terms and conditions. To make it easier for them, pre-check the option. We care about good usability.
Oh, and before hitting "submit", make sure there's a little preview/confirmation area so donators know exactly how much they are paying (always in Euro) and when to expect for the next issue to arrive (for example: "We'll ask for your donation of 1 234,56 € with your newsletter on 3.5.2021"). We plan to send out the newsletter on the first workday of every month.
We hope this task is entertaining and straightforward for you. Please set aside, at most, around two hours of your time to complete it.
This code test is built to help us learn about your skills with:
- HTML DOM, accessibility, and semantics
- Javascript API familiarity
- Documentation
- Basic UI/UX
- Ethical-minded engineering
- Tooling stack, if you choose to use one
- Testing (optional, but preferred!)
- Good use of Vue and Typescript (optional -- if you're more familiar with another stack, feel free!)
We don't expect your code to be perfect, and we don't want you to goldplate a quick test project. As such, don't worry too much about:
- Component libraries: we prefer familiarity with native HTML and Javascript APIs/components/functionality, such as native form inputs; if you do pull in more packages, make sure you have a good reason for it!
- Styling/visuals: just go for the bare basic requirements (feel free to use a CSS framework if you'd like).
- Excessive abstraction: this is a one-off project, so abstract as much as makes sense to you, but don't over-engineer it; readability is paramount!
- Backend/implementation: just build the web form; the "submit" button doesn't need to do anything.
Bear in mind, this test is deliberately open to interpretation. We at Jobilla are a very autonomous team of engineers who are very critical of our own workflow, specifications and practices. If you disagree to any part of the test specification or think there's a better way to do things, do so—and tell us about your decisions and why.
We recommend leaving a text file in your repository with a compilation of your thought process, concerns, and opinions about both the code you wrote and the specification you received. Did it all make sense? Did you raise your eyebrows at anything? Was anything particularly challenging? Do you think that Save The Icecaps Inc is a good company to work for? Do you think the end user would be happy with what you built?