wieerwill/HackerNewsFullstack
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity
This project is a custom build to show a working implementation of FLASK with VUE.js
2 Commits 1 Branch 0 Tags 144 KiB
Vue 55.2%
Python 16%
JavaScript 12.4%
CSS 12.2%
HTML 4.2%
master
Go to file
Robert Jeutter b8085ee62b initial commit
2022-04-01 17:03:49 +02:00
frontend initial commit 2022-04-01 17:03:49 +02:00
templates initial commit 2022-04-01 17:03:49 +02:00
app.py initial commit 2022-04-01 17:03:49 +02:00
LICENSE Initial commit 2022-04-01 16:55:01 +02:00
README.md initial commit 2022-04-01 17:03:49 +02:00
requirements.txt initial commit 2022-04-01 17:03:49 +02:00

README.md

HackerNews Fullstack

This project is a custom build to show a working implementation of FLASK with VUE.js

Goals

Backend

  • Use the unofficial Hackernews REST API to fetch news: https://github.com/HackerNews/API (Only use the API, not a library)
  • Implement a single REST endpoint using Python (e.g. with Flask) which returns an improved representation of the API response
  • Provide a query parameter to select a story category
  • Provide a query parameter to limit the story count

Frontend

  • Create a VUE.js project using the VUE cli
  • Build a Master-Detail view which uses your Python API endpoint using VUE.js

How it works

The server is seperated into Front- and Backend. The Frontend will be shown to the user and present everything as a Single-Page-Application. The inital call of the webpage will get the bundled frontend into the clients browser. The Backend provides all vital data, like post overviews and rankings, and can communicate with the Frontend.

Develping and Running

  1. Setup a virtual environment python3 -m venv venv
  2. activate your virtual environment source venv/bin/activate
  3. Run pip3 install -r requirements
  4. Run export FLASK_APP=wsgi:app
  5. Run flask run

To deactivate your virtual environment run deactivate in your Terminal.

Build the Frontend

In order to rebuild the web app (Vue)

  1. Navigate to the frontend folder
  2. Run yarn install
  3. while developing yarn dev
  4. to build for deployment yarn build

About HackerNews

HackerNews got a public API at https://hacker-news.firebaseio.com for getting their

  • Items (/v0/item/<id>) like
    • Stories
    • Comments
    • Jobs
    • Polls and Pollopts
  • Users (/v0/user/<username>)
  • and spezial live Data
    • current largest item id (/v0/maxitem)
    • top stories (/v0/topstories) (also contains jobs)
    • new stories (/v0/newstories)
    • best stories (/v0/beststories)
    • ask stories (/v0/askstories)
    • show stories(/v0/showstories)
    • job stories (/v0/jobstories)
    • changed items and profiles (/v0/updates)

links and resources