My Recipe Archiver & Organizer Django Application - RecipeIndex

RecipeIndex screenshot.
Screenshot of RecipeIndex app homepage.

RecipeIndex is an app I built to improve my process for storing and managing my family's favorite recipes. It was built with Django and is currently deployed on Heroku.

My wife and I love to cook and bake. I actually bake quite often and you can check it out over at my Instagram. I used to maintain a Google Sheet that had all of the recipes we would make. While it was fairly robust and organized by many facets, over time I found a need for more advanced features and efficiency that a spreadsheet simply couldn’t facilitate alone. I decided to build an application that stores all of these recipes and that’s how the RecipeIndex was born.

I built RecipeIndex with Django which is a Python web framework that I've utilized for different projects for quite a few years now. It's an extremely powerful framework that allows for the rapid development of quite complex applications.

While the RecipeIndex application at its core is still just a table of recipes, it does so much more.

So how does it work? To add a recipe to the database, the user simply needs to input the URL of a recipe that they want to store and the application scrapes many data points such as the name of the recipe, the list of ingredients, and the directions.

URL input form
The user inputs the URL for a recipe and the app scrapes data from the page.

Scraped recipe information.
Scraped information from the page populates in the recipe form.

Using many-to-many relationships, the user can also assign many attributes to a recipe including cuisine type, mealtime, recipe category, and much more.

The user can also tag a recipe with all the ingredients used. This tagging system makes it incredibly easy later to filter all recipes by specific ingredients. We hate waste so this feature has really come in handy when we have an ingredient that we need to use before it goes bad.

RecipeIndex tagging system.
Example of the tagging system.

In the screenshot above, you'll also notice the use of a drop-down menu. This menu autocompletes objects based upon the user input, making populating the ingredients field extremely fast. Thankfully this feature was achieved through the Django Autocomplete Light package which really came in handy here.

One additional feature I built in is the ability to host files for a recipe. For example, if you want to save a PDF version of a full recipe, you can do that as well. Basically, the app connects to an AWS S3 bucket in order to host the files and I built a detail view for viewing the files within the app.

Hosted PDF file on Amazon S3 bucket
Recipe PDF hosted on S3 bucket.

So after filling out the fields (most fields are optional), you simply submit the recipe and it's added to the database.

Recipe detail view
Recipe detail view.

Now let's jump back to the main RecipeIndex table.

The main table (pictured at the top of this post) showcases all of the recipes that the user has submitted along with many key details that are useful in sorting and finding recipes. There are a few key packages that I also used to build out this particular view. The first one is Django Tables which helps to quickly build out HTML tables based on the application's models. This package also integrates seamlessly with the second package, Django Filter, which powers all of the filtering functionality in the table.

This app was a blast to build and I'm super pleased with the result. Currently, it's hosted on Heroku using a hobby dyno so it's not really set up for broader public usage, however, I've made the GitHub repo public so feel free to create a clone of your very own RecipeIndex. 😊


Recent Posts

See All