How can I recreate this custom image download feature? - reactjs

A friend of mine has this feature on their site that I'm looking to recreate.
A URL is sent to the recipient, who can select the images they want and download them easily.
What would be the easiest way to recreate this?
https://ofafashion.co.uk/albums/p0Tu4b/digigirls-instagramready/8bf9b327314b89417af7798774a4bebcd1881b0f

You could have an useState storing the selected images ids and a function to download those images in an archive (using, for example, jszip)

Related

Where to download nsrdb weather data

I want to explore PVLib on nsrdb datasets, but I can't figure out where to download (or access) them.
NSRDB data can be downloaded manually from the NSRDB Viewer, or programmatically through their API using pvlib.iotools.get_psm3.

Does my mobile app need a database or should I save everything to files instead?

I have created a video editor using React Native. I need to choose a way to save all of the user's projects locally. Each project has a video file, thumbnails (images) and its current Redux state.
My first idea is to save everything in files using RNFS. Each Project's folder would have a video file, Thumbnails folder and a state.txt file containing my application's current state (current text size selected, background color, etc...).
Do I need a database like SQLITE or should I save everything in files? I know I'll have to use RNFS for the binary data like videos and images. But what about the state.txt file? is that a good idea? The idea of each user having their own local database just for that sounds strange to me.
You have your Redux state that just represents local state. Have a look at https://github.com/rt2zz/redux-persist
This allows you to serialize the Redux State and save it using whatever storage you provide, but you can use asyncStorage in the react native apps.
You are right about using RNFS for videos etc. For the metadata in state.txt, in my opinion, it would be better to go with async-storage or other offline storage options (like Realm )
It will be much more performant to query it instead of reading from a file.

How do you automatically add text dynamically to an image an export it?

Recently, Spotify released their 2019 Spotify wrapped web application, which is essentially a way for both music artists and music listeners to rewind and review what they listened to/who listened to their music in the past year.
As part of their site, they dynamically created these images that people could either export or share to one of their social media networks.
Above is an example of one of those dynamically generated images (of course, the image, and the text/statistics below change).
How would I go about doing this in code?
Sorry if this is in the wrong place - just wasn't sure where I would post this. Thanks in advance!
The easiest way of doing this would be to use a SVG as your base template allowing you to add in the text values after the fact.
Add the SVG to a canvas which can then be converted to jpeg by using .toDataURL("image/jpeg")

How should images be saved using express? Database, or just file?

I am using basically the mean stack. I'm also using multer but I am trying to see what the best practices are. Using Angular I can upload photos fine and they are going to a folder on my file system. From here I can just view them. However I'm wondering what the best practices are. Should I save the image url to a database along with the size and other properties or should I just pull them from the client? I've seen some solutions but they were from about 2 years ago so I wanted to make sure I'm current.
I have used ng-file-upload upload on the angular part and Multer on the node.js part to handle images for my system.
The method is appropriate and you can go ahead without any doubt.
Most of the websites on the internet follow the same method, they save the images in the file disk system and then they save it's url in the respective database.
Using multer you can have all information required for a photo and the module is really flexible with a lot many options.
I think you should go ahead with what you have in mind. Best of luck.
You just save the image url from the directory, where image is stored. If you need any information, you can get the information from the image where image is stored (Get image from url). So just save image url into database.

cakephp upload image to folder and store reference on database

In the cakephp 2.0 application i'm developing i will need a HABTM relationship between a table with "normal" data and one with stored images.
After a search, i came to conclude that the best way of implementing this was to store the images in the directory of the application, and in the table "images" a reference to the url of each image so that i can display them later on the application. Please, if you think this is not the best implementation please say so.
Looking into this, i would like to know how can i do this, i mean, how can i store the images on directory and store a reference in a database in the same function of a controller?
I did some searchs but i found only uploading to folders or only storing the images on database.
Thank you!
My FileStorage plugin https://github.com/burzum/FileStorage in combination with the https://github.com/CakeDC/Imagine plugin will exactly do what you want.
All file data is stored in the database, the files itself in the local file system or any of the other adapters. It's also handling generating versions of the image after upload.
Read the readme.md it is exactly doing what you want and I'm already using it in different projects, also for a gallery and user avatars.

Resources