ProjectX proof of concept finished

in #utopian-io9 years ago

I've reached the first milestone for my new project: make a simple but good looking website and show blockchain content. Yesterday I got to the complete redesign of the first concept but two final pieces were still missing:

  • show a preview of the text
  • show the full article

The second objective I knew from the start would require some work and I decided for myself to postpone that by bypassing it. The body is stored in markdown on the blockchain and showing it on a website requires to convert it to html. This can be daunting, just look at the several issues steemit is having with it and think of the different user interfaces that allow adding content to the steem blockchain, all with their different subtleties. There are some libraries available and I will look into it but I have other priorities for this project. The bypass: simply offer the user to view the content on one of the major interfaces, that is add a button to refer them to steemit.com or busy.org.

The first requirement, a preview of the text, was something necessary. I figured it wouldn't be too hard. Just take the markdown do some regex magic and the result should be ok-ish. As always with regex I have to think of this quote by Jamie Zawinski:

Some people, when confronted with a problem, think "I know, I'll use regular expressions." Now they have two problems.

I have a love-hate relationship with regular expressions. Their power amazes me everytime but I hate the pain and frustration they have brought on me on more occasions that I would like. Luckily by now I have suffered enough to know a bit and together with some help from google and regex 101 I get to the result after some fiddling. This time it was not different. To make the frustration a bit bigger I needed several regular expressions. To remove html tags, remove image references and change links.

The preview output is not perfect but satisfying. I also had some struggle to limit the text to four lines and end with an ellipsis (three dots) but that struggle was more related to my own stupidity. Sometimes it's hard to find the simplest errors. This is what I have been looking at for too long. The ellipsis was there but then the text just continued.
Capture.PNG

So a bit of a struggle with these last steps but the end result is a satisfying proof of concept where I have everything I need to get started.

This is the current state:
Capture2.PNG

Anyone interested in helping out is welcome. All help and feedback is appreciated! Let me know what you think.

The code is available on GitHub under ProjectX



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 @jefpatat I am @utopian-io. I have just upvoted you at 10% Power!

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

Coin Marketplace

STEEM 0.04
TRX 0.32
JST 0.077
BTC 63918.14
ETH 1660.03
USDT 1.00
SBD 0.42