exif-photo-blog
Photo blog, reporting 🤓 EXIF camera details (aperture, shutter speed, ISO) for each image.
Stars: 609
EXIF Photo Blog is a full-stack photo blog application built with Next.js, Vercel, and Postgres. It features built-in authentication, photo upload with EXIF extraction, photo organization by tag, infinite scroll, light/dark mode, automatic OG image generation, a CMD-K menu with photo search, experimental support for AI-generated descriptions, and support for Fujifilm simulations. The application is easy to deploy to Vercel with just a few clicks and can be customized with a variety of environment variables.
README:
https://github.com/sambecker/exif-photo-blog/assets/169298/4253ea54-558a-4358-8834-89943cfbafb4
- Built-in auth
- Photo upload with EXIF extraction
- Organize photos by tag
- Infinite scroll
- Light/dark mode
- Automatic OG image generation
- CMD-K menu with photo search
- Experimental support for AI-generated descriptions
- Support for Fujifilm simulations
- Click Deploy
- Add required storage (Vercel Postgres + Vercel Blob) as part of template installation
- Configure environment variables from project settings:
-
NEXT_PUBLIC_SITE_TITLE
(e.g., My Photos) -
NEXT_PUBLIC_SITE_DOMAIN
(e.g., photos.domain.com) -
NEXT_PUBLIC_SITE_DESCRIPTION
(optional—mainly used for OG meta)
-
-
Generate auth secret and add to environment variables:
AUTH_SECRET
- Add admin user to environment variables:
ADMIN_EMAIL
ADMIN_PASSWORD
- Trigger redeploy
- Visit project on Vercel, navigate to "Deployments" tab, click ••• button next to most recent deployment, and select "Redeploy"
- Visit
/admin
- Sign in with credentials supplied in Step 2
- Click "Upload Photos"
- Add optional title
- Click "Create"
- Clone code
- Run
pnpm i
to install dependencies - If necessary, install Vercel CLI and authenticate by running
vercel login
- Run
vercel link
to connect the CLI to your project - Run
vercel dev
to start dev server with Vercel-managed environment variables
Usage of this feature will result in fees from OpenAI. When enabling AI text generation, follow all recommended mitigations in order to avoid unexpected charges and attacks. Make sure your OpenAI secret key environment variable is not prefixed with NEXT_PUBLIC.
- Setup OpenAI
- If you don't already have one, create an OpenAI account and fund it (see this thread if you're having issues)
- Generate an API key and store in environment variable
OPENAI_SECRET_KEY
- Setup usage limits to avoid unexpected charges (recommended)
- Add rate limiting (recommended)
- As an additional precaution, create a Vercel KV store and link it to your project in order to enable rate limiting—no further configuration necessary
- Configure auto-generated fields (optional)
- Set which text fields auto-generate when uploading a photo by storing a comma-separated list, e.g.,
AI_TEXT_AUTO_GENERATED_FIELDS = title, semantic
- Accepted values:
-
all
(default) title
caption
tags
semantic
none
-
- Set which text fields auto-generate when uploading a photo by storing a comma-separated list, e.g.,
- Open project on Vercel
- Click "Analytics" tab
- Follow "Enable Web Analytics" instructions (
@vercel/analytics
already included)
- Open project on Vercel
- Click "Speed Insights" tab
- Follow "Enable Speed Insights" instructions (
@vercel/speed-insights
already included)
Application behavior can be changed by configuring the following environment variables:
-
NEXT_PUBLIC_PRO_MODE = 1
enables higher quality image storage (results in increased storage usage) -
NEXT_PUBLIC_STATICALLY_OPTIMIZE_PAGES = 1
enables static optimization for pages, i.e., renders pages at build time (results in increased project usage)—⚠️ Experimental -
NEXT_PUBLIC_STATICALLY_OPTIMIZE_OG_IMAGES = 1
enables static optimization for OG images, i.e., renders images at build time (results in increased project usage)—⚠️ Experimental -
NEXT_PUBLIC_MATTE_PHOTOS = 1
constrains the size of each photo, and enables a surrounding border (potentially useful for photos with tall aspect ratios) -
NEXT_PUBLIC_BLUR_DISABLED = 1
prevents image blur data being stored and displayed (potentially useful for limiting Postgres usage) -
NEXT_PUBLIC_GEO_PRIVACY = 1
disables collection/display of location-based data (⚠️ re-compresses uploaded images in order to remove GPS information) -
NEXT_PUBLIC_IGNORE_PRIORITY_ORDER = 1
preventspriority_order
field affecting photo order -
NEXT_PUBLIC_PUBLIC_API = 1
enables public API available at/api
-
NEXT_PUBLIC_HIDE_REPO_LINK = 1
removes footer link to repo -
NEXT_PUBLIC_HIDE_SOCIAL = 1
removes X button from share modal -
NEXT_PUBLIC_HIDE_FILM_SIMULATIONS = 1
prevents Fujifilm simulations showing up in/grid
sidebar and CMD-K search results -
NEXT_PUBLIC_HIDE_EXIF_DATA = 1
hides EXIF data in photo details and OG images (potentially useful for portfolios, which don't focus on photography) -
NEXT_PUBLIC_GRID_ASPECT_RATIO = 1.5
sets aspect ratio for grid tiles (defaults to1
—setting to0
removes the constraint) -
NEXT_PUBLIC_OG_TEXT_ALIGNMENT = BOTTOM
keeps OG image text bottom aligned (default is top)
Only one storage adapter—Vercel Blob, Cloudflare R2, or AWS S3—can be used at a time. Ideally, this is configured before photos are uploaded (see Issue #34 for migration considerations). If you have multiple adapters, you can set one as preferred by storing "aws-s3," "cloudflare-r2," or "vercel-blob" in NEXT_PUBLIC_STORAGE_PREFERENCE
.
- Setup bucket
- Create R2 bucket with default settings
- Setup CORS under bucket settings:
[{ "AllowedHeaders": ["*"], "AllowedMethods": [ "GET", "PUT" ], "AllowedOrigins": [ "http://localhost:3000", "https://{VERCEL_PROJECT_NAME}*.vercel.app", "{PRODUCTION_DOMAIN}" ] }]
- Enable public hosting by doing one of the following:
- Select "Connect Custom Domain" and choose a Cloudflare domain
- OR
- Select "Allow Access" from R2.dev subdomain
- Store public configuration:
-
NEXT_PUBLIC_CLOUDFLARE_R2_BUCKET
: bucket name -
NEXT_PUBLIC_CLOUDFLARE_R2_ACCOUNT_ID
: account id (found on R2 overview page) -
NEXT_PUBLIC_CLOUDFLARE_R2_PUBLIC_DOMAIN
: either "your-custom-domain.com" or "pub-jf90908...s0d9f8s0s9df.r2.dev" (do not include "https://" in your domain)
-
- Setup private credentials
- Create API token by selecting "Manage R2 API Tokens," and clicking "Create API Token"
- Select "Object Read & Write," choose "Apply to specific buckets only," and select the bucket created in Step 1
- Store credentials (
⚠️ Ensure access keys are not prefixed withNEXT_PUBLIC
):CLOUDFLARE_R2_ACCESS_KEY
CLOUDFLARE_R2_SECRET_ACCESS_KEY
- Setup bucket
- Create S3 bucket with "ACLs enabled," and "Block all public access" turned off
- Setup CORS under bucket permissions:
[{ "AllowedHeaders": ["*"], "AllowedMethods": [ "GET", "PUT" ], "AllowedOrigins": [ "http://localhost:*", "https://{VERCEL_PROJECT_NAME}*.vercel.app", "{PRODUCTION_DOMAIN}" ], "ExposeHeaders": [] }]
- Store public configuration
-
NEXT_PUBLIC_AWS_S3_BUCKET
: bucket name -
NEXT_PUBLIC_AWS_S3_REGION
: bucket region, e.g., "us-east-1"
-
- Setup private credentials
-
Create IAM policy using JSON editor:
{ "Version": "2012-10-17", "Statement": [ { "Effect": "Allow", "Action": [ "s3:PutObject", "s3:PutObjectACL", "s3:GetObject", "s3:ListBucket", "s3:DeleteObject" ], "Resource": [ "arn:aws:s3:::{BUCKET_NAME}", "arn:aws:s3:::{BUCKET_NAME}/*" ] } ] }
-
Create IAM user by choosing "Attach policies directly," and selecting the policy created above. Create "Access key" under "Security credentials," choose "Application running outside AWS," and store credentials (
⚠️ Ensure access keys are not prefixed withNEXT_PUBLIC
):AWS_S3_ACCESS_KEY
AWS_S3_SECRET_ACCESS_KEY
-
Create IAM policy using JSON editor:
Vercel Postgres can be switched to another Postgres-compatible, pooling provider by updating POSTGRES_URL
. Some providers only work when SSL is disabled, which can configured by setting DISABLE_POSTGRES_SSL = 1
.
- Ensure connection string is set to "Transaction Mode" via port
6543
- Disable SSL by setting
DISABLE_POSTGRES_SSL = 1
This template statically optimizes core views such as
/
and/grid
to minimize visitor load times. Consequently, when photos are added, edited, or removed, it might take several minutes for those changes to propagate. If it seems like a change is not taking effect, try navigating to/admin/configuration
and clicking "Clear Cache."
As the template has evolved, EXIF fields (such as lenses) have been added, blur data is generated through a different method, and AI/privacy features have been added. In order to bring older photos up to date, either click the 'sync' button next to a photo or use the outdated photo page (
/admin/outdated
) to make batch updates.
Many services such as iMessage, Slack, and X, require near-instant responses when unfurling link-based content. In order to guarantee sufficient responsiveness, consider rendering pages and image assets ahead of time by enabling static optimization by setting
NEXT_PUBLIC_STATICALLY_OPTIMIZE_PAGES = 1
andNEXT_PUBLIC_STATICALLY_OPTIMIZE_OG_IMAGES = 1
. Keep in mind that this will increase platform usage.
By default, all photos are shown full-width, regardless of orientation. Enable matting to showcase horizontal and vertical photos at similar scales by setting
NEXT_PUBLIC_MATTE_PHOTOS = 1
.
How secure are photos marked “hidden?”
While all hidden paths (
/tag/hidden/*
) require authentication, raw links to individual photo assets remain publicly accessible. Randomly generated urls from storage providers are only secure via obscurity. Use with caution.
My images/content have fallen out of sync with my database and/or my production site no longer matches local development. What do I do?
Navigate to
/admin/configuration
and click "Clear Cache."
Navigate to
/admin/configuration
and click "Clear Cache." If this doesn't help, open an issue.
Absent configuration, the default grid aspect ratio is
1
.NEXT_PUBLIC_GRID_ASPECT_RATIO
can be set to any number (for instance,1.5
for 3:2 images) or ignored by setting to0
.
Fujifilm simulation data is stored in vendor-specific Makernote binaries embedded in EXIF data. Under certain circumstances an intermediary may strip out this data. For instance, there is a known issue on iOS where editing an image, e.g., cropping it, causes Makernote data loss. If your simulation data appears to be missing, try importing the original file as it was stored by the camera. Additionally, if you can confirm the simulation mode on camera, you can then edit the photo record and manually select it.
For a number of reasons, only EXIF orientations: 1, 3, 6, and 8 are supported. Orientations 2, 4, 5, and 7—which make use of mirroring—are not supported.
Earlier versions of this template generated blur data on the client, which varied visually from browser to browser. Data is now generated consistently on the server. If you wish to update blur data for a particular photo, edit the photo in question, make no changes, and choose "Update."
The default timeout for processing multiple uploads is 60 seconds (the limit for Hobby accounts). This can be extended to 5 minutes on Pro accounts by setting
maxDuration = 300
insrc/app/admin/uploads/page.tsx
.
For Tasks:
Click tags to check more tools for each tasksFor Jobs:
Alternative AI tools for exif-photo-blog
Similar Open Source Tools
exif-photo-blog
EXIF Photo Blog is a full-stack photo blog application built with Next.js, Vercel, and Postgres. It features built-in authentication, photo upload with EXIF extraction, photo organization by tag, infinite scroll, light/dark mode, automatic OG image generation, a CMD-K menu with photo search, experimental support for AI-generated descriptions, and support for Fujifilm simulations. The application is easy to deploy to Vercel with just a few clicks and can be customized with a variety of environment variables.
fragments
Fragments is an open-source tool that leverages Anthropic's Claude Artifacts, Vercel v0, and GPT Engineer. It is powered by E2B Sandbox SDK and Code Interpreter SDK, allowing secure execution of AI-generated code. The tool is based on Next.js 14, shadcn/ui, TailwindCSS, and Vercel AI SDK. Users can stream in the UI, install packages from npm and pip, and add custom stacks and LLM providers. Fragments enables users to build web apps with Python interpreter, Next.js, Vue.js, Streamlit, and Gradio, utilizing providers like OpenAI, Anthropic, Google AI, and more.
langserve
LangServe helps developers deploy `LangChain` runnables and chains as a REST API. This library is integrated with FastAPI and uses pydantic for data validation. In addition, it provides a client that can be used to call into runnables deployed on a server. A JavaScript client is available in LangChain.js.
aiexe
aiexe is a cutting-edge command-line interface (CLI) and graphical user interface (GUI) tool that integrates powerful AI capabilities directly into your terminal or desktop. It is designed for developers, tech enthusiasts, and anyone interested in AI-powered automation. aiexe provides an easy-to-use yet robust platform for executing complex tasks with just a few commands. Users can harness the power of various AI models from OpenAI, Anthropic, Ollama, Gemini, and GROQ to boost productivity and enhance decision-making processes.
Lumos
Lumos is a Chrome extension powered by a local LLM co-pilot for browsing the web. It allows users to summarize long threads, news articles, and technical documentation. Users can ask questions about reviews and product pages. The tool requires a local Ollama server for LLM inference and embedding database. Lumos supports multimodal models and file attachments for processing text and image content. It also provides options to customize models, hosts, and content parsers. The extension can be easily accessed through keyboard shortcuts and offers tools for automatic invocation based on prompts.
ai-artifacts
AI Artifacts is an open source tool that replicates Anthropic's Artifacts UI in the Claude chat app. It utilizes E2B's Code Interpreter SDK and Core SDK for secure AI code execution in a cloud sandbox environment. Users can run AI-generated code in various languages such as Python, JavaScript, R, and Nextjs apps. The tool also supports running AI-generated Python in Jupyter notebook, Next.js apps, and Streamlit apps. Additionally, it offers integration with Vercel AI SDK for tool calling and streaming responses from the model.
client-python
The Mistral Python Client is a tool inspired by cohere-python that allows users to interact with the Mistral AI API. It provides functionalities to access and utilize the AI capabilities offered by Mistral. Users can easily install the client using pip and manage dependencies using poetry. The client includes examples demonstrating how to use the API for various tasks, such as chat interactions. To get started, users need to obtain a Mistral API Key and set it as an environment variable. Overall, the Mistral Python Client simplifies the integration of Mistral AI services into Python applications.
HippoRAG
HippoRAG is a novel retrieval augmented generation (RAG) framework inspired by the neurobiology of human long-term memory that enables Large Language Models (LLMs) to continuously integrate knowledge across external documents. It provides RAG systems with capabilities that usually require a costly and high-latency iterative LLM pipeline for only a fraction of the computational cost. The tool facilitates setting up retrieval corpus, indexing, and retrieval processes for LLMs, offering flexibility in choosing different online LLM APIs or offline LLM deployments through LangChain integration. Users can run retrieval on pre-defined queries or integrate directly with the HippoRAG API. The tool also supports reproducibility of experiments and provides data, baselines, and hyperparameter tuning scripts for research purposes.
semantic-cache
Semantic Cache is a tool for caching natural text based on semantic similarity. It allows for classifying text into categories, caching AI responses, and reducing API latency by responding to similar queries with cached values. The tool stores cache entries by meaning, handles synonyms, supports multiple languages, understands complex queries, and offers easy integration with Node.js applications. Users can set a custom proximity threshold for filtering results. The tool is ideal for tasks involving querying or retrieving information based on meaning, such as natural language classification or caching AI responses.
upgini
Upgini is an intelligent data search engine with a Python library that helps users find and add relevant features to their ML pipeline from various public, community, and premium external data sources. It automates the optimization of connected data sources by generating an optimal set of machine learning features using large language models, GraphNNs, and recurrent neural networks. The tool aims to simplify feature search and enrichment for external data to make it a standard approach in machine learning pipelines. It democratizes access to data sources for the data science community.
bedrock-claude-chat
This repository is a sample chatbot using the Anthropic company's LLM Claude, one of the foundational models provided by Amazon Bedrock for generative AI. It allows users to have basic conversations with the chatbot, personalize it with their own instructions and external knowledge, and analyze usage for each user/bot on the administrator dashboard. The chatbot supports various languages, including English, Japanese, Korean, Chinese, French, German, and Spanish. Deployment is straightforward and can be done via the command line or by using AWS CDK. The architecture is built on AWS managed services, eliminating the need for infrastructure management and ensuring scalability, reliability, and security.
parsera
Parsera is a lightweight Python library designed for scraping websites using LLMs. It offers simplicity and efficiency by minimizing token usage, enhancing speed, and reducing costs. Users can easily set up and run the tool to extract specific elements from web pages, generating JSON output with relevant data. Additionally, Parsera supports integration with various chat models, such as Azure, expanding its functionality and customization options for web scraping tasks.
sdfx
SDFX is the ultimate no-code platform for building and sharing AI apps with beautiful UI. It enables the creation of user-friendly interfaces for complex workflows by combining Comfy workflow with a UI. The tool is designed to merge the benefits of form-based UI and graph-node based UI, allowing users to create intricate graphs with a high-level UI overlay. SDFX is fully compatible with ComfyUI, abstracting the need for installing ComfyUI. It offers features like animated graph navigation, node bookmarks, UI debugger, custom nodes manager, app and template export, image and mask editor, and more. The tool compiles as a native app or web app, making it easy to maintain and add new features.
llm-vscode
llm-vscode is an extension designed for all things LLM, utilizing llm-ls as its backend. It offers features such as code completion with 'ghost-text' suggestions, the ability to choose models for code generation via HTTP requests, ensuring prompt size fits within the context window, and code attribution checks. Users can configure the backend, suggestion behavior, keybindings, llm-ls settings, and tokenization options. Additionally, the extension supports testing models like Code Llama 13B, Phind/Phind-CodeLlama-34B-v2, and WizardLM/WizardCoder-Python-34B-V1.0. Development involves cloning llm-ls, building it, and setting up the llm-vscode extension for use.
nvim.ai
nvim.ai is a powerful Neovim plugin that enables AI-assisted coding and chat capabilities within the editor. Users can chat with buffers, insert code with an inline assistant, and utilize various LLM providers for context-aware AI assistance. The plugin supports features like interacting with AI about code and documents, receiving relevant help based on current work, code insertion, code rewriting (Work in Progress), and integration with multiple LLM providers. Users can configure the plugin, add API keys to dotfiles, and integrate with nvim-cmp for command autocompletion. Keymaps are available for chat and inline assist functionalities. The chat dialog allows parsing content with keywords and supports roles like /system, /you, and /assistant. Context-aware assistance can be accessed through inline assist by inserting code blocks anywhere in the file.
aiavatarkit
AIAvatarKit is a tool for building AI-based conversational avatars quickly. It supports various platforms like VRChat and cluster, along with real-world devices. The tool is extensible, allowing unlimited capabilities based on user needs. It requires VOICEVOX API, Google or Azure Speech Services API keys, and Python 3.10. Users can start conversations out of the box and enjoy seamless interactions with the avatars.
For similar tasks
exif-photo-blog
EXIF Photo Blog is a full-stack photo blog application built with Next.js, Vercel, and Postgres. It features built-in authentication, photo upload with EXIF extraction, photo organization by tag, infinite scroll, light/dark mode, automatic OG image generation, a CMD-K menu with photo search, experimental support for AI-generated descriptions, and support for Fujifilm simulations. The application is easy to deploy to Vercel with just a few clicks and can be customized with a variety of environment variables.
photoprism
PhotoPrism is an AI-powered photos app for the decentralized web. It uses the latest technologies to tag and find pictures automatically without getting in your way. You can run it at home, on a private server, or in the cloud.
album-ai
Album AI is an experimental project that uses GPT-4o-mini to automatically identify metadata from image files in the album. It leverages RAG technology to enable conversations with the album, serving as a photo album or image knowledge base to assist in content generation. The tool provides APIs for search and chat functionalities, supports one-click deployment to platforms like Render, and allows for integration and modification under a permissive open-source license.
home-gallery
Home-Gallery.org is a self-hosted open-source web gallery for browsing personal photos and videos with tagging, mobile-friendly interface, and AI-powered image and face discovery. It aims to provide a fast user experience on mobile phones and help users browse and rediscover memories from their media archive. The tool allows users to serve their local data without relying on cloud services, view photos and videos from mobile phones, and manage images from multiple media source directories. Features include endless photo stream, video transcoding, reverse image lookup, face detection, GEO location reverse lookups, tagging, and more. The tool runs on NodeJS and supports various platforms like Linux, Mac, and Windows.
For similar jobs
exif-photo-blog
EXIF Photo Blog is a full-stack photo blog application built with Next.js, Vercel, and Postgres. It features built-in authentication, photo upload with EXIF extraction, photo organization by tag, infinite scroll, light/dark mode, automatic OG image generation, a CMD-K menu with photo search, experimental support for AI-generated descriptions, and support for Fujifilm simulations. The application is easy to deploy to Vercel with just a few clicks and can be customized with a variety of environment variables.
obsidian-textgenerator-plugin
Text Generator is an open-source AI Assistant Tool that leverages Generative Artificial Intelligence to enhance knowledge creation and organization in Obsidian. It allows users to generate ideas, titles, summaries, outlines, and paragraphs based on their knowledge database, offering endless possibilities. The plugin is free and open source, compatible with Obsidian for a powerful Personal Knowledge Management system. It provides flexible prompts, template engine for repetitive tasks, community templates for shared use cases, and highly flexible configuration with services like Google Generative AI, OpenAI, and HuggingFace.
video2blog
video2blog is an open-source project aimed at converting videos into textual notes. The tool follows a process of extracting video information using yt-dlp, downloading the video, downloading subtitles if available, translating subtitles if not in Chinese, generating Chinese subtitles using whisper if no subtitles exist, converting subtitles to articles using gemini, and manually inserting images from the video into the article. The tool provides a solution for creating blog content from video resources, enhancing accessibility and content creation efficiency.
obsidian-weaver
Obsidian Weaver is a plugin that integrates ChatGPT/GPT-3 into the note-taking workflow of Obsidian. It allows users to easily access AI-generated suggestions and insights within Obsidian, enhancing the writing and brainstorming process. The plugin respects Obsidian's philosophy of storing notes locally, ensuring data security and privacy. Weaver offers features like creating new chat sessions with the AI assistant and receiving instant responses, all within the Obsidian environment. It provides a seamless integration with Obsidian's interface, making the writing process efficient and helping users stay focused. The plugin is constantly being improved with new features and updates to enhance the note-taking experience.
LLMStack
LLMStack is a no-code platform for building generative AI agents, workflows, and chatbots. It allows users to connect their own data, internal tools, and GPT-powered models without any coding experience. LLMStack can be deployed to the cloud or on-premise and can be accessed via HTTP API or triggered from Slack or Discord.
daily-poetry-image
Daily Chinese ancient poetry and AI-generated images powered by Bing DALL-E-3. GitHub Action triggers the process automatically. Poetry is provided by Today's Poem API. The website is built with Astro.
SillyTavern
SillyTavern is a user interface you can install on your computer (and Android phones) that allows you to interact with text generation AIs and chat/roleplay with characters you or the community create. SillyTavern is a fork of TavernAI 1.2.8 which is under more active development and has added many major features. At this point, they can be thought of as completely independent programs.
Twitter-Insight-LLM
This project enables you to fetch liked tweets from Twitter (using Selenium), save it to JSON and Excel files, and perform initial data analysis and image captions. This is part of the initial steps for a larger personal project involving Large Language Models (LLMs).