Skip to content

Instantly share code, notes, and snippets.

@TheMuellenator

TheMuellenator/index.html

Forked from angelabauer/index.html
Last active May 10, 2024 12:08
Show Gist options
  • Star 8 You must be signed in to star a gist
  • Fork 30 You must be signed in to fork a gist
  • Save TheMuellenator/7c6a08a3df3b94a28d1a867628481910 to your computer and use it in GitHub Desktop.
Save TheMuellenator/7c6a08a3df3b94a28d1a867628481910 to your computer and use it in GitHub Desktop.
Download ZIP
Raw
index.html
<!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>
Raw
main.py
from flask import Flask, render_template
from post import Post
import requests
posts = requests.get("https://api.npoint.io/c790b4d5cab58020d391").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)
Raw
post.html
<!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>
Raw
post.py
class Post:
def __init__(self, post_id, title, subtitle, body):
self.id = post_id
self.title = title
self.subtitle = subtitle
self.body = body
@DocEnd
Copy link

DocEnd commented Mar 7, 2023

post.py

import requests

blog_get_url = "https://api.npoint.io/c790b4d5cab58020d391"

class Post:
    def __init__(self):
        self.all_posts_json = requests.get(blog_get_url).json()

    def get_title(self, nr_of_blog):
        return self.all_posts_json[nr_of_blog]["title"]

    def get_subtitle(self, nr_of_blog):
        return self.all_posts_json[nr_of_blog]["subtitle"]

    def get_body(self, nr_of_blog):
        return self.all_posts_json[nr_of_blog]["body"]

main.py

from flask import Flask, render_template
from post import Post

app = Flask(__name__)

post = Post()

@app.route('/')
def home():
    return render_template("index.html", posts=post.all_posts_json)

@app.route('/post/<int:nr_of_post>')
def post_show(nr_of_post):
    return render_template("post.html", post_title=post.get_title(nr_of_post),
                           post_subtitle=post.get_subtitle(nr_of_post),
                           post_body=post.get_body(nr_of_post))


if __name__ == "__main__":
    app.run(debug=True)

index.html

<!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 each_post in posts:%}
        <div class="content">
            <div class="card">
                <h2>{{each_post["title"]}}</h2>
                <p class="text">{{each_post["subtitle"]}} </p>
                <a href="{{url_for('post_show', nr_of_post=each_post['id']-1)}}">Read</a>
            </div>
        </div>
    {%endfor%}

</div>
</body>
<footer>
    <p>Made with ♥️ in London.</p>
</footer>
</html>

post.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>The Post</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>

@lavanya-nagaraj
Copy link

main.py

from flask import Flask, render_template
import requests

app = Flask(name)

@app.route('/blog')
def home():
res = requests.get('https://api.npoint.io/c790b4d5cab58020d391')
blogs = res.json()
return render_template("index.html", posts=blogs)

@app.route('/post/int:num')
def get_posts(num):
res = requests.get('https://api.npoint.io/c790b4d5cab58020d391')
blogs = res.json()
return render_template('post.html', posts=blogs, n=num)

if name == "main":
app.run(debug=True)

templates/index.html

<title>Title</title>

My Blog

{% for p in posts: %}

{{p['title']}}

{{p['subtitle']}}

Read
{% endfor %}

Made with ♥️ in London.

post.html

<title>Title</title>

My Blog

{% for p in posts: %} {% if p['id'] == n : %}

{{ p['title'] }}

{{p['subtitle']}}

{{p['body']}}

{% endif %} {% endfor %}

Made with ♥️ in London.

@margoh96
Copy link

margoh96 commented Mar 22, 2023 •
edited

https://gist.github.com/TheMuellenator/7c6a08a3df3b94a28d1a867628481910?permalink_comment_id=4067793#gistcomment-4067793>

Thanks, i did it earlier and still get stuck. until i say your post and needed to call the post by index 0.

didnt think of that. and why is that? since there is only 1 value, why must we need to call by index ?

@Tinashe123
Copy link

