Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/JennaEverard/SkyBlogBuilder

A user-friendly interface for designing and deploying blog posts on Skynet with the option to use a personal Handshake domain.
https://github.com/JennaEverard/SkyBlogBuilder

blogging handshake namebase skynet

Last synced: 2 months ago
JSON representation

A user-friendly interface for designing and deploying blog posts on Skynet with the option to use a personal Handshake domain.

Awesome Lists containing this project

README 

        
# SkyBlog Builder

> A user-friendly interface for designing and deploying blog posts on Skynet with instructions for using Namebase to publish under a personal Handshake domain. This application can also be found in the [Skynet Appstore](https://skynethub.io/_B3VrECGOHPEAFknVQwj_vWsyaX_8iIRuB_TL09cuj9uZQ/index.html#/apps/all)!

## About

* SkyBlog Builder is a Skynet application built for the [Own The Internet Hackathon](https://gitcoin.co/hackathon/own-the-internet/onboard) hosted by [Sia](https://siasky.net/) and [Namebase](https://www.namebase.io/) where it was [selected as a Finalist and won a Judges Choice Award!](https://siasky.net/NACHEsIAD7O39VGGNjX35CLewHumJWP_VAGHpdI2dLim7w)

* Watch the live demo [here](https://www.youtube.com/watch?v=x1s-KGPlcJc) (timestamp: 46:00 - 53:50)

* The application contains HTML, CSS, and Node.js code and was built using the module bundler [webpack](https://webpack.js.org/).

## Latest Updates

* 24/08/2020: SkyBlog Builder now uses css-loader version **4.2.2**

## Contributors

* @JennaEverard

## Demo Video

[https://siasky.net/AAAi-aQzOML4gV0-VANunT0VDOGBwljEzCyFPpH31DinuQ](https://siasky.net/AAAi-aQzOML4gV0-VANunT0VDOGBwljEzCyFPpH31DinuQ)

## Example Blog Post from Demo Video

[https://siasky.net/hns/concentrativemovementtherapy/](https://siasky.net/hns/concentrativemovementtherapy/)

## How to Access

The deployed application can be accessed and used with the following link:

* [https://siasky.net/DADAgjHeqGnQ1hIEET54YyIZhBN_oz51HMogZsLiS60KTA](https://siasky.net/DADAgjHeqGnQ1hIEET54YyIZhBN_oz51HMogZsLiS60KTA)

## How to Use

#### When the application first loads, the home page (pictured below) will be displayed. There will be a short introduction paragraph followed by two arrows, which will act as navigation buttons throughout the entire application.

![Image of Home Page](/READMEimages/Image1.PNG)

#### On the second screen, the application will provide further guidance on the user requirements. If a user wants to publish their blog post with a Handshake domain, they will need to follow the step(s).

![Image of Home Page](/READMEimages/Image2.PNG)

#### The third page is where the user builds their blog post. They are presented with a series of options and corresponding text boxes where they can indicate colors and various content items.

![Image of Home Page](/READMEimages/Image3.PNG)

#### At the bottom of this third page, the user can see a preview of their blog post and a button for generating the blog post once they are done.

![Image of Home Page](/READMEimages/Image4.PNG)

#### Upon clicking the 'Generate Blog Post' button, a popup window will appear with their Skylink that allows them to access and share their blog post.

![Image of Home Page](/READMEimages/Image5.PNG)

#### The fourth and final page is where users have the option of tying their blog post to their Handshake domain. A series of steps are provided and the exact input for the DNS record they must add to their domain is provided based on the previously generated Skylink. A user can also type their handshake name into the input box which allows the application to provide them with their newly customized link to their blog post (that will work as soon as their DNS record changes sync!)

![Image of Home Page](/READMEimages/Image6.PNG)

## License

All code involved in this application is licensed under the MIT license