Skip to content

Commit aa5880c

Browse files
authored
Merge branch 'vuestorefront:main' into main
2 parents 135db67 + 37e654c commit aa5880c

34 files changed

+3866
-47
lines changed

Diff for: docs/content/1.index.md

+17-9
Original file line numberDiff line numberDiff line change
@@ -3,29 +3,37 @@ layout: fullscreen
33
hideFromSiteSearch: true
44
---
55

6-
::info
7-
#title
8-
Looking for v2 docs?
9-
#default
10-
These docs are for projects using the Alokai SDK, if you're looking for our Nuxt 2 based solutions, please visit our [v2 docs](https://docs.alokai.com/v2).
11-
::
12-
136
# [Alokai Docs]{.text-4xl.mt-8.block}
147

158

169
Alokai is a Frontend-as-a-Service that provides several tools to help you build performant, scalable, and customizable eCommerce storefronts. From UI libraries and integrations, to deployment and monitoring, we can help you build the ideal headless commerce experience.
1710

18-
::card{title="Getting Started" icon="IconVsf" iconClass="text-primary-500" :coloredIcon="false" }
11+
::grid{:columns='2'}
12+
#section-1
13+
::card{title="Learn the concepts" icon="IconVsf" iconClass="text-primary-500" :coloredIcon="false" class="mb-5"}
1914

2015
#description
21-
Set up a new Alokai project or learn more about our architecture, project principles, and all of the ways that the Alokai ecosystem can help you build better storefronts.
16+
Learn more about our architecture, project principles, and all of the ways that the Alokai ecosystem can help you build better storefronts.
2217

2318
#cta
2419
:::docs-arrow-link{to="/general"}
2520
Learn more
2621
:::
2722
::
2823

24+
#section-2
25+
::card{title="Learn the tools" icon="IconVsf" iconClass="text-primary-500" :coloredIcon="false" }
26+
27+
#description
28+
Learn how to use Alokai hands on from our guides. This is the best place to start if you want to skip the theory and make yoru hands dirty.
29+
30+
#cta
31+
:::docs-arrow-link{to="/guides"}
32+
Learn more
33+
:::
34+
::
35+
36+
::
2937

3038
## Products and Features
3139

Diff for: docs/content/cookbook/1.index.md

+2-6
Original file line numberDiff line numberDiff line change
@@ -6,9 +6,5 @@ navigation:
66

77
# Cookbook
88

