Advanced File Upload and Content Management With Filestack

We live in the information age. From communication to shopping to finances to work, we handle most of our interactions digitally through websites and apps. Yet even though the bulk of our information is digital, the sites and apps we use still need to access our data to manage it.

As a developer, the thought of building such a system is daunting because to provide any level of meaningful functionality, the system must be able to handle popular image, document, audio, and video formats. It must provide a simple yet high-performance mechanism for uploading and delivering content, and for maximum flexibility, it should be able to transform data into other formats. But above all, it needs to be secure.

If you’re like me, the challenge of building such a system is enough to spur you into action. However, if you’re also like me, you don’t have the time to implement, test, and harden a system. Thankfully, one already exists. It’s called Filestack, and more than 100,000 applications trust Filestack to handle file uploads, transformations, storage, delivery, and more.

What Is Filestack?

Filestack is a reliable, high-performance set of tools that allows developers to easily upload, store, transform, and deliver content. More than 100,000 applications trust Filestack because it is blazing fast, responsive, and works across any type of desktop or mobile device.

Filestack is an Idera, Inc company, the parent company of many notable brands such as apilayer. This is a company that knows how to build fast, highly scalable web-based tools and APIs. You too can trust Filestack with the content your application needs to ingest, transform, and deliver to your customers. It offers multiple subscription plans, and chances are you’ll find one to meet your application’s needs.

I know the question on your mind: why use Filestack instead of other services?

Features: Why Use Filestack?

Filestack is a set of tools that helps you manage file uploads, transformations, content delivery, image processing, and workflow automation. You’ll be hard-pressed to find a competing service that can do all of this:

Easily Improve Upload UX

With Filestack Upload, you can dramatically improve the look and performance of your file uploader with just two lines of code, and your users will notice a huge boost in performance—almost 4x faster!

Convert Documents

Filestack’s conversion API lets you convert between all the common formats, including PDFs, DOCs, PPTs, PNGs, and more.

Transform Images

Filestack’s image-processing engine enables you to transform images in bulk by simply changing the image URL.

Convert Audio and Video

Use Filestack’s conversion API to convert audio and video quickly and reliably to different formats without affecting your own infrastructure.

Deliver Content

Filestack will deliver large files to your site or app to display across mobile and desktop platforms without worrying about size limits, file compatibility, or quality.

Process Images With Machine Learning

Use state-of-the-art machine learning to automatically filter, categorize, and organize images. Filestack partners with best-in-class platforms to provide quick analysis of images.

Automate Content Workflow

Streamline your content tasks with Filestack’s easy-to-use UI, resulting in a clean, easy-to-manage process for preparing your content workflows.

Accelerate Development

Filestack is the “low code” platform that speeds up development by building automated content processing and analysis.

Store Files

Store files with Filestack or upload files to Amazon S3, Microsoft Azure, Dropbox, Rackspace, or Google Cloud Storage.

How It Works

It’s easy to get started with Filestack. First, you need to register an account. You can start with a 100% free (no credit card required) account, or you can choose one of the other subscriptions to meet your site’s or application’s needs.

After creating and verifying your account, you will first see the dashboard.

The dashboard is your hub for managing your account. Here, you’ll find your API key, quick account usage stats, getting started material, and links to other management and configuration tools.

Quick Tutorial

Let’s upload and transform an image. Other than your API key, the most important information displayed on the dashboard is the “Getting Started” material because you’ll need to integrate the Filestack File Picker in your site or application.

Filestack provides official file pickers for the web, iOS, and Android platforms. Naturally, the web file picker is the simplest to integrate into web applications. The iOS and Android pickers are native to their respective platforms, and their GitHub repositories, as well as Filestack’s documentation, provide useful examples for integrating them into your applications.

After you integrate a file picker with your application, you can test its functionality by opening the picker dialog. The following code is for the web file picker:

const client = filestack.init('YOUR API KEY');
const options = {
    onFileUploadFinished(file) {
        console.log(file);
    }
};
client.picker(options).open();

This code creates a Filestack client object that provides a high-level interface to the web API. Be sure to include your API key when initializing the client.

The next line of code defines a set of options for the picker. This code creates an options object that defines the onFileUploadFinished callback function. When the client finishes uploading the provided files, it calls the onFileUploadFinished function and supplies it with the uploaded file’s metadata. The following screenshot shows a sample payload:

Note the handle property in the payload; it is the unique identifier for the uploaded file, and the url property shows how you can use it to access the file.

You can transform images on the fly by including special tasks in the file URL. For example, the URL of https://cdn.filestackcontent.com/resize=width:600/xr96kBWGSXuQQuszRu26 scales the image to 600px width. You can use other tasks, such as crop, watermark, and compress, to achieve your desired result.

Keep in mind that there are tons of processing and transformation features not just for images, but also for documents, audio, and video. Filestack provides excellent documentation, so be sure to refer to it for your own needs.

Pricing

Filestack has several subscription plans. Each plan grants you a specific limit on bandwidth (calculated by views and downloads), uploads, transformations, and storage. Obviously, the higher-tier subscriptions grant higher limits and provide extra features.

The Free plan is great for testing or if you do not require a lot of bandwidth or storage. When you need more features, however, one of the following plans will fit your needs:

Start—This plan gets you started with 50GB of bandwidth, 20GB of storage, 10,000 uploads, and 25,000 transformations. You also gain the ability to store your files on other storage providers.

Grow—This plan gives you more than 5x the resource allotment of the Start plan for less than 4x the price. The Grow plan also gives you access to video conversions, a document viewer, and the transformations UI.

Scale—This plan gives you 2x the resource allotment of the Grow plan for less than 2x the cost. Additionally, you gain access to virus detection and other useful features.

Custom—Need even more? Build your own custom plan to pay for what you really need.

Conclusion

The digital age requires digital solutions for managing and handling content. Filestack has the performance and features your application needs to handle any type of content. With Filestack, your application can easily upload files to be transformed into other formats, and it can deliver that content reliably, with unparalleled speed. Getting started is fast, free, and easy. So get started today!