`from flask import Flask, render_template
import requests

app = Flask(name)

@app.route("/post/int:num")
def show_post(num):
blog_url = "https://api.npoint.io/a51100e2465836518b71"
blog_response = requests.get(url=blog_url)
blog_posts = blog_response.json()
for blog_post in blog_posts:
if blog_post['id'] == int(num):
post = blog_post
return render_template("post.html", post=post)

@app.route('/')
def home():
blog_url = "https://api.npoint.io/a51100e2465836518b71"
blog_response = requests.get(url=blog_url)
blog_posts = blog_response.json()
return render_template("index.html", blogs=blog_posts)

if name == "main":
app.run(debug=True)
`

`

<title>Title</title>

My Blog

    <div class="content">
        <div class="card">
            <h2>{{post['title']}}</h2>
            <h2>{{post['subtitle']}}</h2>

            <p>{{post['body']}}</p>
        </div>
</div>

Made with ♥️ in London.

`

`

<title>Title</title>

My Blog

{%for blog in blogs:%} 
            <h2>{{blog['title']}}</h2>
            <p class="text">{{blog['subtitle']}} </p>
            <a href="{{url_for('show_post', num=blog['id'])}}">Read</a>
        
    </div>
</div>
{% endfor %}

Made with ♥️ in London.

`

@dtsagg
Copy link

dtsagg commented May 7, 2023

it seems that nobody used the post.py class

@dtsagg
Copy link

dtsagg commented May 7, 2023

main.py

import requests
from flask import Flask, render_template

app = Flask(__name__)


@app.route('/')
def home():
    URL = "https://api.npoint.io/ff92afaab9a74c6246f9"
    response = requests.get(URL)
    data = response.json()

    return render_template("index.html", data=data)


@app.route('/post/<int:get_id>')
def post(get_id):
    URL = "https://api.npoint.io/ff92afaab9a74c6246f9"
    response = requests.get(URL)
    data = response.json()
    show_data = []
    for id_data in data:
        if id_data["id"] == get_id:
            show_data.append(id_data)
        else:
            pass

    return render_template("post.html", show_data=show_data)


if __name__ == "__main__":
    app.run(debug=True)

index.html

<!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">
        {% for get_data in data %}
        <div class="card">
            <h2>{{ get_data["title"] }}</h2>
            <p class="text">{{ get_data["subtitle"] }} </p>
            <a href="{{ url_for('post', get_id=get_data['id']) }}">Read</a>
        </div>
        {% endfor %}
    </div>

</div>
</body>
<footer>
    <p>Made with ♥️ in London.</p>
</footer>
</html>

post.html

<!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>{{ show_data[0]["title"] }}</h1>
                <h2>{{ show_data[0]["subtitle"] }}</h2>
                <p>{{ show_data[0]["body"] }}</p>
            </div>

    </div>
</div>
</body>
<footer>
    <p>Made with ♥️ in London.</p>
</footer>
</html>

@MegKM
Copy link

MegKM commented May 18, 2023

I wasn't sure what the use of the post.py class was either:

post.html:

<div class="wrapper">
    <div class="top">
        <div class="title">
                {% set blog_num = (num - 1) %}
            <h1>{{ posts[blog_num]["title"] }}</h1>
                <p>page number: {{num}}</p>
        </div>
    </div>
        <div class="content">
            <div class="card">
                    <h2>{{ posts[blog_num]["title"] }}</h2>
                    <p>{{ posts[blog_num]["body"] }}</p>
            </div>
        </div>
</div>

relevant function in main.py:

@app.route('/blog/<int:num>')
def blog(num):
    blog_yrl = "https://api.npoint.io/c790b4d5cab58020d391"
    response = requests.get(blog_yrl)
    all_posts = response.json()
    print(num)

    return render_template("post.html", posts=all_posts, num=num, blog_num=0)

@MichaelOgunjimi
Copy link

My Solution almost identical to Angela's solution

#main.py

from flask import Flask, render_template
from post import Post
import requests

app = Flask(__name__)
response = requests.get('https://api.npoint.io/f79ef654f38310ae777a')
all_posts = response.json()


@app.route('/')
def home():
    return render_template("index.html", blog_posts=all_posts)


@app.route('/post/<int:post_id>')
def post(post_id):
    post_details = Post(title=all_posts[post_id - 1]['title'], subtitle=all_posts[post_id - 1]['subtitle'],
                        body=all_posts[post_id - 1]['body'])
    return render_template("post.html", post=post_details)


if __name__ == "__main__":
    app.run(debug=True)

#index.html

