The Deska blog

File Uploads Done Right, With an Agent Writing the Boring Parts

Learn how to implement secure S3 file uploads while using AI agents to handle boilerplate, infrastructure setup, and credential management inside Deska.

· 11 min read

Implementing file uploads has long been a source of repetitive boilerplate for developers. While libraries and cloud services have simplified the process, the actual plumbing, constructing the signed URLs, handling multipart uploads, and configuring bucket policies, remains a friction point. Achieving file uploads done right involves moving beyond manual configuration and leveraging AI agents to handle the tedious integration details while you focus on the core application logic.

The Architecture of Modern File Uploads

Modern web applications rarely store files directly on the server. Instead, the industry standard relies on object storage like Amazon S3 or compatible services. This approach offers scalability and reduces the load on your application server, but it introduces a specific set of requirements for security and reliability.

When you handle file uploads, you face a primary choice: proxying the file through your server or using pre-signed URLs to upload directly to the cloud provider. Direct uploads are generally preferred because they save server memory and bandwidth. However, this requires a secure handshake where the backend generates a temporary, cryptographically signed URL that the client uses to transmit the binary data.

Implementing this requires several steps that are prone to small, frustrating errors. You must initialize the AWS SDK, manage environment variables for credentials, define the correct Content-Type headers, and ensure your CORS (Cross-Origin Resource Management) settings are permissive enough for the browser but restrictive enough for security.

Automating the Boring Parts with Coding Agents

This is where the traditional development workflow meets modern automation. An AI agent is particularly effective at generating the boilerplate associated with cloud providers. Instead of flipping between documentation pages and your editor, you can instruct an agent to build the foundation of your upload service.

Inside a workspace like Deska, you can place a terminal, a code editor, and a coding agent side by side. This allows the agent to see your current file structure and execute commands to install the necessary dependencies. For a standard S3 integration, the agent focuses on three main areas:

  1. Credential configuration: Ensuring the aws-sdk is properly initialized using local environment variables without hardcoding secrets.
  2. The signing logic: Writing the function that requests a PutObjectCommand and returns the upload URL.
  3. Frontend integration: Generating the fetch or axios call that handles the PUT request to the bucket.

By using coding agents like Claude Code or Codex CLI within your local environment, you retain full control over the generated code. The agent writes the boring parts, but you remain the architect who reviews the security implications and final implementation.

The Role of Local Workspace Tools

Efficiency in handling complex tasks like cloud integrations often depends on your developer environment. Many modern tools differ in approach when it comes to how they integrate AI. Some are web based and abstract away the file system, while others are purely command line interfaces.

Deska offers a middle ground as a local-first desktop application available for Mac, Windows, and Linux. Because it runs locally, any code the agent generates or files it modifies stay on your machine. This is crucial when dealing with sensitive infrastructure code or AWS configuration files that should never leave your local environment.

The ability to use an infinite canvas allows you to visualize the entire upload flow. You might have one panel showing your backend Node.js code, another showing the React frontend component, and a third containing a terminal where the agent runs tests. This spatial organization prevents the mental fatigue of constant tab switching.

Setting Up the S3 Bucket Policy

A common mistake in file uploads is misconfiguring the bucket policy. If the policy is too open, your data is vulnerable. If it is too restricted, the upload fails with a generic 403 error. A robust setup usually includes:

  • Blocking all public access by default.
  • Using an IAM user with the minimum required permissions (s3:PutObject and s3:GetObject).
  • Configuring CORS to allow requests only from your specific development and production domains.

You can ask Ask Deska to help you visualize these requirements or even open a browser widget to check your AWS console while keeping your code in view. This multi panel approach ensures you do not lose context while verifying cloud settings.

Enhancing the Workflow with Mobile Monitoring

Large file uploads or complex infrastructure deployments sometimes take time to process or test. If you need to step away from your desk, the mobile app allows you to monitor the progress of your agents and terminal sessions.

The pairing between the desktop app and the mobile device happens directly through a secure relay, meaning you do not have to expose any ports on your local network. You can check if the agent finished writing the S3 integration tests or see if a deployment script succeeded, all from your phone. This continuity ensures that "the boring parts" stay automated even when you are not physically at your computer.

Decisions: Tables and Comparison

When choosing how to implement your upload logic, consider the following trade-offs regarding storage types:

Upload MethodServer LoadSecurity ComplexityBest For
Server ProxyHighLowSmall files, private apps
Pre-signed URLLowMediumLarge files, public scale
Multipart UploadMediumHighFiles over 100MB

Using an agent to navigate these choices helps you skip the phase of reading through outdated tutorials. The agent can provide a code snippet for a pre-signed URL approach, which is the industry standard for most modern applications.

Managing Your Environment

To get started with this workflow, you generally need to organize your workspace to accommodate different tasks simultaneously.

  • Open a code editor panel to define your API routes.
  • Open a terminal to run npm install @aws-sdk/client-s3.
  • Enable a coding agent to bridge the two by writing the actual logic.
  • Use a note panel to keep track of the bucket names and region identifiers you need to use.

This setup is facilitated by Deska workspaces, which persist your layout so you can return to your "S3 Development" setup anytime. By keeping everything local, you avoid the latency and privacy concerns associated with cloud based editors.

FAQ

How to handle S3 upload progress in the UI?

When using pre-signed URLs, the browser handles the upload via an XMLHttpRequest or fetch. You can use the onUploadProgress callback in libraries like Axios to update a progress bar. If you are using the native fetch API, you might need a ReadableStream to track the bits sent, though this is more complex.

Can coding agents access my AWS credentials?

In a local environment like Deska, coding agents can see the files you allow them to access. It is a best practice to keep your credentials in an .env file that is ignored by Git. You should instruct the agent to use process.env rather than reading secret files directly, maintaining a layer of security even when using AI.

What is the advantage of a local-first developer tool for S3?

A local-first tool ensures that your AWS configuration, local mock servers, and application code never reside on a third party server. This minimizes the attack surface. Since Deska is a free desktop app, you get a professional workspace without adding another cloud dependency to your stack.

Getting Started with Automated Uploads

Implementing file uploads does not have to be a manual chore. By combining the power of coding agents with a well organized local workspace, you can move from a blank screen to a functional S3 integration in minutes. Using tools that prioritize your local environment and provide an infinite canvas for your work makes the process transparent and efficient.

If you want to try this setup for your next project, you can download the Deska desktop app for free on Mac, Windows, or Linux. Start by setting up your first workspace and inviting an agent to handle the boilerplate for you.

💡 Ideas+🐛 BugsSuggest a feature or report a bug