Welcome!

Welcome to Webiny Coding Challenge for the Full-Stack Developer role!

This repo provides everything you need to immediately start working on the problem at hand. The goal of this task is not to intimidate you with weird algorithm tasks, but to see how you approach a real world problem, which resembles things we work with at Webiny, on a daily basis.

Setup

Out of the box, you get a React app setup, with webpack, Typescript, and React Fast Refresh for better DX. You also get the most basic express app setup, with nodemon and ts-node. Feel free to add more utilities and tweak the configs to match your normal workflow.

• Clone the repo.
• Run yarn to install dependencies.
• Run yarn start to start both the React app and the API.
• Alternatively, you can cd into api or app folders, and run yarn start there, to start apps individually.

The Task

We'd like you to build a very simple file manager app.

Required Features:

• Configure your GraphQL client of choice (Apollo, urql, whatever you're comfortable with)
• Build a simple UI using Material UI. You don't need to design or style anything, just grab the components from the library, and put them together the way you see fit.
• We need the ability to upload images, edit their name, and delete them.
• Implement an /upload API endpoint to handle file uploads (store files locally in a folder of your own choice), and a /graphql API endpoint to handle the basic queries/mutations to power the React UI.
• For every uploaded image, generate a thumbnail, which will be used in the UI to display the list of images.

Bonus Features:

These are optional features, it would be great if you managed to tackle any of these if the time allows, or you're just interested in doing them, but they're not mandatory:

• Handle non-image file types (these won't have a thumbnail, so be creative about the solution)
• A simple "filter by name" capability (using the GraphQL API and an input field)
• come up with an improvement of your own? ;)

Notes

• The tasks described above are not super detailed. Use your imagination, experience, common sense, and industry best practices, to make a usable application.
• You don't need a database, feel free to use something as simple as a JSON file to persist file related information. Worst case scenario, use a simple array to store data objects. It is ok that they don't persist between app restarts.
• Feel free to use any npm library you need to build the app.
• There's no time constraint for this task. Build something you'll enjoy talking to us about, and spend as much or as little time as you can or want.

---

Good luck and have fun!