<!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 blog_posts %}

    <div class="content">
        <div class="card">
            <h2>{{ post.title }}</h2>
            <p class="text">{{ post.subtitle }} </p>
            <a href={{ url_for('post', post_id=post.id) }}>Read</a>
        </div>
    </div>
    {% endfor %}
</div>
</body>
<footer>
    <p>Made with ♥️ in London.</p>
</footer>
</html>

#post.py

class Post:
    def __init__(self, title, subtitle, body, id=None):
        self.title = title
        self.subtitle = subtitle
        self.body = body

#post.html

<!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">
                <h2>{{ post.title }}</h2>
                <p>{{ post.body }}</p>
            </div>
        </div>
    </div>
</body>
<footer>
    <p>Made with ♥️ in London.</p>
</footer>
</html>

@NiRo-jr
Copy link

NiRo-jr commented Jun 5, 2023

Hello everyone,
Here is my solution, I don't use classes.

main.py

from flask import Flask, render_template
import requests


app = Flask(__name__)

@app.route('/')
def home():
    url_blog = "https://api.npoint.io/c790b4d5cab58020d391"
    blog_response = requests.get(url=url_blog)
    all_posts = blog_response.json()
    return render_template("index.html", posts=all_posts)

@app.route('/post/<int:id_no>')
def blog_posts(id_no):
    url_blog = "https://api.npoint.io/c790b4d5cab58020d391"
    blog_response = requests.get(url=url_blog)
    all_posts = blog_response.json()[id_no]
    return render_template("post.html", posts=all_posts, blog_id=id_no)


if __name__ == "__main__":
    app.run(debug=True)

index.html

<!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 blog_posts in posts %}
        <div class="content">
            <div class="card">
                <h2>{{blog_posts["title"]}}</h2>
                <p class="text">{{blog_posts["subtitle"]}} </p>
                <a href="post\{{blog_posts['id']-1}}">Read</a>
            </div>
        </div>
    {% endfor %}
</div>
</body>
<footer>
    <p>Made with ♥️ in London.</p>
</footer>
</html>

post.html

<!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">
                <h2>{{posts["title"]}}</h2>
                <p>{{posts["subtitle"]}}</p>
                <p>{{posts["body"]}}</p>
            </div>

    </div>
</div>
</body>
<footer>
    <p>Made with ♥️ in London.</p>
</footer>
</html>

@Nikesh24dotk
Copy link

Here is my Solution. Please leave any comments or suggestions to improve my skills. Thanks.

main.py

from flask import Flask, render_template
from post import Post

post_d = Post()

app = Flask(name)

@app.route('/')
def home():
return render_template("homepage.html")

@app.route('/blog')
def all_blogs():
return render_template("index.html", blog_id = post_d.id, blog_title=post_d.title, blog_subtitle = post_d.subtitle, length=len(post_d.id))

@app.route('/blog/')
def full_post(num):
return render_template("posts.html", blog_id=int(num), blog_body=post_d.body, blog_title=post_d.title, blog_subtitle = post_d.subtitle, length=len(post_d.id))

if name == "main":
app.run(debug=True)

post.py

import requests

class Post:
def init(self):
self.id = []
self.title = []
self.subtitle = []
self.body = []
blog_response = requests.get(url="https://api.npoint.io/f45dc77976c248d5f60f")
data = blog_response.json()
for post in data:
self.id.append(post["id"])
self.title.append(post["title"])
self.subtitle.append(post["subtitle"])
self.body.append(post["body"])
# return self.id, self.title, self.subtitle, self.body

index.html

<title>My BLog Site</title>

My Blog

<div class="content">
    {% for i in range(length) %}
        <div class="card">
            <h2>{{blog_title[i]}}</h2>
            <p class="text">{{blog_subtitle[i]}}</p>
            <a href="blog/{{blog_id[i]}}">Full Post</a>
        </div>
    {% endfor %}
</div>

Made with ♥️ in London.

posts.html

import requests

class Post:
def init(self):
self.id = []
self.title = []
self.subtitle = []
self.body = []
blog_response = requests.get(url="https://api.npoint.io/f45dc77976c248d5f60f")
data = blog_response.json()
for post in data:
self.id.append(post["id"])
self.title.append(post["title"])
self.subtitle.append(post["subtitle"])
self.body.append(post["body"])
# return self.id, self.title, self.subtitle, self.body

