Prerequisites
Make sure you have the following installed:
- Python
- Flask
- SQLite
You can install Flask using pip:
pip install Flask
Basic Structure
- Project Directory:
recipe_sharing/ ├── app.py ├── templates/ │ ├── index.html │ ├── recipe.html │ └── submit.html └── recipes.db- Database Setup: Create a SQLite database to store recipes. You can do this with the following script:pythonCopy code
# create_db.py import sqlite3 conn = sqlite3.connect('recipes.db') c = conn.cursor() c.execute(''' CREATE TABLE recipes ( id INTEGER PRIMARY KEY AUTOINCREMENT, title TEXT NOT NULL, ingredients TEXT NOT NULL, instructions TEXT NOT NULL ) ''') conn.commit() conn.close()Run this script once to create your database:bashCopy codepython create_db.py - Flask Application (
app.py):
pythonCopy codefrom flask import Flask, render_template, request, redirect import sqlite3 app = Flask(__name__) def get_db_connection(): conn = sqlite3.connect('recipes.db') conn.row_factory = sqlite3.Row return conn @app.route('/') def index(): conn = get_db_connection() recipes = conn.execute('SELECT * FROM recipes').fetchall() conn.close() return render_template('index.html', recipes=recipes) @app.route('/recipe/<int:recipe_id>') def recipe(recipe_id): conn = get_db_connection() recipe = conn.execute('SELECT * FROM recipes WHERE id = ?', (recipe_id,)).fetchone() conn.close() return render_template('recipe.html', recipe=recipe) @app.route('/submit', methods=('GET', 'POST')) def submit(): if request.method == 'POST': title = request.form['title'] ingredients = request.form['ingredients'] instructions = request.form['instructions'] conn = get_db_connection() conn.execute('INSERT INTO recipes (title, ingredients, instructions) VALUES (?, ?, ?)', (title, ingredients, instructions)) conn.commit() conn.close() return redirect('/') return render_template('submit.html') if __name__ == '__main__': app.run(debug=True)- HTML Templates:
templates/index.html:
htmlCopy code<!doctype html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Recipe Sharing Community</title> </head> <body> <h1>Recipe Sharing Community</h1> <a href="/submit">Submit a Recipe</a> <ul> {% for recipe in recipes %} <li><a href="/recipe/{{ recipe['id'] }}">{{ recipe['title'] }}</a></li> {% endfor %} </ul> </body> </html>templates/recipe.html:
<!doctype html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>{{ recipe['title'] }}</title> </head> <body> <h1>{{ recipe['title'] }}</h1> <h2>Ingredients</h2> <p>{{ recipe['ingredients'] }}</p> <h2>Instructions</h2> <p>{{ recipe['instructions'] }}</p> <a href="/">Back to Home</a> </body> </html>templates/submit.html:
<!doctype html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Submit a Recipe</title> </head> <body> <h1>Submit a Recipe</h1> <form method="post"> <label for="title">Title:</label> <input type="text" id="title" name="title" required> <label for="ingredients">Ingredients:</label> <textarea id="ingredients" name="ingredients" required></textarea> <label for="instructions">Instructions:</label> <textarea id="instructions" name="instructions" required></textarea> <button type="submit">Submit</button> </form> <a href="/">Back to Home</a> </body> </html>Running the Application
- Ensure your SQLite database is created with the
create_db.pyscript. - Run your Flask application:bashCopy code
python app.py - Open your web browser and navigate to
http://127.0.0.1:5000to access your recipe-sharing community!
Leave a Reply