Back to Blog

Building a Blog with Next.js, Node.js, and Cloudinary

May 2, 20263 min read
Abnet Mekonen
 Building a Blog with Next.js, Node.js, and Cloudinary  cover
# 🚀 Building a Blog with Next.js, Node.js, and Cloudinary When I built my blog project, everything worked perfectly on my local machine. Images loaded correctly, posts were created without issues, and the app felt complete. However, after deploying it to production, I started facing unexpected problems—images stopped loading, and Next.js began throwing errors. The main issue was that I was storing image URLs using `localhost`, which only works on my own computer and is not accessible on the internet. To fix this, I switched to using Cloudinary. Instead of saving images locally, I uploaded them to Cloudinary and stored the returned URLs in my database. This ensured that the images were accessible from anywhere, both in development and production. After that, I updated my Next.js configuration to allow images from Cloudinary, which resolved the remaining issues. The key lesson I learned is simple: avoid using local storage for production apps and always rely on cloud services for handling media. This approach makes your application more reliable, scalable, and ready for real-world use.
nextjsnodejscloudinarymongodbwebdevelopmentfullstackjavascripttypescriptbackendfrontendapiimage-uploadcloud-storagereactexpressdeveloperprogrammingsoftwarewebappdeploymentNextjsCloudinaryNode.js
Related images
 Building a Blog with Next.js, Node.js, and Cloudinary  screenshot 2
 Building a Blog with Next.js, Node.js, and Cloudinary  screenshot 3
 Building a Blog with Next.js, Node.js, and Cloudinary  screenshot 4
 Building a Blog with Next.js, Node.js, and Cloudinary  screenshot 5