![]() I haven’t digg the video side of this but I read bunch of smart stuff on the streaming site which is also worth considering cloudinary as one-stop-shop for visual static assets.Īdd Cloudinary service on your heroku applicationĪdding a service to heroku application is very easy and mostly done in command line. Basic things like color filters, crop, resize, rotate etc… But the real thing is where they have face recognization that you can create square avatars with intelligently telling cloudinary to give you the face focused position in the center on your circle avatar with transparent png background and have 2px border around circle cropped avatar. ![]() The magic cloudinary has that is compelling that it can do so many varieties of transformations on your images on the fly (and caches them). I like the API/SDK route which they have SDKs and well-designed API for almost all platforms. It’ll be your storage bucket that also has many out of box solutions for known CMSs like WordPress. If you have decent size traffic, you may think to pay or optimize your solution with Cloudinary.Ĭloudinary hosts and serves images for you. It has a pretty decent free package that will be enough for almost all personal, experimental and small projects. Done!Ĭloudinary is that big brother and storage and server together. I only want to upload an image and only wait the time takes the file transfer from my device to the server. But from user experience (admin/editor) standpoint, nobody wants to do this manually or even automatically but wait for the server to resize and prepare these versions when uploading a single photo to your CMS/app/back-end. So many self-solutions you can use or code it up. This makes total sense right? Strategizing how to have the different versions ready on your server (or CDN) is another thing. This was a novelty in the past where we wanted to have multiple sizes of an image/photo so we can economically request the right size in different pages – example: get 100px width thumbnail in the page where we show photos in a grid, show the 500px width version on the lightbox, and link out to the original photo in the “download” button. We’ll not get into the techniques of how to separate these different things in different places in this article, but we’ll talk about images specifically. Having distributed sources will make your browser to manage parallel downloads of your site’s resources faster. This will also affect your site’s performance that everything is coming from the same source. Tiring your web server with serving images or compiled CSS is not optimal. Yet, it shouldn’t be served (or requested) from the same servers which are responsible (only should be responsible) for rendering and serving your pages. A static content that will not be used to render your page on the back-end ideally doesn’t belong to the place where you store your application (code). ![]() It’s so easy to leave an image that is used in a blog post within the codebase (which is wrong). This is not a new practice but it’s a practice that can be missed so easily. Which made us do a soft transition to keep common files (that can be changed) like uploads folders in block storages like s3 or azure blob… But it still doesn’t do the full justice that both static and dynamic content of an application/website should be completely separated than the application code. Now we have distributed deployment systems with having multiple instances of our application on different web servers too. So when we code and deploy a site, it’s HTML, CSS, back-end code, images, videos, fonts, etc… all in the same place. One thing very common and old school is that everything on the site is organized in the same bucket. We’re (web/back-end/front-end developers) building apps, sites in many different ways (different platforms, languages, stack). This story is about manually storing, handling upload, download and serving static photo/image using a CDN service called Cloudinary.Ĭontent should be separate than the application I’ve previously (right before this article) wrote about Authenticating and Getting Instagram Photos in NodeJS/Express application. Here we are with another article about the development aspect of photo/image management (storage, serving, retrieval).
0 Comments
Leave a Reply. |
AuthorWrite something about yourself. No need to be fancy, just an overview. ArchivesCategories |