Welcome to the Treehouse Community
Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.
Looking to learn something new?
Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.
Start your free trial
Joseph Yhu
PHP Development Techdegree Graduate 48,637 PointsFull Stack Foundations Track Final Project Help (PROJECT COMPLETED)
Update: I've completed the project.
I'm currently working on the Full Stack Foundation Track's final project: https://teamtreehouse.com/library/full-stack-foundations-final-project
I believe I've completed the first two steps, but I'm not sure how to do the last two. https://github.com/josephyhu/Full-Stack-Foundations-Blog
First, I don't know how to get the '/' route to redirect to index.html. I've currently set it to redirect to api/v1/posts since redirecting it to index.html didn't work.
from flask import Flask
from flask_cors import CORS
import models
from resources.posts import posts_api
import config
app = Flask(__name__)
app.register_blueprint(posts_api)
CORS(app, resources={r'/*': {'origins': '*'}})
@app.route('/')
def hello_world():
return 'Hello world'
if __name__ == '__main__':
models.initialize()
app.run(debug=config.DEBUG, host=config.HOST, port=config.PORT)
Updated the code since the redirect is no longer needed.
2 Answers
Joseph Yhu
PHP Development Techdegree Graduate 48,637 PointsThanks for the reply!
The project page says to use Vue.js for the frontend. And I think I figured out why it wasn't working. I wasn't supposed to go to localhost:8000; I was supposed to click the index.html file from my project folder.
Now I have a problem with fetching the json data. The status is 200, but when I console log the response, I don't see any of the data. Here's my app.js file.
new Vue({
el: '#app',
data: {
title: 'Full Stack Foundations Blog'
}
});
fetch('http://localhost:8000/api/v1/posts')
.then(res => {
res.json()
console.log(res)
})
And, I don't know if I have to use Blueprint. I just used it because it was used in the flask rest api course from Treehouse that I took before doing this project.
Chris Freeman
Treehouse Moderator 68,441 PointsSorry, not up on Vue usage. Might be best to repost this question as a new post with a JavaScript tag
Joseph Yhu
PHP Development Techdegree Graduate 48,637 PointsI got my home page working! Now I have to figure out how to get individual posts working... Here's my main.js file:
new Vue({
el: '#app',
data: {
title: 'Full Stack Foundations Blog'
}
});
new Vue({
el: '#posts',
data: {
posts: ''
},
mounted() {
fetch('http://localhost:8000/api/v1/posts')
.then(response => response.json())
.then(data => this.posts = data.posts)
}
});
Joseph Yhu
PHP Development Techdegree Graduate 48,637 PointsI was able to redirect the user to a specific post page when the user clicks the post's title. However I'm having trouble fetching the post itself.
Edit: I got the individual posts working. Now I have to figure out how to add/edit/delete posts.
Chris Freeman
Treehouse Moderator 68,441 PointsChris Freeman
Treehouse Moderator 68,441 PointsDo you need to use the blueprint? How about:
Post back if you need more help. Good luck!!!