Git Product home page Git Product logo

ipfs-user-settings's Introduction

IPFS-backed Portable User Settings

License Maintainability Built by FISSION Discord

A front end application to demonstrate portable user settings through IPFS. Change your preferences once and take them with you wherever you go.

Check out the live demo and our forum post for a more in-depth walkthrough.

Screenshot

Get started

  • Install dependencies: npm i
  • Dev mode: npm run start
  • Prod build: npm run build
  • Deploy to Github pages: npm run deploy
    • Before deploying, change homepage in package.json to the url you will deploy to (ie: $YOUR_USERNAME.github.io/ipfs-user-settings).

Environment

REACT_APP_DEFAULT_CID = QmUWWqCNSdZmus7mc52um5cpqUi1CaE97AzBTY7iWfBXV9
REACT_APP_BOOTSTRAP_NODE_TCP = /ip4/3.215.160.238/tcp/4001/ipfs/QmVLEz2SxoNiFnuyLpbXsH6SvjPTrHNMU88vCQZyhgBzgw
REACT_APP_BOOTSTRAP_NODE_WSS = /dns4/ipfs.runfission.com/tcp/4003/wss/ipfs/QmVLEz2SxoNiFnuyLpbXsH6SvjPTrHNMU88vCQZyhgBzgw
REACT_APP_INTERPLANETARY_FISSION_URL = https://runfission.com
REACT_APP_INTERPLANETARY_FISSION_USERNAME = ADD_USERNAME_HERE
REACT_APP_INTERPLANETARY_FISSION_PASSWORD = ADD_PASSWORD_HERE

REACT_APP_DEFAULT_CID: the cid that contains the default settings that you want a new user to see. You can set it to the above value for our recommended defaults (or leave it blank and it will default to that).

REACT_APP_BOOTSTRAP_NODE_TCP: the multiaddr of the ipfs node that you would like the user's node to connect to through tcp (for instance with a local daemon through ipfs companion). You can set it to the above value to connect to the IPFS node that Fission hosts (or leave it blank and it will default to that).

REACT_APP_BOOTSTRAP_NODE_WSS: the multiaddr of the ipfs node that you would like the user's node to connect to through wss (if the user does not have an ipfs-enabled browser and falls back to an in-browser js-ipfs daemon). You can set it to the above value to connect to the IPFS node that Fission hosts (or leave it blank and it will default to that). Note: if you use a custom node, it must be interoperable with js-ipfs. This means that it either needs to connect via WebRTC or Secured Websockets (notice the wss in the above multiaddr).

REACT_APP_INTERPLANETARY_FISSION_...: the last three variables are your provisioned account information for using the Fission web-api. These are used for pinning content to the Fission IPFS node so that content will stay online even after a user goes offline. If you leave them blank, the webapp will not pin user content. At the moment, these can be obtained by joining the Fission Heroku add-on alpha.

ipfs-user-settings's People

Contributors

dholms avatar patdryburgh avatar expede avatar dependabot[bot] avatar

Stargazers

Tuan Duc Tran avatar Gyuri Lajos avatar dzmitry-lahoda avatar Josh Purcell avatar Boris Mann avatar  avatar

Watchers

Boris Mann avatar James Cloos avatar  avatar  avatar

Forkers

dholms

ipfs-user-settings's Issues

Break out `getIPFS` into own package

I can see us (and others) wanting to detect native IPFS support, and fallback to js-ipfs otherwise. The code in getIpfs.js seems to work well. It may be a good idea to break it into its own package and publish to NPM under the fission-suite org.

Unable to access CID outside of browsers

Summary

Problem

I am unable to reuse the CID anywhere other than in the browser.

Impact

A premise of this demo app is that the settings data is portable to other machines, websites, and so on.

Analysis

I'm guessing that the browser-local js-ipfs isn't getting bootstrapped with any of the common gateways.

Solution

Attempt bootstrapping the broswer js-ipfs to well-known, active peer hubs, thereby announcing its presence as a place to look for files. Pinning a file to hostless.dev may also work in a less general case, but if it can't find the CID, that isn't going to work.

Detail

Describe the bug

Webpage CIDs unable to be found on gateways

To Reproduce

Steps to reproduce the behavior:

  1. Open the application
  2. Fill out some settings
  3. Press the Save button
  4. Copy the new CID at the top of the page
  5. Navigate to ipfs.io/ipfs/<copied CID>
  6. [Gateway times out]

Expected behavior

  1. Gateway returns the JSON file describing your settings

Screenshots
If applicable, add screenshots to help explain your problem.

Desktop (please complete the following information):

  • OS: MacOS 10.14.6
  • Browser: Firefox Developer Edition
  • Version: 69.0b13

Best Practice Checklist

  • GitHub
    • Tags
    • Project Link (often a live demo)
  • README
    • Description
    • Quickstart
    • Image
    • Link to live demo
    • Link to NPM
    • Badges (NPM, CI, &c)
  • Checks
    • Set up on TravisCI
    • Set up on CodeClimate
  • Social
    • Blog post announcing project
    • Have @FISSIONcodes tweet about it

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.