Steemconnect - Node-js - Boilerplate For Rapid Development v.0.2.0

in #utopian-io6 years ago (edited)

header

This project is a boilerplate for rapid development on top of the Steem network. Ready to go Express.js app using Steemconnect SDK & Steem.js. The aim is to have the ground work inplace so you can go from idea to MVP in record time.

I have a number of project Ideas I’m building. The tools available to developers are great, Steem-js, Steemconnect SDK, steemSQL and to name a few. Even with the set of tools available knowing how to get started and figuring out how to set everything up can be a challenge. To make it a faster onramp for those that come after me I’ve created the steem-connect-node-boilerplate.

While I don’t want there to be endless copies of Dmania created, there’s something to be said for not re-inventing the wheel.

This first update to the boilerplate brings a number of new features I’ve learn and implemented into https://finallycomments.com & https://photofeed.club. Hopefully you will find this useful. Styling is kept to an absolute bare minimum, to reduce the number of assumptions made.

Previous features

  • Authentication with SteemConnect
  • Get logged in User Profile
  • Get Content Feed
  • Create Top-Level Post
  • Upvote Top Level Post

New to Boilerplate v0.2.0

  • Trending/Created Feeds
  • Individual Post Pages
  • Comment threads
  • All user profiles on /@username
  • Update logged in user profile page
  • Vote from single page
  • Comment from single page

Trending/Latest feeds - I’ve changed the implementation of feeds from previously using getState() to usingGetyDiscussionsBy() this allows for the ability to easily get more posts than the first 20. You can call the getMoreContent() function via a button or implement infinite scroll to pull in another set of feed posts. commit

Individual Post Pages - Now using the standard URL structure of /category/@author/permlink it’s possible to get a single page of content. All feeds automatically link the feed items out to single pages. commit

Comment threads - Comments for individual posts are now included at the bottom of the post content. A post hierarchy is included to easily see comment depth (replies). Basic CSS controls the indentation and can be removed or modified. commit

All user profiles on /@username - Visit a user profile page to view information such as followers, following, account value, steem power. Also includes a feed of the users latest posts. commit

Update logged in user profile page - The logged in user profile now on /dashboard/ has the ‘my blog’ feed showing posts from the users the logged in user is following. commit

Vote & Comment on individual posts - Now possible to add comments to the post as well as upvoting individual posts from the single pages. commit coommit

Technology

  • Steemcomment v2 SDK - Handels user authentication with the steem blockchain allowing posting, commenting and voting for the logged-in user.

-Express js - Lightweight Node.js framework to handle routing, sessions, views, database or any other backend services you could need.

  • Steem.js - Handels retrieving data from the Steem Blockchain. Get’s feeds, post and user information for the pages requested.

  • Showdown JS - A javascript markdown library sued to render the markdown from posts as html.

The boilerplate is kept simple to reduce the technical knowledge needed to get started. I often find ‘boilerplates’ expand so much that they become opinionated frameworks and defeat the point of themselves. Functions and or pages may need to be expected to meet your needs this is intended to be a starting point.

How to Use

You can view setup/install instructions on the Github readme

Contributions & Requests

The initial version of this project had some great feedback. I welcome more ideas, suggestions and of course contributions are always awesome.

Question: Do you think I should fully implement a css framework or leave that for the end user to decide on/implement?

Let me know what you think ✌️



Posted on Utopian.io - Rewarding Open Source Contributors

Sort:  

Thank you for the contribution. It has been approved.

You can contact us on Discord.
[utopian-moderator]

Hey @vladimir-simovic, I just gave you a tip for your hard work on moderation. Upvote this comment to support the utopian moderators and increase your future rewards!

Thanks again for another review.

This is very useful, thanks! It'll be much easier to incorporate with steemconnect in my projects with your examples. Also, I appreciate the pointers to some excellent resources in your post, notably steemSQL.

Personal thought on CSS implementation. For me, as a developer, I only want enough design in a boilerplate so that neither ugly nor beautiful results disrupt my (fragile) concentration :) That means I usually end up dropping in a very simple CSS that no designer would ever let me run with 😃 So having a CSS in a boiler plate that I'm looking to for function over form is an extra thing I have to tweak.

Just a personal preference tho and if there's a lot of momentum in the other direction it's not going to ruin your great contribution for me. Thanks, again!

Nice. Many thanks, Sam.

Do you think I should fully implement a css framework or leave that for the end user to decide on/implement?
I think you should!

Hey @sambillingham I am @utopian-io. I have just upvoted you!

Achievements

  • You have less than 500 followers. Just gave you a gift to help you succeed!
  • Seems like you contribute quite often. AMAZING!

Community-Driven Witness!

I am the first and only Steem Community-Driven Witness. Participate on Discord. Lets GROW TOGETHER!

mooncryption-utopian-witness-gif

Up-vote this comment to grow my power and help Open Source contributions like this one. Want to chat? Join me on Discord https://discord.gg/Pc8HG9x

Seriously, thanks a lot for this.

One question, does the steemconnect boilerplate work with the testnet? If not, could you share a bit of your development workflow?

No worries, glad I can create things people find useful.

Re: testnet. I've never actually used the test net. Steem.js (used in the boilerplate to retrieve data) can switch to the test net with a single call to steem.api.setOptions(). As for Steemconnect SDK, I've just had a quick look and I can't see any information about using it with the test net. Personally, I just make live calls from a test account but that's certainly not perfect.

This is a Gem. 1000 thanks.

This is a really good and useful project. Thanks Man

This is a such a gift to the community. I have ideas I want to build on the blockchain and now I have a starting point. Thank you!

No worries you're totally welcome. Glad I can make something people find interesting.

Gracias por informarnos amigo, saludos :D

Seems like a very nice work.

I'm relatively new to Steemit so if you don't mind, could you please explain if this project will directly affect Steemit.com site and not other third party site like Busy.org?

Also, Dtube is very slow when it comes to uploading and watching videos. I guess it comes down to cloud hosting usage and efficiency (if it is indeed already using cloud).

Dont work wen i'm try to connect :s Error: Failed to lookup view "user" in views directory "/home/server/steemconnect/views"

GET /dashboard 500 91.736 ms - 2038

Hey, Thanks for trying the boilerplate. I've just submitted a fix. I had forgotten to change the default view on the latest update it is now called 'dashboard'. /routes/index.js line7 change user to dashboard and routes/user.js line 13 user to dashboard or you can download the latest from Github. Let me know if you have any other issues getting setup.

I started playing with the boilerplate. To answer your question at the end of the article, I’d like a css framework included.

I understand your reasons for not including more than basic styles. I’m going to continue to work with it and I’m sure I’ll learn a lot in the process.