Skip to content

A reference implementation of a BigCommerce single-click app, in Node.JS + Next.js/React

License

Notifications You must be signed in to change notification settings

muuhoffman/sample-app-nodejs

 
 

Repository files navigation

NextJS Sample App

This demo includes all of the files necessary to get started with a basic, hello world app. This app was built using NextJS, BigDesign, Typescript, and React.

App Installation

Deploy

To get the app running locally, follow these instructions:

  1. Use Node 10+
  2. Install npm packages
    • npm install
  3. Add and start ngrok. Note: use port 3000 to match Next's server.
    • npm install ngrok
    • ngrok http 3000
  4. Register a draft app.
    • For steps 5-7, enter callbacks as 'https://{ngrok_id}.ngrok.io/api/{auth||load||uninstall}'.
    • Get ngrok_id from the terminal that's running ngrok http 3000.
    • e.g. auth callback: https://12345.ngrok.io/api/auth
  5. Copy .env-sample to .env.
    • If deploying on Heroku, skip .env setup. Instead, enter env variables in the Heroku App Dashboard under Settings -> Config Vars.
  6. Replace client_id and client_secret in .env (from View Client ID in the dev portal).
  7. Update AUTH_CALLBACK in .env with the ngrok_id from step 5.
  8. Enter a jwt secret in .env.
    • JWT key should be at least 32 random characters (256 bits) for HS256
  9. Specify DB_TYPE in .env
    • If using Firebase, enter your firebase config keys. See Firebase quickstart
    • If using MySQL, enter your mysql database config keys (host, database, user/pass and optionally port). Note: if using Heroku with ClearDB, the DB should create the necessary Config Var, i.e. CLEARDB_DATABASE_URL.
  10. Start your dev environment in a separate terminal from ngrok. If ngrok restarts, update callbacks in steps 4 and 7 with the new ngrok_id.
    • npm run dev
  11. Install the app and launch.

About

A reference implementation of a BigCommerce single-click app, in Node.JS + Next.js/React

Resources

License

Stars

Watchers

Forks

Packages

No packages published

Languages

  • TypeScript 93.4%
  • JavaScript 6.6%