9-
::grid{:columns="3"}
10-
#section-1
11-
:card{to="/cookbook/oss-deployment-guide" title="OSS Deployments" description="Deploy to a linux server" icon="typcn:arrow-up-outline"}
12-
13-
14-
::
9+
:card{to="/cookbook/handling-custom-occ-endpoint" title="Handling Custom OCC Endpoints" description="It is a common task to add support for a custom (non-standard) SAP OCC API endpoint not covered by the Alokai intergration.
10+
This guide will show you how can do it using Alokai." icon="typcn:arrow-up-outline"}

Diff for: docs/content/guides/1.index.md

+34-15
Original file line numberDiff line numberDiff line change
@@ -9,33 +9,52 @@ Welcome to the guides section of the documentation. Here you will find a collect
99

1010
At **Alokai**, we are committed to providing the best possible experience for our users. We are constantly working on improving our documentation and adding new guides to help you get the most out of the platform.
1111

12-
## Getting Help
13-
If you have any questions or need help with anything, please don't hesitate to get in touch with us in our [Discord](https://discord.vuestorefront.io/). We are always happy to help.
1412

15-
## Alokai Guides
1613

14+
## Learn Alokai
1715

18-
::grid{:columns='3'}
16+
Follow this path to understand how to use Alokai and start building your Alokai application following performance best practices.
17+
::steps
1918

20-
#section-1
21-
:card{to="/guides/alokai-essentials" title="Alokai Essentials" description="Learn how to build Alokai Application: From 0 to Hero. Understand how different parts of our stack will help you to build your Alokai application." icon="tabler:123"}
19+
#step-1
20+
::card{title="Alokai Essentials" to="/guides/alokai-essentials" class="mb-5 !h-auto"}
21+
#description
22+
Learn how to build Alokai Application: From 0 to Hero. Understand how different parts of our stack will help you to build your Alokai application.
23+
::
24+
25+
#step-2
26+
::card{title="Customization" to="/guides/customization-next-js" class="mb-5 !h-auto"}
27+
#description
28+
Alokai is not a cookie-cutter solution, it is meant to be able to handle even the most complex use cases. This guide will take you through the most common customization scenarios.
29+
::
2230

23-
#section-2
24-
:card{to="/guides/performance" title="Performance" description="Improve your website's user experience and increase conversions by optimizing your website's performance." icon="gg:performance"}
31+
#step-3
32+
::card{title="Multistore" to="/guides/multistore" class="mb-5 !h-auto"}
33+
#description
34+
Learn how to create efficient and unified multigeo/multibrand/multivendor setups with Alokai.
35+
::
2536

26-
#section-3
27-
:card{to="/guides/customization-next-js" title="Customization" description="Alokai is not a cookie-cutter solution, it is meant to be able to handle even the most complex use cases. This guide will take you through the most common customization scenarios." icon="tabler:tool"}
37+
::
2838

29-
#section-4
30-
:card{to="/guides/kubernetes-probe" title="Kubernetes Probes" description="Alokai Cloud customers' middleware and frontend apps are deployed in Kubernetes. Check how Kubernetes mechanisms are used by Alokai Cloud" icon="tabler:heart-rate-monitor"}
39+
## Advanced
3140

32-
#section-5
33-
:card{to="/guides/best-practices" title="Best Practices" description="Check what to follow to keep your storefront in the best possible shape" icon="tabler:rosette-discount-check"}
41+
::card{title="Kubernetes Probes" to="/guides/kubernetes-probe" class="mb-5" icon="tabler:heart-rate-monitor"}
42+
#description
43+
Learn how to implement health check endpoints for your Alokai Cloud applications running on Kubernetes. This guide covers liveness and readiness probes implementation to ensure proper application monitoring and reliability.
44+
::
3445

46+
## Best Practices
3547

48+
::card{title="Performance" to="/guides/best-practices/performance" class="mb-5" icon="tabler:rosette-discount-check"}
49+
#description
50+
Every 100ms added to loading time costed Amazon 1% less sales. Don't let the poor performance to ruin your sales. Learn how to optimize your store for speed.
3651
::
3752

53+
::card{title="Data Fetching" icon="tabler:mobiledata" to="/guides/best-practices/data-fetching" }
54+
#description
55+
Learn how to optimize your data fetching strategy to improve performance and avoid caching errors.
56+
::
3857

3958
::info
4059
Can't find what you're looking for? Check out our [cookbook](/cookbook) for more guides and tutorials.
41-
::
60+
::

Diff for: docs/content/guides/3.performance/_dir.yml

-5
This file was deleted.

Diff for: docs/content/guides/6.best-practices/1.index.md

+14-1
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,18 @@
1+
---
2+
title: Guides
3+
layout: default
4+
---
5+
16
# Best Practices
27

38
In this guide, we have compiled a collection of best practices to help you optimize your development workflow, improve code quality, and ensure maintainability.
49

5-
::card{title="Data Fetching" icon="tabler:mobiledata" to="/guides/best-practices/data-fetching" }
10+
::card{title="Performance" to="/guides/best-practices/performance" class="mb-5" icon="tabler:rosette-discount-check"}
11+
#description
12+
Every 100ms added to loading time costed Amazon 1% less sales. Don't let the poor performance to ruin your sales. Learn how to optimize your store for speed.
13+
::
14+
15+
::card{title="Data Fetching" icon="tabler:mobiledata" to="/guides/best-practices/data-fetching" }
16+
#description
17+
Learn how to optimize your data fetching strategy to improve performance and avoid caching errors.
18+
::
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
title: Performance
2+
sidebarRoot: true
3+

Diff for: docs/content/guides/7.multistore/1.index.md

+26
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,26 @@
1+
---
2+
title:
3+
layout: default
4+
---
5+
6+
# Multistore
7+
8+
On this page you'll find a set of guides that will help you to understand the fundamentals of Alokai and how different parts of our stack will help you to build your Alokai application.
9+
10+
Below you will find a list of guides to help you get started with Alokai.
11+
12+
::card{title="Introduction" icon="tabler:align-box-center-middle" to="/guides/multistore/introduction" }
13+
14+
#description
15+
Learn what challenges the Alokai Multistore solution addresses and how it can help you solve them.
16+
::
17+
18+
<br />
19+
20+
::card{title="Tooling and concepts" icon="tabler:tools" to="/guides/multistore/tooling-and-concepts" }
21+
22+
#description
23+
Learn the concepts and tools behind the Alokai Multistore solution.
24+
::
25+
26+
<br />
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,73 @@
1+
---
2+
title: The Multistore Problem and Alokai's Solution
3+
layout: default
4+
---
5+
6+
# The Multistore Problem and Alokai's Solution
7+
8+
## TL;DR
9+
Multistore commerce brings a huge maintenance burden for merchants. Alokai solves this problem by allowing you to reuse the common parts between stores. You only need to write and maintain the distinct parts of the stores. This is achieved by the file inheritance mechanism. It works similar to CSS cascading, each layer can override any file from your source code or previous layers while keeping the rest intact.
10+
<img src="../img/inheritance-simplified.png" alt="Alokai Multistore's Inheritance Mechanism" class="mx-auto">
11+
12+
Read on to learn more about the multistore problem and Alokai solution or [jump straight to the practical part](/guides/multistore/tooling-and-concepts).
13+
14+
## Challenges of Scaling eCommerce Setups
15+
16+
**Expanding an eCommerce business across multiple brands, geographies, and touchpoints is a logistical and technical minefield. As companies grow, agility often takes a hit—slowing down innovation, increasing overhead, and complicating operations.**
17+
18+
Businesses often start with a single eCommerce platform, designed for a specific market and use case. Growth then happens through expansion into new touchpoints (mobile apps, marketplaces, social commerce), new geographies, or acquiring brands with their own tech stacks. **Over time, what was once a streamlined setup becomes fragmented, introducing complexity that makes agility and scalability difficult.**
19+
20+
How do you maintain speed and adaptability while managing multiple storefronts, integrating new acquisitions, and expanding into new markets?
21+
22+
## How Alokai Solves the Multistore Problem
23+
24+
**Most eCommerce applications share 60-80% of their functionality, regardless of geography, touchpoint, or brand.** The foundation for every eCommerce store is always the same - product catalog, cart, checkout, user profile. Alokai provides an efficient setup that prioritizes reuse of common components and ease of maintainability.
25+
26+
<img src="../img/reusable-core.png" alt="From multiple repositories into a unified codebase with reusable code" class="mx-auto">
27+
28+
At Alokai, we've been building universal eCommerce applications that cover different use cases around B2B and B2C since 2017. We've put all of our knowledge about reusability and configurability of eCommerce storefronts into our Multistore product so you can leverage it without years of discovering solutions to different problems and their edge cases.
29+
30+
We guarantee that it is the most optimal way to run complex eCommerce setups.
31+
32+
As a rule of thumb, **the more complex your setup is, the more value we can bring to your business**. Multiple vendors, technologies, geographies, touchpoints, brands, catalogs... - the more complexity you struggle with now, the more you can gain!
33+
34+
Let's see how, on a high level, Alokai addresses different components of the Multistore problem.
35+
36+
### End-to-End Solution for an End-to-End Problem
37+
38+
**Multistore is not a single problem to solve.** It is a set of challenges that must be solved individually, and making those solutions work well together is another problem to solve. There is a lot of complexity in it that spreads across all the application layers - UI, frontend logic, data, vendors, and infrastructure. It's not easy to find a solution that works for every use case. It's hard to combine them to fulfill the ones you want to cover, and it's almost impossible to pick ones that will work for multiple projects, often with different goals.
39+
40+
<img src="../img/end-to-end-solution.svg" alt="End-to-end solution for ecommerce and multistore" class="mx-auto">
41+
42+
For that, you need an end-to-end solution. A platform that covers all the layers and is specifically built to solve end-to-end problems rather than one from a specific domain. This is where Alokai comes in.
43+
44+
We provide an end-to-end solution that goes through all the layers of an eCommerce project from design to deployment. You can read more about Alokai products and stacks [here](/general#our-products).
45+
46+
### Inheritance Ensures Maximum Reusability Without Limiting Customization
47+
48+
The key pattern behind Alokai's Multistore solution is the file inheritance mechanism. Think of it like CSS cascading - each layer can override any file from your source code or previous layers while keeping the rest intact. This includes pages, components, layouts, styles, public assets, and any other project files.
49+
50+
<img src="../img/inheritance-simplified.png" alt="Alokai Multistore's Inheritance Mechanism" class="mx-auto">
51+
52+
This approach ensures maximum reusability of common parts while leaving full freedom to customize per store.
53+
54+
### Unified Data Layer
55+
56+
The [Unified Data Layer](/unified-data-layer) allows you to keep the same data model used across all stores even if the underlying technologies are different. This way, you don't need to build alternative versions of the UI and business logic for each vendor. Even if your API stack is not consistent across brands or regions, you can still have a single, unified core UI and logic shared across all of them.
57+
58+
### Freedom in How You Build and Deploy
59+
60+
The solution is flexible and allows you to optimize the ways you want to develop and deploy the application separately.
61+
62+
This means that you can deploy completely separate storefronts or a single store with multiple variations from the same repository. One does not influence the other, so you can optimize the workflow and deployment to fit your needs without tradeoffs.
63+
64+
::card{title="Next: Use Cases" to="/guides/multistore/use-cases"}
65+
66+
#description
67+
Learn the most common use cases that Alokai Multistore was built for.
68+
69+
#cta
70+
:::docs-arrow-link{to="/guides/multistore/use-cases"}
71+
Next
72+
:::
73+
::

0 commit comments

Comments
 (0)