Frontend

In case you missed Part 1, follow this link below   Uploading file into azure blob storage using Azure Keyvault credentials with NodeJS and React - Part 1 So now let's create the UI using reactJS.  Finished app looks like below screenshot, which only has an upload option, you may add other features and fields with validation as you need. Initiate a react app using command : create-react-app sample-azure-client-app Dependency for endpoint call : axios   install via npm i --save axios Create App component import React from 'react'; import UploadImage from './assets/upload.png' import axios from 'axios' const onChange = e => { const files = Array.from(e.target.files) const currentFile = files[0] const formData = new FormData() formData.append('file',currentFile) axios({ url:'http://localhost:3001/upload/file', method:'POST', params:null, data:formData, hea...

Hello everyone, in this article I will talk about how we can upload files into azure blob storage using azure keyvault credentials.   There are multiple ways we can connect to Azure Blob from a webapp(eg. react). Connecting to AzureBlob with static credential is possible directly from React App itself.  But when we are trying to get the credential stored in Azure Keyvault and using that credential to get access to blob storage then we will need a middle layer like Java or Node etc. Here I will show an end to end example . First I will create a node application and expose a service which can be called from React/Angular or any application which will allow user select files and upload them into blob storage directly. Lets get started : Here is the folder structure we have for the Node application. There are some dependencies we need to install before we begin.  My package.json now looks like this : {   "na...