Introducing Contest Hero [0.1.9]

Group 128@2x.png

Repository

https://github.com/tobias-g1/contest-hero

About Contest Hero

Contest Hero allows you to create, manage and enter contests on Steem. It's clear to see that there is a large number of users on the Steem blockchain who take part in and/or create contests regularly. Contests provide users the ability to get to know one another, shows their talents and overall provide value to the blockchain. Contest Hero was created to help provide users with more tools when creating and entering contests.

Currently, there has been one release of the site, within this release the following features have been created:

  1. Feed of contests
  2. Ability to create a contest
  3. Ability to set a deadline for a contest
  4. Ability to enter a contest
  5. Ability to view the relationship between entries and contests
  6. Ability to log in via SteemConnect
  7. Ability to vote on a contest
  8. Ability to view entry posts
  9. Ability to view comments related to post
  10. Ability to vote on comments related to post

All of the features mentioned above can be found with the following pull request:

https://github.com/tobias-g1/contest-hero/pull/36

Some of the features above can been seen in the following example contest:

https://www.contesthero.io/view-contest/tobias-g/example-contest-ch-b279d0c40

and an example entry:

https://www.contesthero.io/view-entry/tobias-g/example-entry-61252996481000000000

Here's a little more information about the features mentioned above shown in context.

Contest Feed

The contest feed shows all of the contests that have been created on Contest Hero, it's looking pretty bare at the moment...

image.png

View a contest

The view a contest page, this allows you to view a contest that has been created on Contest Hero, it shows the contest title, the contest body, the deadline of the contest, who made the contests, and a list of associated entries.

image.png

Create a contest

The create a contest page allows you to create a post in the form of a contest, it allows you to configure a contest title, deadline, contest type, contest body, and tags.

image.png

View an entry

The entry view page allows you to quickly view an entry to a contest that has been created on Contest Hero.

image.png

Technology Stack

The site purely client side and is built using Vue.js, some notable libraries include:

  • dSteem (mainly because there is an issue with steem.js when using the VueCli
  • Vue SteemConnect for easy integration of SteemConnect
  • Element UI as a general UI kit, I introduced this as I didn't want to style the forms or create the validation, I may swap this out for another kit or just use custom CSS throughout, but for now, it works. You will see that the majority of the CSS is from scratch anyway.

Roadmap

The following are a few things I've got planned for future releases. There are quite a few little pieces I would like to clean up, this includes both CSS and refactoring a few areas of code duplication

  1. Ability to select winners
  2. Ability to randomly select winners
  3. Ability to allow the community to vote for a winner
  4. Ability to edit a contest
  5. Ability to edit comments
  6. Enhanced Feed
  7. Image Upload
  8. User Profile & Wallet

How to contribute?

Whether you experienced with Vue.js or not feel free to get in touch if you like to contribute to Contest Hero, feel free to contact me via discord (tobias-g#123) or open an issue in the Contest Hero Repo for discussion. I will open this project up to bug hunters in a few more releases and will likely be looking to a few other categories for a few different task requests.

GitHub Account

A link to my GitHub account can be found below:

https://github.com/tobias-g1

H2
H3
H4
Upload from PC
Video gallery
3 columns
2 columns
1 column
29 Comments