Django & Stripe Mini eCommerce
Open-source eCommerce Starter that loads the products from JSON
files saved in the templates directory
(no database required) and uses a decent UI for page styling - Powered by Django & Stripe.
Have questions?
Contact Support (Email & Discord) provided by AppSeed
Free Version | Rocket eCommerce | Custom Development |
---|---|---|
✓ Stack: Django, Bootstrap |
✅ Stack: Django, TailwindCSS |
Everything in PRO, plus: |
✓ Payments: Stripe | ✅ Payments: Stripe | ✅ 1mo Custom Development |
✓ Minimal Bootstrap Design | ✅ Stripe Products Import | ✅ Team: PM, Developer, Tester |
✓ No Database | ✅ Local Products Customization | ✅ Weekly Sprints |
- | ✅ Categories, TAGS | ✅ Technical SPECS |
- | ✅ Multi-product Checkout | ✅ Documentation |
- | ✅ Discounts Page | ✅ 30 days Delivery Warranty |
- | ✅ Analytics | - |
- | ✅ Transactions Tracking | - |
- | ✅ Zero Configuration | - |
- | ✅ FIGMA Project | - |
- | ✅ PRO Support - Email & Discord | - |
------------------------------------ | ------------------------------------ | ------------------------------------ |
- | 🚀 LIVE Demo | 🛒 Order : $3,999 (GUMROAD) |
👉 Step 1 - Download the code from the GH repository (using
GIT
)
$ git clone https://github.com/app-generator/ecommerce-django-stripe.git
$ cd ecommerce-django-stripe
👉 Step 2 - Create
.env
using providedenv.sample
Add .env
file in your projects root directory and add the following credentials
DEBUG=True
SECRET_KEY=
STRIPE_SECRET_KEY=
STRIPE_PUBLISHABLE_KEY=
DOMAIN_URL=
👉 Step 3 - Install dependencies
$ python -m venv env
$ source env/bin/activate
$ pip install -r requirements.txt
👉 Step 4 - Migrate DB & Start the APP
$ python manage.py migrate
$ python manage.py runserver
Visit http://localhost:8000
in your browser. The app should be up & running.
👉 Step 5 - Access the products and initiate a payment
IMPORTANT: Make sure your Stripe account is running in TEST Mode
and Use Test CC provided by Stripe:
- CC Number:
4242 4242 4242 4242
- Any data for the rest of the fields
- Go to
products/templates/products
directory - Create a new
JSON
file with data:name
: Used in product page & Cardsprice
: Used for paymentcurrency
: Used for paymentinfo
: used in cardsshort_description
: used in product pagefull_description
: used in product page
- Create Media Files
- Go to
products/static/products
- Create a directory using the same name as for
JSON
file- Create
card.jpg
: 500x335px - Create
cover.jpg
: 2100x1400px
- Create
- Go to
- Start or refresh the app
- The new product should be listed in the
home
page - Product page is available at address:
http://127.0.0.1:8000/product/<SLUG>/
where the SLUG is the name of the JSON file
- The new product should be listed in the
- Go to
Create Product
route inProducts
dropdown [You must be a superuser] - On the left side there should be a button
Get Products From Stripe
this button will pull all the products associated with the stripe account. demo- There will be product list, you can create a product by clicking the
Create
button. demo
- There will be product list, you can create a product by clicking the
- On the right side you will see the local product list and a button
Edit
.- You can edit a product from here. [ID is not editable] demo
Sample product page generated for Air ZOOM Pegasus, assets loaded from here
The project has a simple structure, represented as bellow:
< PROJECT ROOT >
|
|-- products/__init__.py
|-- products/
| |-- static/
| | |-- <css, JS, images> # CSS files, Javascripts files
| |
| |-- templates/
| | |
| | |-- includes/ # Page chunks, components
| | | |-- navigation.html # Top bar
| | | |-- sidebar.html # Left sidebar
| | | |-- scripts.html # JS scripts common to all pages
| | | |-- footer.html # The common footer
| | |
| | |-- layouts/ # App Layouts (the master pages)
| | | |-- base.html # Used by common pages like index, UI
| | | |-- base-fullscreen.html # Used by auth pages (login, register)
| | |
| | |-- products/ # Define your products here
| | | |-- nike-goalkeeper-match.json # Sample product
|
|-- requirements.txt
|
|-- run.py
|
|-- ************************************************************************
- Django Framework - The official website
- Stripe Dev Tools - official docs
Django & Stripe Mini eCommerce - Free sample provided by AppSeed.