Using google storage to store media files in strapi

This is the fourth blog post on the series of blog post I am posting about strapi,nextjs, and tailwind. We are recreating my portfolio/blogpost page that along the way we'll learn the fundamentals of strapi,nextjs, and tailwind. You can check it out at myportfolio If you know the basics of javascript and react then you should be good to follow this blog post and coming blog post on the series. I hope you'll get something out of this series.

In this blog post, we're going to set up google bucket to store our media files.
So go ahead and install a plugin

 yarn add strapi-provider-upload-google-cloud-storage
 or 
 npm i strapi-provider-upload-google-cloud-storage

Now we've to create a google cloud bucket and generate the service account for that
I'm using the firebase project which makes it very easy to create a google bucket and generate the service account You can create a google bucket through google cloud console too. If you're using firebase then go to project settings and service account. Click the Generate a new private key. This will download a simple file with JSON data on it. We've to copy that JSON data and stringify it and put it as an environment variable in our strapi app.

Let's create the env file with GCP_SERVICE_ACCOUNT !

After that create a plugins.js file in the config and add the following code

 module.exports = ({ env }) => ({
  upload: {
    provider: "google-cloud-storage",
    providerOptions: {
      bucketName: "yourbucketnamehere",
      publicFiles: true,
      uniform: false,
      basePath: "",
      serviceAccount: env.json("GCP_SERVICE_ACCOUNT"),
    },
  },
});

And that's it now we should be uploading files to the google bucket instead of a local file system. Now you can upload any media file and it will end up in your google bucket as:

You can see it creates a bunch of files and folders when uploading files as it creates a different responsive version of the images that you upload. you can change this setting from within strapi admin as

And that is it about using google Buckets to store media files in strapi. The process for uploading to other providers is also pretty similar. In another blog post, we'll create our landing page. If you have any problem with this setup and then let me know in the discussion.