Giter VIP home page Giter VIP logo

hub-starter-mint's Introduction

Holaplex Hub Starter

A template repository to help you build NFT based applications using the Holaplex Hub.

Includes:

  • NextJS 13 web framework (app directory enabled)
  • Postgres database management using Prisma ORM
  • User management with social based login through next-auth
  • Style application using Tailwind
  • Holaplex Hub SDK

Folder Structure

/prisma
  schema.prisma # prisma schema file
  /migrations # prisma auto-generated migration files
/src
 /app # next js app directory
  Home.tsx # customize your mint page here
  /login # social sign up or login
 /pages
   /api # next js api routes
    graphql.ts # apps graphql server
    /webhooks
      holaplex.ts # incoming webhooks from Holaplex
 /modules # utility clients and functions
   db.ts # prisma db client
   holaplex.ts # configured holaplex client
 /queries # holaplex and app api queries
 /mutations # holaplex and app api mutations
 tailwind.config.js # color theme

Google Authentication

In your exampleLocal.env and exampleRender.env you will need google auth credentials (ClientID and Secret). In Google Cloud Platform: Search for 'Api Credentials' -> create credentials for OAuth2.0.

Later when you generate your site using render and have the URL, you will need to add the following to your Oauth:

Local Machine Setup

Ensure you have nodejs and docker installed on your workstation. Refer to exampleLocal.env for the required variables.

# start postgres in a docker container
docker compose up -d

# install dependencies
npm install

# setup database
npm run db

# setup prisma client
npm run generate

# boot up the app
npm run dev

See your app at http://localhost:3000

Site Deployment Setup on Render

The starter is designed to be deployed to Render using their Infrastructure as Code (IaC) configuration file render.yaml. The IaC manifest will set up a web server for the mint page and a database for storing users, sessions, and wallets. Note: you must have a paid subscription to Render to deploy a Blueprint as described below.

On render.com navigate to the BluePrint Tab.

  • New Blueprint Instance
  • Connect your repo, define your Blueprint name and branch.
  • Refer to the exampleRender.env file for the environment variables required. Place them into the: Dashboard -> web-service -> Environment page
  • To generate the NEXTAUTH_SECRET environment variable, in Render: dashboard -> myWebService -> shell:
openssl rand -base64 32

Database

After deploying the environment, we need to seed the database. Run the following command in Render -> dashboard -> myWebService -> shell:

npm run db

hub-starter-mint's People

Contributors

kespinola avatar alchemistgo87 avatar brendan-wursta 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.