This repository contains a partially implemented file explorer built with Next.js (App Router), TypeScript, and Tailwind CSS. Data is stored in memory on the server.
- Basic layout with a sidebar and main area.
- API endpoints to create folders and files.
- An in-memory data structure representing a folder tree.
-
Enable users to create files inside folders. This requires:
- Using the
/api/files/[id]
endpoint to add new files. - Adding UI controls for file creation.
- Using the
-
Display different file types (e.g.,
.png
,.mp4
,.pdf
). -
Implement a "step back" mechanism to navigate to the parent folder (not the browser’s back button). If a user opens a folder, they should be able to return to its parent.
-
Fix the bug where creating a folder inside a subfolder mistakenly creates it in the parent folder.
-
Refactor the existing codebase to improve clarity, maintainability, and structure.
-
Enhance the design to make it look and feel more like a real application. This includes:
- Responsive layout.
- Optimized file viewing.
-
(Optional) Implement a Recent Files page.
-
(Optional) Add any other features you’d like!
-
A short video recording (maximum 2 minutes) demonstrating the functionality, including:
- Creating folders and files.
- Viewing files.
- Responsive design in action.
-
A link to a GitHub repository containing the source code.
The diagram below illustrates the expected design:
Install dependencies and run the development server:
npm install
npm run dev
The app uses an in-memory store, so all data will be reset when the server restarts.
✨ Good luck!