Serverside Tile View in react

How to show images and information by react from the server in tile view?
I know bootstrap and many other frameworks do this task but I don’t know when to connect to the backend.

How are you receiving images from the server?

Are you asking about when to call an API? If so, you do it using lifecycle methods or hooks. Refer this – https://reactjs.org/docs/faq-ajax.html

I have saved images in a folder and saved their path in the database.

You have to retrieve paths from the database and send it as an response to the API call from your react app.

On the frontend, you save those paths in the component state, once you recieve API response, and pass them as src to the images.

Can you please give me an example?

Since we have to create both frontend and backend for this, I think this is too much of a task to create an example for.

I’d recommend you to tackle one task at a time though, first concentrate on storing images in a folder on server side and paths in the database. Also you’ll have to set that folder as a static folder on your backend so if people have path to your image, they should be able to open it in a browser by attaching path to your API endpoint. If that part is done, then we can come back to frontend.

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.