# PANACLOUD HEADLESS B2C AND B2B ECOMMERCE DIVISION

We are starting a new headless e-commerce division of Panacloud, which will have developers all over Pakistan. This division will be developing products for sale: Full Stack Headless Ecommerce Templates which will sold on Theme Forest and Panaverse Ownership Economy Marketplace.

Business Model: 70% for developers and designers

Soon we will be start Zoom sessions of Panacloud Headless Ecommerce Zoom Sessions. 


Here are the details about the community leaders and community groups and Study Material:

What is Headless Ecommerce:
https://www.shopify.com/enterprise/headless-commerce

https://acowebs.com/traditional-vs-headless-ecommerce/

What is B2B and B2C model of eCommerce?
B2B ecommerce utilises online platforms to sell products or services to other businesses. B2C ecommerce targets personal consumers. A company that sells office furniture, software, or paper to other businesses would be an example of a B2B company. B2B ecommerce tends to be more complex than B2C ecommerce.

https://www.salesforce.com/eu/blog/2021/11/b2b-vs-b2c-ecommerce-difference.html

https://hygraph.com/resources/headless-commerce-b2b-b2c-whitepaper

Base Next.js Framework:

https://vercel.com/templates/next.js/nextjs-commerce

For now we will start with three vertical solutions:


## I. Headless Shopify Learning Group:

https://chat.whatsapp.com/DFm0KDfUjym6ov8OBzGUI2

1. Ayisha from Islamabad (Project Manager)
+92 303 5110750

2. Kubabib from Peshawar (Developer)
+92 332 9100262

https://www.linkedin.com/in/mk-software-engineer

Study Material:

https://www.shopify.com/plus/solutions/headless-commerce

https://vercel.com/templates/next.js/nextjs-commerce


## II. Headless Woocommerce Learning Group:

https://chat.whatsapp.com/HQr3jwEY6MjEmSLVnAWsFQ

Syed Hamza Gilani from Multan/Islamabad (Project Manager and Developer)
+92 300 0870844

https://www.linkedin.com/in/syedhamzagilani/ 

Study Material:

https://www.youtube.com/watch?v=tnm-nOGygRw

https://www.youtube.com/watch?v=5RUn0dWPqS0

https://dribbble.com/shots/21706225-Metashop-React-NextJS-Ecommerce-for-Headless-WooCommerce

https://www.upwork.com/services/product/development-it-headless-woocommerce-website-with-next-js-1558270103950356480


## III. Headless Salesforce B2B Commerce Cloud Learning Group:

https://chat.whatsapp.com/K4vdZ9X0Tvk2bIaxcAb6CS

1. Osman from Faisalabad (Project Manager)
+92 301 3949480

https://www.linkedin.com/in/musmanfullstack


2. Usman Rajput from Lahore (Developer)
+92 303 0353803

https://www.linkedin.com/in/muhammad-usama-2228ba1b9/

3. Anees Ahmed (Project Manager Karachi)
+92 300 8960038

https://www.linkedin.com/in/aneesahmed-pk/

Study Material:
https://jmango360.com/blog/headless-commerce-b2b/

https://www.royalcyber.com/blogs/ecommerce/unlock-the-power-of-headless-commerce/

https://www.salesforceben.com/salesforce-headless-commerce/

https://vuestorefront.io/blog/salesforce-headless-commerce

https://www.youtube.com/watch?v=fqJ0FyMTs04

https://www.youtube.com/watch?v=PKsAZbldNp4

https://vercel.com/templates/next.js/salesforce-commerce-cloud-starter



Note: We will add more community leaders we move forward. 

# Standard for submitting Full Stack Templates on ThemeForest

[Quality & Technical Requirements](https://help.author.envato.com/hc/en-us/categories/360000038846-Quality-Technical-Requirements)

[Themes Item Preparation & Technical Requirements](https://help.author.envato.com/hc/en-us/articles/360000470826-Themes-Item-Preparation-Technical-Requirements)

## Check List:
1. Imagine and wire frame a design. Decide if you are designing for a particular audience (restaurants, or hotels, or artist’s portfolios…) or if you are going for a more general template. The other option is to take inpiration from a website or template. Check out the [Latest Design Trends](https://github.com/panacloud-modern-global-apps/ui-design-trends).
2. Once you are happy with the design, create the site! Be meticulous with your code, comment everything so it’s extremely readable and clear, and format everything properly.
3. Fill your site with good looking filler text content. You can use [Lorem Ipsum](https://loremipsum.io/), but in the places where text is highly visible, you should write the content yourself so it is personally applicable to the site you made.
4. Donot use copyrighted images, etc. For Oper Source Images, Video, etc. check this [link](https://github.com/dimitrisraptis96/design-heaven).
5. Create a simple read-me on how to replace content in your site and host it with a popular web host like Vercel. Include an affiliate links!
6. Organize your file and documentation so that it is easy to view, edit and understand. Group, label and organize common elements so that buyers are able to easily edit your file. **The more editable your file is, the more valuable it is to buyers.**
7. Ensure that your code is validated and in a style that represents the latest and best practices in the industry. 
8. Our main selling point is that we are building Full-Stack Strongly and Fully Typed Easily Customizable Responsive Accessible Web2 and Web3 Templates. To understand the concept read these articles:
- [Fully Typed Web Apps](https://www.epicweb.dev/fully-typed-web-apps)
- [Build a Full Stack App with Next.js, Tailwind, tRPC and Prisma ORM](https://dev.to/franciscomendes10866/build-a-full-stack-app-with-nextjs-tailwind-trpc-and-prisma-orm-4ail)
9. All our templates will use the following tech stack:
- Our Programming Language is [TypeScript](https://github.com/panacloud-modern-global-apps/learn-typescript) (Version 5.2+)
- Our Full-Stack Web Platform is [Next.js](https://github.com/panacloud-modern-global-apps/nextjs) (Version 13.4+). [Practice projects available here](https://github.com/panacloud-modern-global-apps/nextjs-projects).
- For minor animation [Framer-Motion](https://chakra-ui.com/getting-started/with-framer) (Version 2.3+)
- To develop simple API integrated with Next.js we will use [API Routes](https://nextjs.org/docs/api-routes/introduction) 
- Ethers for Ethereum integration (Version 5.7+)
- For Smart Contracts we will use Solidity (Version 0.8.17+) with Hardhat (Version 2.12+)
- For Quick [Deployment](https://vercel.com/docs/cli/deploy) we will use Vercel with [CLI](https://vercel.com/docs/cli)
10. Each template must have documentation for the user.
11. Have two versions with seprate directories: a. plain site b. with Headless CMS
Please test your template with all these breakpoints (The inspect element on the browsers have these breakpoints built in, use it to test):
- 320px - Mobile S
- 375px - Mobile M
- 425px - Mobile L
- 768px - Tablet
- 1024px - Laptop
- 1440px - Laptop L
- 2560px - 4K
12. If appropriate make you Website an [PWA](https://github.com/shadowwalker/next-pwa)
