Adnat (React Challenge)

For this challenge you will be writing your own ReactJS Single Page App which will operate like a front-end for a JSON version of the Adnat backend challenge. This is a React challenge, and is not strictly design focused, however, if you'd like to build and style your own components, please go right ahead. If you're not interested or comfortable with doing that, there are plenty of component libraries to help you. Semantic UI is a good choice. Additionally, feel free to use any additional libraries you find valuable.

You should use Git as you build your solution. For submission you are asked to push your repo to GitHub and provide us with the link and any necessary instructions.

Your solution should allow you to perform all of the same actions as the backend challenge. Please have a read through the readme to understand more about the tasks to be completed. For this challenge you will be consuming an existing JSON REST API which closely resembles what a backend might look like for the Adnat backend challenge if represented as a JSON API. To setup the backend and start the server, navigate to the root of the repository and run yarn backend:setup. To start the backend server, navigate to the root of the repository and run yarn backend:start, it will start listening on port 3000 locally, your React SPA should be making requests to it to create, read, update and delete data.

The backend uses a SQLite database to store the data generated by your React application. If you’d like to reset the data, just delete the backend/db.db file and restart the server.

Please read the endpoint documentation for information on the specific requests and responses for the endpoints, and how authentication should work. You’re welcome to extend the functionality of the backend server, however heavily modifying existing logic is discouraged.

Your solution should compile to a single HTML page, and a bundled JS file, you can use any build tools you’d like. Webpack is not a bad choice.

Instructions

Windows

Installation:

1. git clone https://github.com/matthewmuscat/adnat-react.git
2. cd adnat-react
3. npm install
4. cd frontend
5. yarn add -D serve
6. npm install
7. cd ../backend
8. npm install

Backend:

9. Navigate to parent: cd adnat-react
10. yarn backend:setup
11. yarn backend:start

Frontend: (in new console)

12. cd adnat-react
13. cd frontend
14. npm run build
15. npm run serve
16. Browse to http://localhost:5000