@eghelbur
Copy link

eghelbur commented Jul 7, 2023

Here is my Solution:

main.py

`from flask import Flask, render_template
import requests

app = Flask(__name__)

@app.route('/')
def home():
    blog_url = "https://api.npoint.io/c790b4d5cab58020d391"
    response = requests.get(blog_url)
    all_posts = response.json()
    print(all_posts)
    return render_template("index.html", posts=all_posts)

@app.route('/post/<int:blog_id>')
def show_post(blog_id):
    blog_url = "https://api.npoint.io/c790b4d5cab58020d391"
    response = requests.get(blog_url)
    all_posts = response.json()
    blog_post = all_posts[blog_id - 1]
    return render_template("post.html", posts=blog_post)

if __name__ == "__main__":
    app.run(debug=True)
`

post.py

class Post:
    def __init__(self, title, subtitle, body):
        self.title = title
        self.subtitle = subtitle
        self.body = body

index.html

<!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">
        {% for blog_post in posts %}
        {% if blog_post["id"] == 1 %}
    <div class="card">
        <h2>{{ blog_post["title"] }}</h2>
        <p class="text">{{ blog_post["subtitle"] }}</p>
         <a class="read" href="/post/{{ blog_post['id'] }}">Read</a>
        </div>
        {% endif %}
    {% endfor %}
</div>
    </div>
    <div class="content">
        {% for blog_post in posts %}
        {% if blog_post["id"] == 2 %}
        <div class="card">
            <h2>{{ blog_post["title"] }}</h2>
            <p class="text">{{ blog_post["subtitle"] }}</p>
            <a class="read" href="/post/{{ blog_post['id'] }}">Read</a>
        </div>
        {% endif %}
        {% endfor %}
    </div>
</div>
</body>
<footer>
    <p>Made with ♥️ in Seville.</p>
</footer>
</html>

post.html

<!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">
                <h2>{{ posts["title"] }}</h2>
                <p>{{ posts["body"] }}</p>
            </div>
    </div>
</div>
</body>
<footer>
    <p>Made with ♥️ in Seville.</p>
</footer>
</html>

@soumyagautam
Copy link

The challenge can be completed without including the Post class instance:

main.py

import requests
from flask import Flask, render_template

app = Flask(__name__)
blogs = requests.get("https://api.npoint.io/c790b4d5cab58020d391").json()


@app.route('/')
def home():
    return render_template("index.html", blogs=blogs)


@app.route("/post/<num>")
def invl_blog(num):
    num = int(num)

    if num == 1:
        blog_title = blogs[0]["title"]
        blog_subtitle = blogs[0]["subtitle"]
        blog_body = blogs[0]["body"]
    elif num == 2:
        blog_title = blogs[1]["title"]
        blog_subtitle = blogs[1]["subtitle"]
        blog_body = blogs[1]["body"]
    else:
        blog_title = blogs[2]["title"]
        blog_subtitle = blogs[2]["subtitle"]
        blog_body = blogs[2]["body"]
    return render_template("post.html", blog_title=blog_title, blog_subtitle=blog_subtitle, blog_body=blog_body)


if __name__ == "__main__":
    app.run(debug=True)

index.html

<!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">
            <h2>{{ blogs[0]["title"] }}</h2>
            <p class="text">{{ blogs[0]["subtitle"] }}</p>
            <a href="{{ url_for('invl_blog', num=1) }}">Read</a>
        </div>
    </div>
    <div class="content">
        <div class="card">
            <h2>{{ blogs[1]["title"] }}</h2>
            <p class="text">{{ blogs[1]["subtitle"] }}</p>
            <a href="{{ url_for('invl_blog', num=2) }}">Read</a>
        </div>
    </div>
    <div class="content">
        <div class="card">
            <h2>{{ blogs[2]["title"] }}</h2>
            <p class="text">{{ blogs[2]["subtitle"] }}</p>
            <a href="{{ url_for('invl_blog', num=3) }}">Read</a>
        </div>
    </div>
</div>
</body>
<footer>
    <p>© Blog Website, 2023</p>
</footer>
</html>

post.html

