Skip to content

Instantly share code, notes, and snippets.

@angelabauer
Created October 21, 2020 10:06
Show Gist options
  • Save angelabauer/df4ab0709c788cfdcf81a00316f4f018 to your computer and use it in GitHub Desktop.
Save angelabauer/df4ab0709c788cfdcf81a00316f4f018 to your computer and use it in GitHub Desktop.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<link href="https://fonts.googleapis.com/css2?family=Raleway" rel="stylesheet">
<link rel="stylesheet" href="static/css/styles.css">
</head>
<body>
<div class="wrapper">
<div class="top">
<div class="title"><h1>My Blog</h1></div>
</div>
{% for post in all_posts: %}
<div class="content">
<div class="card ">
<h2>{‌{ post.title }}</h2>
<p>{‌{ post.subtitle }}</p>
<a href="{‌{ url_for('show_post', index=post.id) }}">Read</a>
</div>
</div>
{% endfor %}
</div>
</body>
<footer>
<p>Made with ♥️ in London.</p>
</footer>
</html>
from flask import Flask, render_template
from post import Post
import requests
posts = requests.get("https://api.npoint.io/5abcca6f4e39b4955965").json()
post_objects = []
for post in posts:
post_obj = Post(post["id"], post["title"], post["subtitle"], post["body"])
post_objects.append(post_obj)
app = Flask(__name__)
@app.route('/')
def get_all_posts():
return render_template("index.html", all_posts=post_objects)
@app.route("/post/<int:index>")
def show_post(index):
requested_post = None
for blog_post in post_objects:
if blog_post.id == index:
requested_post = blog_post
return render_template("post.html", post=requested_post)
if __name__ == "__main__":
app.run(debug=True)
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<link href="https://fonts.googleapis.com/css2?family=Raleway" rel="stylesheet">
<link rel="stylesheet" href="static/css/styles.css">
</head>
<body>
<div class="wrapper">
<div class="top">
<div class="title"><h1>My Blog</h1></div>
</div>
<div class="content">
<div class="card">
<h1> {‌{ post.title }}</h1>
<h2> {‌{ post.subtitle }}</h2>
<p> {‌{ post.body }}</p>
</div>
</div>
</div>
</body>
<footer>
<p>Made with ♥️ in London.</p>
</footer>
</html>
class Post:
def __init__(self, post_id, title, subtitle, body):
self.id = post_id
self.title = title
self.subtitle = subtitle
self.body = body
@Ugotactics
Copy link

Ugotactics commented Aug 27, 2022

Here's a dummy json file you can work with. The keys were arranged in alphabetical order so feel free to edit and shorten it as you like..................................

[
{
"id":"1",
"body":"Ugo Humbert begins play in the round of 128 of the US Open versus Benjamin Bonzi, after being eliminated in the round of 32",
"title":"Ugo Humbert: US Open Betting Odds and Preview ",
"subtitle":"Ugo Humbert: US Open Betting Odds and Preview "
},

{
"id":"2",
"body":"In a match slated for Monday, Ugo Humbert (No. 143 in rankings) will face Benjamin Bonzi (No. 50) in the Round of 128 of the US Open. Bonzi is the favorite (-125) to get to the round of 64 against the underdog Humbert (-102). Tennis odds courtesy of Tipico Sportsbook. Odds updated Friday at 2:38 PM ET. For a full list of sports betting odds, access USA TODAY Sports Betting Scores Odds Hub. ",
"title":"US Open Preview: Benjamin Bonzi vs. Ugo Humbert Betting Odds.,
"subtitle":"In a match slated for Monday, Ugo Humbert (No. 143 in rankings) will face Benjamin Bonzi (No. 50) in the Round of 128"
},

{
"id":"3",
"body":"Defensive back Ugo Amadi said the Tennessee Titans want him playing nickelback. Amadi, a Nashville native and John Overton High School graduate, had his first practice with the Titans Thursday, the last day of training camp. He’s expected to play in Saturday’s preseason game against the Arizona Cardinals.",
"title":"How Ugo Amadi sees role with Tennessee Titans, other last training camp practice takeaways ",
"subtitle":"Defensive back Ugo Amadi said the Tennessee Titans want him playing nickelback. "
}
]

@Hogbunike
Copy link

can someone please provide the static/styles.css folder....

@Hashirrazzaq256
Copy link

is anyone having issues with show_post function? the requested_post element is not sending data to post.html hence my posts are not displaying .CSS is displaying tho

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment