Image Viewer

A quick little web application to anonymously view and share images. Not for production use.

Installation

Clone the repo, before starting the development server:

yarn
yarn start

Testing and linting are run before any git commits, otherwise to run manually:

yarn test
yarn run lint

Several assumptions have been made:

Due to being image heavy, server side rendering will introduce development complexity that provides little additional value.
Task is primarily frontend due to described role.
Consistency is preferred over minor performance gains - prefer stateful components over pure functions.
Browser compatibility - modern browsers are only required.
We don't want to test React internals itself. Linting, flow types, can provide more value (at times) in terms of governing the codebase (for the frontend). There is significant value in unit testing the backend however.

Due to time constraints, there are several recommendations to extend the project further.

Using browser route / history for routing, rather than hash router. This was consciously used to enable the application for project pages on Github.
Using a server to handle uploads, server side validation, authorisation, etc.
Storing records in a database, rather than on the client side. Generate appropriate server side IDs instead of client side. For scaleability, the front-end should not hit the database directly, however through a cache layer such as Redis, populated by a push technology (eg. Kafka). This also gives us the flexibility of using GraphQL subscriptions to subscribe to potential changes.
Authorisation of the upload functionality to enable audit history.
If there is consideration to perform uploads of images, they should be:
- Compressed
- Uploaded to an S3 Bucket
- Served via Cloudfront, cached and gzipped
Include E2E tests / snapshot tests, in addition to component unit testing.
Further governance by including Flow (at the cost of readability).