Image upload to firebase storage with React Jodit WYSIWYG Editor - reactjs

I'm using Jodit to create a WYSIWYG editor. My application is developed on React JS and Firebase handles the database and storage.
I am unable to add a custom function to allow image upload to firebase using Jodit Editor. Is there any possibility to add this directly? I would like to avoid using a function using NodeJs for image uploads only.


Possible workarounds:
Enable the following option within the default image uploader then use a cloud function to convert the base64 string to firebase storage and replace the string with the publicly accessible URL.
"uploader": { "insertImageAsBase64URI": true },
Create a http-accessible endpoint with cloud functions to process the image according to this documentation.

Related

How yo generate pdf of user input and simultaneously store that pdf into firebase storage using React?

I'm working on a resume builder website project, in that I need to generate a pdf of resume at runtime and store it in firebase storage simultaneously for later use using React JS.
For pdf purpose, I'm using react-to-pdf package which works something like this
<ReactToPdf>
{({toPdf, targetRef}) => (
<div onClick={toPdf} ref={targetRef}/>
)}
</ReactToPdf>
I need help on how to save the generated pdf in firebase

Edit a JSON file in azure blob storage by react

I have a json file in my container in azure blob storage. I want to edit it using react js. Like if I have something like "name" : "sandy"; I want to be able to change the name using react

uploading a doc file to alfresco using rest api and react js

I'm trying to send a document file to alfresco via a simple react js interface with a single upload button like the image. But I don't know how should I approach it. I managed to upload a file using postman but I'm a beginner in this field. What should I do?

How can I store a img into a MongoDB?

I need to make a "gallery" like Google Photos for a class project. My idea consists in a web app that allows a user to upload a file (image) and save it to a db and after that to show it in the web app. I just want to know how should the structure of my collection be if that collection saves a file (<16MB I read for >16MB we have to use gridfs).
For the back-end, I will use Node (with Express, Mongoose ... and so on) and for the front-end I will use react or vue.js. I am not sure yet.
Any suggestion is accepted.

You can do the following two things.
Upload image to s3 and save its link in the mongoDB. More Read(https://medium.com/#fabianopb/upload-files-with-node-and-react-to-aws-s3-in-3-steps-fdaa8581f2bd).
Save image in database in a GridFS collection. More Read
(https://docs.mongodb.com/manual/core/gridfs/#when-to-use-gridfs)

what are the options to fake data during front end development using reactjs

I am exploring the various options to fake the backend so that i can test my frontend. I am using reactjs for my frontend.
I tried using JSON file but not able to retrieve the image files and video files from the path.

Resources