This is donation site build with ReactJS via Create React App as client side + Stripe as payment gateway and [ExpressJS (https://expressjs.com/) as server side.
Extra features included:
- Light / Dark mode toggle.
- Installed Tailwind CSS.
- Stripe endpoint for webhook, received and set expires to checkout session.
- Payment logs for Stripe webhook endpoint. (payment_log.txt)
- Save payment session & logs in Cloud Firestore.
- Use markdown as page content (ex: Credits & Terms of Service page).
- Node.js - Node.js is a JavaScript runtime built on Chrome's V8 JavaScript engine.
- Express - Fast, unopinionated, minimalist web framework for Node.js
- Create React App - Create React App is an officially supported way to create single-page React applications. It offers a modern build setup with no configuration.
- TailwindCSS - Rapidly build modern websites without ever leaving your HTML.
- Cloud Firestore - Cloud Firestore is flexible, scalable NoSQL cloud database to store and sync data for client- and server-side development.
- Heroku - Heroku is a platform as a service (PaaS) that enables developers to build, run, and operate applications entirely in the cloud.
- Stripe - Stripe is a suite of APIs powering online payment processing and commerce solutions for internet businesses of all sizes. Accept payments and scale faster.
- dotenv
- express
- firebase-admin
- formidable
- helmet
- stripe
- tailwindcss
- animate.css
- sass
- react-markdown
- Setup nodejs - https://nodejs.org/
- Install the package for server side
npm install
- Configure .env file. Replace .env_example to .env and update the settings.
- Start server
npm start
- Go to client side directory
cd ./client/
- Install the package for client side
npm install
- Start client side
npm start
- go to main directory
cd ./
- Build application
npm run build
- Start and serve site
npm start