<!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>{{ blog_title }}</h1>
                    <h2>{{ blog_subtitle }}</h2>
                    <p>{{ blog_body }}</p>
                </div>
            </div>
        </div>
    </body>
    <footer>
        <p>© Blog Website, 2023</p>
    </footer>
</html>

@Freedempire
Copy link 

from datetime import datetime

from flask import Flask, render_template
from markupsafe import escape
import requests

from post import Post

genderize_endpoint = 'https://api.genderize.io'
agify_endpoint = 'https://api.agify.io'
blog_fake_endpoint = 'https://api.npoint.io/c790b4d5cab58020d391'

def guess_gender(name):
    params = {
        'name': name
    }
    response = requests.get(genderize_endpoint, params)
    response.raise_for_status()
    return response.json()['gender']

def guess_age(name):
    params = {
        'name': name
    }
    response = requests.get(agify_endpoint, params)
    response.raise_for_status()
    return response.json()['age']


app = Flask(__name__)

@app.route('/')
def home():
    year = datetime.now().year
    return render_template('dynamic_copyright_year.html', year=year)

@app.route('/guess/<name>')
def guess(name):
    name = escape(name)
    gender = guess_gender(name)
    age = guess_age(name)
    return render_template('guess_gender_age.html', name=name, gender=gender, age=age)

@app.route('/blog')
@app.route('/blog/<int:id>')
def blog(id=None):
    response = requests.get(blog_fake_endpoint)
    response.raise_for_status()
    posts = []
    for post_dict in response.json():
        posts.append(Post(**post_dict)) # ** for dictionary unpacking
    print(posts)
    if id:
        return render_template('post.html', post=posts[id - 1])
    return render_template('blog.html', posts=posts)


if __name__ == '__main__':
    app.run(debug=True)

@anonberry
Copy link

main.py

# Importing required libraries
from flask import Flask, render_template
import requests

# Initializing the Flask app
app = Flask(__name__)

# API endpoint for the blog data
blog_url = "https://api.npoint.io/fd95eb762b80ce502a4f"

# Fetching the blog data from the API
response = requests.get(blog_url)
all_posts = response.json()

# Home route to display all blog posts
@app.route('/')
def home():
    return render_template("index.html", posts=all_posts)

# Route to display a specific blog post by its ID
@app.route('/post/<int:num>')
def get_blog(num):
    return render_template("post.html", posts=all_posts, id=num)

# Running the Flask app in debug mode
if __name__ == "__main__":
    app.run(debug=True)

@anonberry
Copy link

index.html

<!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 blog_post in posts: %}
        <div class="content">
            <div class="card">
                <h2>{{ blog_post["title"] }}</h2>
                <p class="text">{{ blog_post["subtitle"] }} </p>
                <a href="{{url_for('get_blog', num=blog_post['id'])}}">Read</a>
            </div>
        </div>
    {% endfor %}
</div>
</body>
<footer>
    <p>Made with ♥️ in Nigeria.</p>
</footer>
</html>

@anonberry
Copy link

post.html

<!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 blog_post in posts: %}
        {% if id == blog_post["id"]: %}
            <div class="content">
                <div class="card">
                    <h2>{{ blog_post["title"] }}</h2>
                    <h1>{{ blog_post["subtitle"] }}</h1>
                    <p>{{ blog_post["body"] }}</p>
                </div>
            </div>
        {% endif %}
    {% endfor %}
</div>
</body>
<footer>
    <p>Made with ♥️ in Nigeria.</p>
</footer>
</html>

@anonberry
Copy link

I completed the challenge without including the Post class instance </> ☝️

@Storka72
Copy link

Storka72 commented Aug 7, 2023 •
edited

i am having an issue where when i click on "Read", it is going to the post/1 or post/2 page, which is formatted, but none of the content (title or body) is appearing, and am pulling my hair out. Can anybody see where my issues are?:

MAIN.PY:

from flask import Flask, render_template
import requests

app = Flask(__name__)

blog_posts = requests.get("https://api.npoint.io/4370451396b51eb95e0a").json()

@app.route('/')
def home():
    return render_template("index.html", posts=blog_posts)


@app.route("/post/<int:num>")
def get_post(num):
    return render_template("post.html", post=blog_posts, ID=num)



if __name__ == "__main__":
    app.run()

INDEX.HTML:

