Kolony.org is a new Hive front-end built for speed and designed to run on all platforms. It can be installed on mobile devices as an app or used in a browser. In addition, it can talk to either HiveAuth or HiveKeychain to sign in.
Since publishing my last post, Kolony.org has seen some improvements. I wanted to share some details about the recent changes, why, and how they were done. And talk about what is coming next.
Added a refresh button to the random page
The random page shows you a random, recently-published blog post. Before, the only way to advance to a new, randomly-selected post was to refresh the page. The refresh button makes this action more convenient and quicker.
Replaced default PWA icons with the Kolony logo.
Previously, the "install app" menu in Chrome browser and Brave showed the wrong logo image. This fix took a long time to figure out. The nuxt-PWA nodeJS package was caching old images inside its folder, and the web host was caching the node_modules folder in production. So I had to set an environment variable for the host to stop caching the environment.
Bundle size reduced by 250KB by eliminating unneeded font-awesome icons.
Shrinking the bundle size makes the site load much faster. Win-win! The default behavior was to load 100% of the icons. I had to change nuxt.config.js to tell the framework which icons are needed explicitly.
Add image rendering for blog posts.
It made no sense to have a section for the photography community and not display the photos in the posts. Therefore, posts will show their images now. However, they come from 3rd party image servers and take much longer to load compared to text from the posts.
There is still some funkiness with image sizing for some posts. In some cases, images overflow their parent CSS containers. I'll tweak this later.
Fixed identification of VIMM posts
VIMM posts weren't being identified correctly because the URL routing is different compared to other Hive front-ends. This has been semi-fixed. There is still some weirdness for "going live" VIMM posts.
Corrected labeling and linking for posts published via the Exxp WordPress plug-in.
In some cases, Exxp provides a canonical URL in the post metadata. When present, Kolony will use the canonical URL to link back to the original WordPress site. In other cases, Kolony has to fall back to linking to hive.blog because the canonical URL is missing.
Added Social media content preview cards.
When you share links on Twitter, Discord, etc., previously, you would get a dull, generic content preview. Now, you will get a rich card with a preview of the blog text. And if an image is attached to the post, the first image will appear in the content preview card.
Added kolony.org links to POSH tracking (thanks, @rishi556)
Because content previews were implemented, it became viable to use Kolony.org with the HivePOSH system. This should now be working, such that if you have registered your Twitter handle with HivePOSH and you tweet a link to Kolony.org Hive content, Poshbot should pick it up.
Added another name to the bot list—24 and counting.
Kolony.org maintains a list of bot accounts that are hidden from discussion threads. This makes the discussion threads cleaner to read and easier to engage with.
Miscellaneous tweaks and fixes
Many tweaks have been made to formatting and caching to improve the quality of life for Kolony readers. Try it out!
Next
What is next in the Kolony dev backlog?
Upvotes
Kolony has an upvote button, but it is not currently wired up. I plan to add a vote-weight selection slider to the app, similar to PeakD. However, having upvotes without a slider is not viable since anyone above 500HP wants to choose the voting power.
PWA Navigation Bar
If you use Kolony in its app form, the experience is a little clunky because it does not have a back button as the browser does.
What I plan to do to solve this is add a navigation bar that appears in the app only when you are using the PWA.
There is a trick to doing this. The PWA has an option where the developer can specify an entry-point URL. You can append string parameters
To this URL like "start_url": "./?mode=standalone" and then put code in the app to behave differently when the mode=standalone param is present.
Posting From Kolony
Lower priority, I would like to add a Markdown editor to Kolony so that the app can be used to publish new posts.
In discussions with other devs, some ideas came up about using Ceramic accounts. And some ideas about how we could support posting links to Kolony for other users to discuss.
Smoothing HiveAuth Flow
Kolony's HiveAuth sign-in flow is functional. But the design is ugly and could use an overhaul. The menu flow could also be streamlined to make it easier for new users to understand.
Thanks for reading! Follow me for future dev updates.
Good to see that a new front end is coming to hive. Good job.
Interestingly, this is exactly the type of project I had in mind to do while learning to build on hive blockchain. But I just haven’t started. I have visited Kolony.org and seen how the project is coming to live gradually.
I’m a frontend dev with Nextjs and Tailwindcss as my stack. I just can’t wait to begin contributing to hive related code bases.
It is definitely a learning journey. I have enjoyed building with VueJS and NuxtJS for this project.
TailwindCSS looks very powerful but I haven’t tried using it, yet.
Wow. I really wish I can contribute to Kolony.org but I haven’t learned/used vuejs.
I wasn't aware of this project, so I'm glad you shared the update in THE TERMINAL Discord! ⭐️
Thanks for checking it out!
If we find a bug, or have suggestions, should we report here or on Discord?
Discord, please. I’m sure there are lots of bugs.
When people start reporting bugs I will be very happy, as it means people are using the site. :)
How to share on Twitter? Just copy&paste the link?
Copy&paste the link will work
Retweet the @poshtoken bot post above
? where above?
I mean that I can share the post from Kolony.org directly to Twitter, but there's no link/icon/whatever for sharing...
Thanks for the feature suggestion. I’ll add sharing buttons to my list.
I shared Hivefest Amsterdam after movie post but later noticed that the video doesn't play on Kolony ...
Thanks. Another user already requested support for video embeds.
btw: I also don't see a #poshtoken reply in the comments ...
~~~ embed:1594767853508562958 twitter metadata:OTQ5Nzk5ODYxMzIyNDY5Mzc3fHxodHRwczovL3R3aXR0ZXIuY29tLzk0OTc5OTg2MTMyMjQ2OTM3Ny9zdGF0dXMvMTU5NDc2Nzg1MzUwODU2Mjk1OHw= ~~~
The rewards earned on this comment will go directly to the people( @seckorama, @enjar ) sharing the post on Twitter as long as they are registered with @poshtoken. Sign up at https://hiveposh.com.
We need a hive front end that looks exactly like reddit