Code Monkey home page Code Monkey logo

scrolly-hub's Introduction

Scrolly Hub

Scrolly Hub is a web3 app based on the Iggy framework. It uses Orbis SDK and Ceramic Network in the background. For usernames it uses Scrolly Domains.

Link: https://hub.scrolly.xyz/

.env

Create a .env file from .env.example.

Make sure to also enter these vars in your hosting settings!

Hosting

We recommend to use Netlify for hosting the site. Netlify allows you to easily deploy the site from this repo (or from a fork of this repository).

Make sure to use the the npm run generate command instead of npm run build for build instructions on Netlify.

If you want to use optional features such as GIFs and image upload, make sure to enter proper environment variables (see .env.example).

Make sure to also select the proper serverless functions services in your environment variables, for example:

FILE_UPLOAD_SERVICE=vercel
LINK_PREVIEW_SERVICE=vercel

You can also set these in the Nuxt config file (nuxt.config.ts).

GIFs (Tenor)

If you want to have GIF search implemented, create your own Tenor API Key on Google Cloud Console. Follow the instructions here: https://developers.google.com/tenor/guides/quickstart#setup.

Then enter the key in environment variables (TENOR_KEY).

Image upload (Spheron/IPFS)

To support image uploads on IPFS please create a key/token on Spheron Storage: https://app.spheron.network/#/storage

Then create a bucket on Spheron (you'll create it by manually uploading an image on Spheron).

Finally, add this key (and your bucket ID/name) to your environment variables:

SPHERON_BUCKET_NAME=
SPHERON_STORAGE_TOKEN=

Image uploads via Spheron work only if you have Vercel background functions enabled (see api/imageUploader.js).

Image upload fallback

It is recommended to use ImageKit as the fallback option, in case Spheron has technical issues.

For this to work, create an account at ImageKit.io and add these environment variables to your project:

IMAGEKIT_ENDPOINT=
IMAGEKIT_PUBLIC_KEY=
IMAGEKIT_PRIVATE_KEY=

Customize

  • Project-specific settings in nuxt.config.ts
  • CSS files in the /public/css/ folder
  • Favicon and cover/preview images in /public/img/ folder

Setup

Make sure to install the dependencies:

# yarn
yarn install

# npm
npm install

# pnpm
pnpm install --shamefully-hoist

Development Server

Start the development server on http://localhost:3000

npm run dev

Or run Netlify dev server on http://localhost:8888 (to get link previews):

netlify dev

Production

Build the application for production:

npm run generate

Locally preview production build:

npm run preview

Checkout the deployment documentation for more information.

Testing

Orbis test group:

https://app.orbis.club/group/kjzl6cwe1jw145e1i1agcrjp9375sjpyyk7imu281koehrpve0pr46lvr5e9xco

scrolly-hub's People

Contributors

tempe-techie avatar ange1ocaduto avatar scrollyxyz avatar

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.