<!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 posts: %}
    <div class="content">
        <div class="card">
            <h2>{{ post['title'] }}</h2>
            <p class="text">{{ post['subtitle'] }}</p>
        
            <a href="{{ url_for('get_post', num=post['id']) }}">Read</a>
 
                
        </div>
    </div>
    {% endfor %}

</div>
</body>
<footer>
   
</footer>
</html>

POST.HTML:

<!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 posts %}
                {% if post["id"] == ID %}  
                    <div class="content">
                         <div class="card">
                  
                            <h2>{{post["title"]}}</h2>
                            <p>{{post["body"]}}</p>
                        </div>
                    </div>
                {% endif %}
            {% endfor %}

</div>
</body>
<footer>
    
</footer>
</html>

@SadSack963
Copy link

@Storka72
In your post route your have: return render_template("post.html", post=blog_posts, ID=num)
In your post.html you have: {% for post in posts %}, but you are not passing a "posts" parameter to that page!

@inavadeep1205
Copy link

NEAT Code Without any Torchers and If statements and EASY to Understand

from flask import Flask, render_template
import requests

api_endpoint = "https://api.npoint.io/c790b4d5cab58020d391"

api = requests.get(api_endpoint)
api_json_data = api.json()

app = Flask(__name__)

@app.route("/")
def flask_1():
    return render_template("index.html", json_data=api_json_data)

@app.route("/read/<num>")
def flask_2(num):
    num = int(num) - 1
    return render_template("post.html", json_data=api_json_data, id_num=num)

if __name__ == "__main__":
    app.run(debug=True)

#Index.HTML code

<!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 x in json_data: %}
    <div class="content">
        <div class="card">
                <h2> {{x["title"]}} </h2>
                <h3> {{x["subtitle"] }}</h3>
                <a href="{{url_for('flask_2', num=x['id'])}}">Read</a>
        </div>
    </div>
    {% endfor %}
</div>
</body>
<footer>
    <p>Made with ♥️ in London.</p>
</footer>
</html>

#Post.HTML

<!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>{{json_data[id_num]["title"]}}</h1>
                <h2>{{json_data[id_num]["body"]}}</h2>
            </div>
    </div>
</div>
</body>
<footer>
    <p>Made with ♥ in London.</p>
</footer>
</html>

@Randypz23
Copy link

Using index to get the post item

I think its more accurrate

#main.py

class Post:
def init(self, id, title, subtitle, body):
self.id = id - 1
self.title = title
self.subtitle = subtitle
self.body = body

#Post.html

<!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>The Fake Blog</h1></div>
           </div>
        <div class="content">
            <div class="card">
                <h2>{{posts[num].title}}</h2>
                <h3>{{posts[num].subtitle}}</h3>
                <p>{{posts[num].body}}</p>
            </div>

    </div>
</div>
</body>
<footer>
    <p>Made with ♥️ in Mexico.</p>
</footer>
</html>

@imsiddharth812
Copy link

imsiddharth812 commented Aug 25, 2023 •
edited

main.py

`from flask import Flask, render_template
from post import Post


app = Flask(__name__)

@app.route('/')
def home():
    posts = Post()
    all_blogs = posts.get_post()
    return render_template("index.html", posts=all_blogs)

@app.route("/post/<int:number>")
def get_blog(number):
    posts = Post()
    all_blogs = posts.get_post()
    return render_template("post.html", posts=all_blogs, num=number)

if __name__ == "__main__":
    app.run(debug=True)`

index.html

<!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">
            <h2>{{ posts[0]["title"] }}</h2>
            <p class="text">{{ posts[0]["subtitle"] }} </p>
            <a href="{{ url_for('get_blog', number=1) }}">Read</a>
        </div>
    </div>
    <div class="content">
        <div class="card">
            <h2>{{ posts[1]["title"] }}</h2>
            <p class="text">{{ posts[1]["subtitle"] }} </p>
            <a href="{{ url_for('get_blog', number=2) }}">Read</a>
        </div>
    </div>
</div>
</body>
<footer>
    <p>Made with ♥️ in India.</p>
</footer>
</html>

Post.py

import requests

BLOG_URL = "https://api.npoint.io/c10781c59f247ee64d13"

class Post:
    def get_post(self, index=None):
        response = requests.get(BLOG_URL)
        all_posts = response.json()
        if index is not None:
            return [all_posts[index]]
        return all_posts

