Sreenshots | | About | | Techs, Libs and Plugins | | GettingStarted | | Contributing
A Next.js + FaunaDB + Stripe + PrismicCMS + SASS web application built during Ignite Bootcamp, provided by Rocketseat Programming School, the largest programming school in Brazil.In addition to the original project, some issues with NextAuth.js, Stripe API, and both FaunaDB and PrismicCMS versions have been fixed. Also, a responsive design has been implemented as well.
A Next.js + FaunaDB + Stripe + PrismicCMS + SASS web application built during Ignite Bootcamp, provided by Rocketseat Programming School, the largest programming school in Brazil. The main reason for this project is to put in practice the these technologies fundamentals in one project, from the beggining to deploy. The user flow schema was made using whimsical and can be access here.
In this project, it was used Techs, Libs and Plugins to improve the productivity when coding. Follow the list bellow to access all the technologies, libs and plugins documantations:
React | | Next.js | | NextAuth.js | | Github OAtuh | | Axios | | FaunaDB | | Stripe | | PrismicCMS | | SASS
$ git clone [email protected]:RafaelMariscal/igniteNews-Nextjs.git
$ cd igniteNews-Nextjs
$ yarn
In this project, the Stripe API was used as a Payment Platform, but is crucial to make it clear that a TEST VERSION of this API was used. Therefore, ALL PAYMENTS that will be processed ARE FAKE.
At the project's root diretory, a .env.local file needs to be created with these evironment variables to connect your project to the application.
NEXTAUTH_SECRET={ Next-Secret-Hash }
STRIPE_API_KEY={ Your-Shop-API-Key }
NEXT_PUBLIC_STRIPE_PUBLIC_KEY={ Stripe-PublicKkey }
STRIPE_WEBHOOK_SECRET={ Stripe-Secret-Key-Generated-By-The-StripeCLI }
STRIPE_SUCCESS_URL={ URL-to-be-redirected-if-user-subscription-success }
STRIPE_CANCEL_URL={ URL-to-be-redirected-if-user-subscription-fail }
GITHUB_CLIENT_ID=1{ Github-client-ID }
GITHUB_CLIENT_SECRET={ Github-secret-ID }
FAUNADB_KEY={ FaunaDB-access-key }
PRISMIC_ENDPOINT={ Prismic-Project-URL }
PRISMIC_ACCESS_TOKEN={ Prismic-Project-Access-Token }
To listen the Stripe API webhooks requests, use the Stripe CLI. Get every information about the Stripe CLI installation process here. With the Stripe CLI open, run the command theses command lines:
$ stripe login
$ stripe listen --forward-to { "BaseURL" + "api/webhooks" }
After running the $ stripe login command, just confirm the project access to the Stripe API.
The hash generated after running the $ stripe listen --forward-to { "BaseURL" + "api/webhooks" } command, needs to be atribuated to the STRIPE_WEBHOOK_SECRET environment variable at .env.local file.
The Next.Js documentation shows all the good practices that can be followed when using environments variables. To know more about it, access the documentation.
After all set up and with the terminal open at the project root file run the command line:
$ yarn dev
The project will be hosted at localhost:3000.
You can send how many PR's do you want, I'll be glad to analyse and accept them! And if you have any question about the project...
Email-me: [email protected]
Connect with me at LinkedIn
Thank you!