Travel Planning App

Written by

in

Step 1: Setting Up Your Environment

Install Flask: Make sure you have Python installed. You can install Flask using pip:bashCopy codepip install Flask
Create a Project Directory:bashCopy codemkdir travel_planner cd travel_planner
Create Required Files:
- app.py (Flask app)
- templates/ (folder for HTML files)
- static/ (folder for CSS/JS files)

Step 2: Create the Flask App

`app.py`

pythonCopy codefrom flask import Flask, render_template, request, redirect, url_for

app = Flask(__name__)

# Simple in-memory storage for itineraries
itineraries = []

@app.route('/')
def home():
return render_template('index.html', itineraries=itineraries)
@app.route('/add', methods=['POST'])
def add_itinerary():
destination = request.form.get('destination')
date = request.form.get('date')
activities = request.form.get('activities')
itineraries.append({'destination': destination, 'date': date, 'activities': activities.split(',')})
return redirect(url_for('home'))
@app.route('/delete/<int:index>')
def delete_itinerary(index):
if 0 &lt;= index &lt; len(itineraries):
    itineraries.pop(index)
return redirect(url_for('home'))
if __name__ == '__main__':
app.run(debug=True)

Step 3: Create HTML Templates

`templates/index.html`

htmlCopy code<!DOCTYPE html>
<html lang="en">
<head>
&lt;meta charset="UTF-8"&gt;
&lt;meta name="viewport" content="width=device-width, initial-scale=1.0"&gt;
&lt;link rel="stylesheet" href="{{ url_for('static', filename='styles.css') }}"&gt;
&lt;title&gt;Travel Planner&lt;/title&gt;</head>
<body>
&lt;h1&gt;Travel Planner&lt;/h1&gt;
&lt;form action="/add" method="POST"&gt;
    &lt;input type="text" name="destination" placeholder="Destination" required&gt;
    &lt;input type="date" name="date" required&gt;
    &lt;input type="text" name="activities" placeholder="Activities (comma-separated)" required&gt;
    &lt;button type="submit"&gt;Add Itinerary&lt;/button&gt;
&lt;/form&gt;

&lt;h2&gt;Your Itineraries&lt;/h2&gt;
&lt;ul&gt;
    {% for itinerary in itineraries %}
        &lt;li&gt;
            &lt;strong&gt;{{ itinerary.destination }}&lt;/strong&gt; - {{ itinerary.date }}&lt;br&gt;
            Activities: {{ ', '.join(itinerary.activities) }} 
            &lt;a href="{{ url_for('delete_itinerary', index=loop.index0) }}"&gt;Delete&lt;/a&gt;
        &lt;/li&gt;
    {% endfor %}
&lt;/ul&gt;</body>
</html>

Step 4: Add Some Styles

`static/styles.css`

cssCopy codebody {
font-family: Arial, sans-serif;
margin: 20px;}

h1 {
color: #333;}

form {
margin-bottom: 20px;}

input {
margin: 5px;}

Step 5: Run the App

Navigate to your project directory in the terminal and run:

bashCopy codepython app.py

Open your web browser and go to http://127.0.0.1:5000 to see your travel planning app in action!

Comments

Leave a Reply Cancel reply

More posts