Post.html

<!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>{{ posts[num-1]["title"] }}</h1>
                <h2>{{ posts[num-1]["subtitle"] }}</h2>
                <p>{{ posts[num-1]["body"] }}</p>
            </div>

    </div>
</div>
</body>
<footer>
    <p>Made with ♥️ in India.</p>
</footer>
</html>

@Akhinh
Copy link

Akhinh commented Sep 9, 2023

it is way easier without introducing the post.py Class.

from flask import Flask, render_template
import requests

response = requests.get("https://api.npoint.io/c790b4d5cab58020d391")
info = response.json()
all_blogs = []
for blog in info:
all_blogs.append(blog)

app = Flask(name)

@app.route('/')
def home():
return render_template("index.html", blogs=all_blogs)

@app.route('/post/int:index')
def the_blog(index):
requested_post = None
for blogs in all_blogs:
if blogs["id"] == index:
requested_post = blogs
print(requested_post)
return render_template("post.html", post=requested_post)

if name == "main":
app.run(debug=True)

@itsabhi672
Copy link

I have completed this task without writing anything in post.py file.
Here are my files,

main.py
import requests
from flask import Flask, render_template

app = Flask(name)

@app.route('/blog')
def home():
blog_url = 'https://api.npoint.io/c790b4d5cab58020d391'
r = requests.get(blog_url)
blogs = r.json()
return render_template("index.html", blogs=blogs)

@app.route("/post/int:id")
def blog_post(id):
blog_url = 'https://api.npoint.io/c790b4d5cab58020d391'
r = requests.get(blog_url)
blog = r.json()
return render_template('post.html', id=id, blog=blog)

if name == "main":
app.run(debug=True)

index.html

<title>Title</title>

My Blog

{% for blog in blogs %}

{{ blog["title"] }}

{{ blog["subtitle"] }}

Read
{% endfor %}

Made with ♥️ in London.

post.html

<title>Title</title>

My Blog

{{ blog[id-1]["title"] }}

{{ blog[id-1]["body"] }}

</div>

Made with ♥️ in London.

@DevOmni
Copy link

DevOmni commented Oct 19, 2023

I think for sake of this project making a class of Post was not necessary instead I used a python list and in html with jinja I was able to use it as python list

@pedsf1968
Copy link

  • post.py
import requests
from pprint import pprint
N_P0INT_API = "https://api.npoint.io/c790b4d5cab58020d391"


class Post:
    def __init__(self):
        response = requests.get(url=N_P0INT_API)
        self.data = response.json()

    def display(self):
        """Display data content"""
        pprint(self.data)

    def get_all(self):
        """Return all posts"""
        return self.data

    def get_by_id(self, post_id):
        """Return only one post by ID
        post_id : the ID of the post tou fetch
        """
        for post in self.data:
            if int(post_id) == post['id']:
                return post
  • main.py
from flask import Flask, render_template
from post import Post

post = ""
app = Flask(__name__)


@app.route('/')
def blog_endpoint():
    return render_template("index.html", all_posts=post.get_all())


@app.route('/post/<post_id>')
def post_endpoint(post_id):
    return render_template("post.html", post=post.get_by_id(post_id=post_id))


if __name__ == "__main__":
    post = Post()
    app.run(debug=True)
  • index.html
<!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 class="text">{{ post['subtitle'] }}</p>
                <a href="{{ url_for('post_endpoint', post_id=post['id'] )}}">Read</a>
            </div>
        </div>
    {% endfor %}
</div>
</body>
<footer>
    <p>Made with ♥️ in Seoul.</p>
</footer>
</html>
  • post.html
<!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 Seoul.</p>
</footer>
</html>

@mskomek
Copy link

mskomek commented Feb 12, 2024 •
edited

index.html

<!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">
            <h2>Just a blog post</h2>
            <p class="text">Lorem ipsum dolor sit </p>
            <a href="/post/1">Read</a>
        </div>
    </div>
    <div class="content">
        <div class="card">
            <h2>Another blog post</h2>
            <p class="text">Lorem ipsum dolor sit </p>
            <a href="/post/2">Read</a>
        </div>
    </div>
</div>
</body>
<footer>
    <p>Made with ♥️ in London.</p>
