SkyPages

SkyPages allows anyone to easily upload static webpages to Skynet through our intuitive user interface.

Comment

Inspiration

When our team was first deciding what to do for this hackathon, we wanted to explore all of the different technologies made available by the sponsors for this conference. After reading over the description for the Sia challenge, and checking out the API on Siasky, it was evident that Skynet, and the overall Sia distributed storage system, provides an extremely powerful way to get your files stored in a secure, decentralized manner. However, despite the power of the network, it seemed extremely difficult to use it for one of the most common use cases, which was to publish files in a way that they would be usable from a web browser. Thus, SkyPages was born, in order to make it possible to use the extremely powerful Sia network to convert an existing website to a decentralized web resource in a quick, comprehensive, and efficient manner, with a high-quality user experience.

What it does

SkyPages allows anyone to easily upload static webpages to Skynet through our intuitive user interface. Users can upload a .zip file of their website or link their GitHub pages site to SkyPages, which then processes the website files and uploads them to Skynet. SkyPages displays the Sia links to the user upon upload completion, confirming the successful upload of their website to the decentralized network.

How we built it

Initially, we planned on building our application with a Vue/Quasar frontend, and a Python backend to handle the actual upload process. However, very quickly on, we decided we wanted our application to represent the principles of the websites it was attempting to decentralize, and this meant that it needed to be light, UI/UX focused, and without a backend. Thus, we switched our focus to using Bootstrap and a few modules in the frontend, and a “backend” that was simply a series of Javascript functions called by the user interface.

We divided the overall process into four tasks: Frontend, Git Pages Scraper, Zip -> Skynet backend, and Chrome extension. From there, it was easy to divide up the work, with me (Ian) taking on the frontend and pages scraper, Sebastian handling the backend, and Kevin heading up the extension/demonstration sites. This allowed for a fun blend of work, as while we all picked tasks that played to our strengths, the uniqueness of having to write the application entirely in browser-side Javascript allowed us to experiment with new libraries and development techniques that we wouldn’t have had the opportunity to try if we had stuck with the standard, REST-style application.

Challenges we ran into

We faced difficulty as new chrome extension developers in getting the chrome extension to use Cross-Origin Resource Sharing (CORS) as it attempts to fetch webpages. To solve this problem, we created a basic API for our web app that allows the chrome extension to pass in the current tab’s URL to the webapp.

Accomplishments that we're proud of

The final test for our webapp, was being able to “dogfood” the final project. By our definition of success, SkyPages would only be a finished product if it was able to convert itself to a decentralized web app. Given that we designed SkyPages as a single-file webapp with external resources, which was the exact type of website that our tool was meant to be able to put on Skynet, it seemed only reasonable that the true test of our coding would be whether or not SkyPages could upload itself. As evidenced by our Skylink to the demo, SkyPages passed the test with flying colors, requiring no changes in either the webapp code or manual intervention in order to convert the entire webapp to a fully function, decentralized, web service.

What we learned

We learned that creating an intuitive user interface in the front end is critical to expanding blockchain technology, such as the Sia network. Without simple, easy-to-use interfaces, people will not adopt blockchain since the requirements for entry will be too time-consuming and difficult. We think that this aspect of our project - enabling easy website upload to the Sia network - is what makes it stand out. Many blockchains face the issue of ease of access for inexperienced users and projects like SkyPages demonstrate simple ways to fix this issue.

What's next for SkyPages

SkyPages has a lot of potential moving forward. Combining this tool with a blockchain DNS resolver such as Namebase will allow for fully decentralized websites. Moving forward, SkyPages could be improved by supporting more than just static websites. Additionally, adding a feature to SkyPages that allows users to manage their website Sia links would make the process of maintaining a website on the Sia network very easy.

SkyPages Whitepaper: https://docs.google.com/document/d/1MtcojvxXACNVX7Myc5_M40FdZG3gkjZBZLMcXhht5jU/edit?usp=sharing

Built With

Share this project:

Updates