Development Update #4: Write New Post, Trending Posts and Upvote Post

DVUBanner-template.jpg

Repository

https://github.com/jrawsthorne/review.app

New Features

#1 Write new post 1 2

Once a user is logged in they can now write a new post and it will be broadcast to the blockchain. It will also be indexed in the database.

On the new post page a preview is shown which live updates with what the post will look like. It supports HTML tags and markdown.

image.png

This is the data that is added to the JSON metadata of the post. The id and type are used by the backend to determine what images to show and what show or movie the post is associated with.

carbon (4).png

When a user adds a new post the author and permlink are sent to the backend API. Here the post is retrieved from the Steemit API and the JSON metadata that was added above is parsed.

carbon (5).png

Once the post has been added to the blockchain and database the user is redirected to the new post they just wrote.

carbon (6).png

#2 Trending, hot and active posts with infinite load 1 2 3

The home page now has a selector for the sorting (trending, hot, created, active) and filter (movies, shows, episodes, all).

image.png

The main thing that had to be changed was the API. It had to accept the last post that had loaded so it could only search for more posts after that. If the feed is sorted by date the API queries the database directly. The front end sends the creation date of the latest loaded post. The API then searches for all posts matching the criteria created on or before that date and removes the first one as it's the post that was sent to the API and is already loaded on the front end.

carbon (8).png

If the sort is by trending, for example, the Steemit API has to be queried. It accepts a start_permlink and start_author. This is sent by the front end and added directly to the API call. Again the first post is removed as it's already loaded on the front end.

carbon (9).png

#3 Upvote a post

If a user is logged in they can now upvote a post from a feed or post page directly. If a post is already upvoted, clicking the upvote button will remove the upvote.

image.png

Voting for a post is really easy using the SteemConnect API as can be seen below. Once a new vote has been made the post is fetched again from the steemit API to get the updated information.

carbon (10).png

Roadmap

  • Comments
  • Follow users
  • Re-brand with dmtv name, logo and colours
H2
H3
H4
3 columns
2 columns
1 column
4 Comments