</footer>
</html>

post.html

<!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">
                <h2>{{dict[number-1]["title"]}}</h2>
                <p>{{dict[number-1]["body"]}}</p>
            </div>

    </div>
</div>
</body>
<footer>
    <p>Made with ♥️ in London.</p>
</footer>
</html>

main.py

from flask import Flask, render_template
import requests


app = Flask(__name__)

@app.route('/')
def home():
    return render_template("index.html")

@app.route('/post/<int:number>')
def post(number):
    response = requests.get("https://api.npoint.io/7bdc6259ad459120c0cb")
    return render_template("post.html", number=number, dict=response.json())

if __name__ == "__main__":
    app.run(debug=True)

post.py

class Post:
    pass

@samkalu22
Copy link

main.py
from flask import Flask, render_template
import requests
requests=requests
blog_URL='https://api.npoint.io/c790b4d5cab58020d391'

app = Flask(name)

@app.route('/')
def home():
all_post=requests.get(url=blog_URL).json()
return render_template("index.html",posts=all_post)

@app.route('/post/int:id')
def get_post(id):
all_post = requests.get(url=blog_URL).json()
return render_template("post.html", posts=all_post,id=id)

if name == "main":
app.run(debug=True)

index.html

<title>Title</title>

My Blog

{% for post in posts: %}

{{post["title"]}}

{{post["subtitle"]}}

Read
{% endfor %}

Made with ♥️ in London.

post.html

<title>Title</title>

My Blog

{% for post in posts: %} {%if post["id"]==id %}

{{post["title"]}}

{{post["body"]}}

{% endif %} {% endfor %} 
</div>

Made with ♥️ in London.

@guitarlass
Copy link

guitarlass commented Mar 24, 2024 •
edited

main.py

from flask import Flask, render_template
from post import Post

app = Flask(__name__)


@app.route('/')
def home():
    blogs = Post()
    return render_template("index.html", posts=blogs.posts)


@app.route('/post/<int:id>')
def get_post(id):
    blogs = Post()
    post = blogs.get_post(id)
    return render_template("post.html", title=post['title'], body=post['body'])


if __name__ == "__main__":
    app.run(debug=True)

post.py

import requests

class Post:
    def __init__(self):
        blog_url = "https://api.npoint.io/c790b4d5cab58020d391"
        req = requests.get(blog_url)
        all_posts = req.json()
        self.posts = all_posts

    def get_post(self, id):
        for post in self.posts:
            if post['id'] == id:
                return post

index.html

{% for post in posts: %}
    <div class="content">
        <div class="card">
            <h2>{{ post['title'] }}</h2>
            <p class="text">{{ post['subtitle'] }}</p>
            <a href="{{ url_for('get_post', id=post['id'])}}">Read</a>
        </div>
    </div>
{% endfor %}

post.html

<div class="content">
      <div class="card">
          <h2>{{ title }}</h2>
          <p>{{ body }}</p>
      </div>
</div>

@stevenson007
Copy link

main.py

from flask import Flask, render_template
from post import Post

app = Flask(__name__)


@app.route('/')
def home():
    blogs = Post()
    return render_template("index.html", posts=blogs.posts)


@app.route('/post/<int:id>')
def get_post(id):
    blogs = Post()
    post = blogs.get_post(id)
    return render_template("post.html", title=post['title'], body=post['body'])


if __name__ == "__main__":
    app.run(debug=True)

post.py

import requests

class Post:
    def __init__(self):
        blog_url = "https://api.npoint.io/c790b4d5cab58020d391"
        req = requests.get(blog_url)
        all_posts = req.json()
        self.posts = all_posts

    def get_post(self, id):
        for post in self.posts:
            if post['id'] == id:
                return post

index.html

{% for post in posts: %}
    <div class="content">
        <div class="card">
            <h2>{{ post['title'] }}</h2>
            <p class="text">{{ post['subtitle'] }}</p>
            <a href="{{ url_for('get_post', id=post['id'])}}">Read</a>
        </div>
    </div>
{% endfor %}

post.html

<div class="content">
      <div class="card">
          <h2>{{ title }}</h2>
          <p>{{ body }}</p>
      </div>
</div>

This is exactly what I was trying to do.

Thanks. Nice Algorithm

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