Skip to content
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
86 changes: 43 additions & 43 deletions README.md
Original file line number Diff line number Diff line change
@@ -1,43 +1,43 @@
# React Dev Test Assignment ⚛️

https://user-images.githubusercontent.com/12231393/136546219-a49c6ea7-fd63-48b5-8906-04ce8c04a181.mp4

## Description
Try to finish as much TODO's as possible. These are found within the React app codebase. When you view the `/src` folder you will find an application for users that want to create their own addressbook (also shown in the video above). But as mentioned before there are some TODO's to be completed in order to make the application work as expected.

In order to start this assignment you need to:
- ⬇️ Clone this repository
- 🌲 Create a separate branch called `feat/todo-assignment`
- 👨‍💻 Open up your preferred editor (mine is VS Code)
- 🏃🏻‍♂️ Run `npm install` and then `npm start`
- 🔎 Search for all `TODO:` strings within the `/src` folder and start building!

> Note: You will find some Bonus TODO's. These are not mandatory for completing this assignment. Feel free to flex your programming skills 💪

## TODO's
Here is a list of all the TODO's to make life a bit easier:

### Styling
- [ ] Add the 'Roboto' font from Google fonts and add it as a global CSS var called `--font-primary`.
- [ ] Make application responsive. It is already for the most part, but it is not optimal for smaller screens.
- [ ] Create separate styles for .primary and .secondary variants of the button component.

### React
- [ ] Write a custom hook to set form fields in a more generic way.
- [ ] Fetch addresses based on houseNumber and zipCode.
- [ ] Create generic `<Form />` component to display form rows, legend and a submit button.
- [ ] Create an `<ErrorMessage />` component for displaying an error message.
- [ ] Add a button to clear all form fields. Button must look different from the default primary button, see design.
- [ ] Add conditional classNames for `primary` and `secondary` variant in `<Button />` component

### Redux
- [ ] Prevent duplicate addresses.
- [ ] Write a state update which removes an address from the addresses array.

## Submitting assignment
You can submit your assignment by creating a merge request for your `feat/todo-assignment` branch. That's it, good luck! 🚀

> If any questions might arise about the assignment please contact l.zimmerman@wearetriple.com



# React Dev Test Assignment ⚛️
https://user-images.githubusercontent.com/12231393/136546219-a49c6ea7-fd63-48b5-8906-04ce8c04a181.mp4
## Description
Try to finish as much TODO's as possible. These are found within the React app codebase. When you view the `/src` folder you will find an application for users that want to create their own addressbook (also shown in the video above). But as mentioned before there are some TODO's to be completed in order to make the application work as expected.
In order to start this assignment you need to:
- ⬇️ Clone this repository
- 🌲 Create a separate branch called `feat/todo-assignment`
- 👨‍💻 Open up your preferred editor (mine is VS Code)
- 🏃🏻‍♂️ Run `npm install` and then `npm start`
- 🔎 Search for all `TODO:` strings within the `/src` folder and start building!
> Note: You will find some Bonus TODO's. These are not mandatory for completing this assignment. Feel free to flex your programming skills 💪
## TODO's
Here is a list of all the TODO's to make life a bit easier:
### Styling
- [ ] Add the 'Roboto' font from Google fonts and add it as a global CSS var called `--font-primary`.
- [ ] Make application responsive. It is already for the most part, but it is not optimal for smaller screens.
- [ ] Create separate styles for .primary and .secondary variants of the button component.
### React
- [ ] Write a custom hook to set form fields in a more generic way.
- [ ] Fetch addresses based on houseNumber and zipCode.
- [ ] Create generic `<Form />` component to display form rows, legend and a submit button.
- [ ] Create an `<ErrorMessage />` component for displaying an error message.
- [ ] Add a button to clear all form fields. Button must look different from the default primary button, see design.
- [ ] Add conditional classNames for `primary` and `secondary` variant in `<Button />` component
### Redux
- [ ] Prevent duplicate addresses.
- [ ] Write a state update which removes an address from the addresses array.
## Submitting assignment
You can submit your assignment by creating a merge request for your `feat/todo-assignment` branch. That's it, good luck! 🚀
> If any questions might arise about the assignment please contact l.zimmerman@wearetriple.com
Loading