Newer
Older
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
# Proof of Concept Portal
**Backend Stack**
```
Backend : [ Nginx HTTP proxy <-> Gunicorn * [Uvicorn ASGI] @ Python 3.7 > FastAPI -> PostgreSQL ]
<--- HTTP JSON XHR / REST API --->
Browser > Web Frontend
```
* [FastAPI](https://fastapi.tiangolo.com) Web Framework to build REST server
**key features:**
- fast and competitive
- asynchronous I/O event loop using [libuv](https://github.com/libuv/libuv)
- support [OpenAPI](https://github.com/OAI/OpenAPI-Specification) / [JSON Schema](http://json-schema.org)
- generate automatic interactive documentation
- load JSON to class object and verify schema
- support [GraphQL](https://graphql.org)
* [Starlette](https://github.com/encode/starlette) ASGI framework/toolkit
* [Uvicorn](https://www.uvicorn.org) ASGI server as [Gunicorn](https://gunicorn.org) worker
* [SqlAlchemy](https://www.sqlalchemy.org) ORM -> [PostgreSQL](https://www.postgresql.org)
* [MJML](https://mjml.io) Responsive Email Framework
**Checkout Frontend Stack**
* [React](https://reactjs.org)
* [Create React App](https://create-react-app.dev) (using Webpack)
* Sass stylesheet
* Nginx HTTP proxy or as a Wordpress Plugin
**Checkout Frontend Stack**
* [React](https://reactjs.org) Web Framework
* [React Router](https://reactrouter.com)
* [Redux](https://redux.js.org)
* transpiled and bundled by [Webpack](https://webpack.js.org)
* Sass stylesheet
* Nginx HTTP proxy
# Screenshots
https://code.electrolab.fr/fabrice/poc-portal/-/tree/master/screenshots
## OpenAPI Swagger Documentation
![](https://code.electrolab.fr/fabrice/poc-portal/-/raw/master/screenshots/Capture%20d%E2%80%99%C3%A9cran%202020-10-26%20%C3%A0%2017.49.37-fullpage.png "OpenAPI Swagger Documentation")
## Create Donation
![](https://code.electrolab.fr/fabrice/poc-portal/-/raw/master/screenshots/Capture%20d%E2%80%99%C3%A9cran%202020-10-26%20%C3%A0%2017.50.06-fullpage.png "Create donation")
## Frontend Form
![](https://code.electrolab.fr/fabrice/poc-portal/-/raw/master/screenshots/Screenshot_20201026_175042.png "Frontend form")
## Stripe Checkout
![](https://code.electrolab.fr/fabrice/poc-portal/-/raw/master/screenshots/Capture%20d%E2%80%99%C3%A9cran%202020-10-26%20%C3%A0%2017.54.01-fullpage.png "Stripe Checkout")
## Stripe Payments
![](https://code.electrolab.fr/fabrice/poc-portal/-/raw/master/screenshots/Capture%20d%E2%80%99%C3%A9cran%202020-10-26%20%C3%A0%2017.55.18-fullpage.png "Stripe payments")
## Stripe Payment
![](https://code.electrolab.fr/fabrice/poc-portal/-/raw/master/screenshots/Capture%20d%E2%80%99%C3%A9cran%202020-10-26%20%C3%A0%2017.55.29-fullpage.png "Stripe payment")
## Redirect to Frontend after Stripe Checkout Completed
![](https://code.electrolab.fr/fabrice/poc-portal/-/raw/master/screenshots/Screenshot_20201026_175429.png "redirect to Frontend after Stripe checkout completed")
## OAuth2 Login in OpenAPI
![](https://code.electrolab.fr/fabrice/poc-portal/-/raw/master/screenshots/Capture%20d%E2%80%99%C3%A9cran%202020-10-26%20%C3%A0%2017.56.52-fullpage.png "OAuth2 login")
# OAuth2 logged
![](https://code.electrolab.fr/fabrice/poc-portal/-/raw/master/screenshots/Capture%20d%E2%80%99%C3%A9cran%202020-10-26%20%C3%A0%2017.56.57-fullpage.png "OAuth2 bearer")
# Donations Query
![](https://code.electrolab.fr/fabrice/poc-portal/-/raw/master/screenshots/Capture%20d%E2%80%99%C3%A9cran%202020-10-26%20%C3%A0%2017.57.12-fullpage.png "Donations query")
# Urls
* Backend OpenAPI : http://localtest.me:8000/docs
* Frontend: http://localhost:3000/checkout
# Stripe Test Card
| Type | Issuer | Payment | ID |
| ------------------ | --------- | -------- | --------------------|
| French Visa | Stripe.uk | succeeds | 4000 0025 0000 0003 |
| International Visa | Stripe.us | succeeds | 4242 4242 4242 4242 |
| International Visa | Stripe.us | declined | 4000 0025 0000 3155 |
# Stripe Fee Computation
```
P = N + 0.25 + N*f
= N*(1+f) + 0.25
N = (P - 0.25) / (1 + f)
10*(1+1.4/100) + 0.25 = + 0.39
100 = + 1.65
500 = + 7.25
```