Skip to content

Commit

Permalink
chore(UST-1317): rebranding readme (#189)
Browse files Browse the repository at this point in the history
* chore: rebranding

* chore: add missing alt

* chore: update logo

* chore: update guide

* chore: update link to docs
  • Loading branch information
lukaszjedrasik committed Mar 19, 2024
1 parent b9e75c5 commit 2a5e20d
Show file tree
Hide file tree
Showing 2 changed files with 27 additions and 32 deletions.
34 changes: 17 additions & 17 deletions GUIDE.md
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
# Detailed overview & further development guide

Welcome to the Vue Storefront Boilerplate for the [Nuxt.js 3](https://nuxt.com/) project! This guide will provide you with an overview of the project structure, tools, and best practices to help you get started quickly.
Welcome to the Alokai Boilerplate for the [Nuxt.js 3](https://nuxt.com/) project! This guide will provide you with an overview of the project structure, tools, and best practices to help you get started quickly.

### Project Structure

Expand All @@ -10,12 +10,12 @@ For detailed information on how to get started, configure, and use this project

This Turborepo includes the following apps:

- `server` - Vue Storefront Middleware server powered by **[Express.js](https://expressjs.com/)**
- `server` - Alokai Middleware server powered by **[Express.js](https://expressjs.com/)**
- `web` - A web application powered by Nuxt.js

#### Server Middleware

The server application is a core of a Vue Storefront application. It allows connecting services like E-commerce platform, CMS, or Payment providers to your application.
The server application is a core of a Alokai application. It allows connecting services like E-commerce platform, CMS, or Payment providers to your application.

```shell

Expand All @@ -35,20 +35,20 @@ apps/
The most important files of the `Server Middleware` app are:

- `src/index.ts` - Express server entry point that handles all requests to the third-party platforms from the SDK
- `middleware.config.ts` - Vue Storefront Middleware configuration
- `middleware.config.ts` - Alokai Middleware configuration

For more info about `Server Middleware` refer to the [documentation](https://docs.vuestorefront.io/v2/architecture/server-middleware.html).
For more info about `Server Middleware` refer to the [documentation](https://docs.alokai.com/v2/architecture/server-middleware.html).

> **Warning**
> This project does not come with pre-packaged integrations for the sake of simplicity. However, you have the flexibility to develop custom integrations or utilize our official integrations to connect the Middleware with actual data sources.
>
> You can choose from our official integrations, which provide pre-built connectors for various data sources and services. These integrations are designed and maintained by the VSF team as well as partners, ensuring a seamless integration experience.
> You can choose from our official integrations, which provide pre-built connectors for various data sources and services. These integrations are designed and maintained by the Alokai team as well as partners, ensuring a seamless integration experience.
>
> Check out [official VSF Middleware integrations](https://docs.vuestorefront.io/v2/integrations/) to get started quickly.
> Check out [official Alokai Middleware integrations](https://docs.alokai.com/v2/integrations/) to get started quickly.
>
> If your project requires custom integrations tailored to specific data sources or services, our project offers a flexible framework and comprehensive documentation to guide you through the process. By following our guidelines and leveraging the capabilities of the Middleware, you can effortlessly develop custom integrations that meet your unique requirements.
>
> For more information on developing custom integrations, please refer to the [Integrating e-commerce platform documentation](https://docs.vuestorefront.io/v2/integrate/integration-guide.html).
> For more information on developing custom integrations, please refer to the [Integrating e-commerce platform documentation](https://docs.alokai.com/v2/integrate/integration-guide.html).
> **Note**
> If you are migrating your project from Nuxt 2, the `src/index.ts` file serves as the equivalent of the Server's Middleware `middleware.js` entry point.
Expand All @@ -74,7 +74,7 @@ apps/
│ ├── index.vue # App index page component
│ └── ...
├── public/ # Public assets
├── sdk/ # Vue Storefront SDK configuration
├── sdk/ # Alokai SDK configuration
├── server/ # In-app backend server
├── .eslintrc.js # ESLint configuration
├── .lintstagedrc.js # Lint-Staged configuration
Expand All @@ -92,7 +92,7 @@ apps/

List of essential directories:

- `sdk` [Vue Storefront SDK](https://docs.vuestorefront.io/sdk/) module configuration
- `sdk` [Alokai SDK](https://docs.alokai.com/sdk/) module configuration
- `components/ui` Storefront UI Block components, like `ProductCard` or `Review`
- `composables` reusable composition functions, e.g. data fetching and UI composables
- `mocks` mock data used across the application, e.g. footer links
Expand Down Expand Up @@ -187,22 +187,22 @@ Naming convention:
- Vue (Nuxt) components should follow `Pascal case` pattern (`CategoryFilters`, `Heading`)
- The types for component's props should be named `{Component}Props`. For example, `GalleryProps` or `HeadingProps`

#### Vue Storefront SDK and data fetching
#### Alokai SDK and data fetching

The data fetching process is handled seamlessly by integrating VSF SDK, which acts as a robust communication layer between the application and the VSF Middleware. The SDK provides a set of convenient and optimized methods to fetch data from various APIs and services.
The data fetching process is handled seamlessly by integrating Alokai SDK, which acts as a robust communication layer between the application and the Alokai Middleware. The SDK provides a set of convenient and optimized methods to fetch data from various APIs and services.

To simplify the implementation and management of data fetching we're using native Nuxt's composables for [useAsyncData](https://nuxt.com/docs/api/composables/use-async-data) and [useState](https://nuxt.com/docs/getting-started/state-management). It seamlessly integrates with VSF SDK and simplifies the process of caching, synchronizing, and managing the application's data. These functions provide an elegant and efficient way to handle asynchronous data fetching, automatically managing data caching, refetching, and background updates.
To simplify the implementation and management of data fetching we're using native Nuxt's composables for [useAsyncData](https://nuxt.com/docs/api/composables/use-async-data) and [useState](https://nuxt.com/docs/getting-started/state-management). It seamlessly integrates with Alokai SDK and simplifies the process of caching, synchronizing, and managing the application's data. These functions provide an elegant and efficient way to handle asynchronous data fetching, automatically managing data caching, refetching, and background updates.

By combining VSF SDK with Nuxt's composables, this project ensures a reliable and performant data fetching experience for the application. Developers can easily fetch, update, and maintain data using composition declarative approach, while the VSF SDK handles the underlying communication and data retrieval tasks.
By combining Alokai SDK with Nuxt's composables, this project ensures a reliable and performant data fetching experience for the application. Developers can easily fetch, update, and maintain data using composition declarative approach, while the Alokai SDK handles the underlying communication and data retrieval tasks.

> **Note**
> For development and testing purposes, the project uses mocked data provided by the `@vue-storefront/integration-boilerplate-sdk` library.
>
> In a production scenario, is necessary to connect connectors to interface with actual data sources. The `@vue-storefront/[integration]-sdk` library serves as a foundation and offers the necessary abstractions and guidelines to facilitate the development of custom connectors.
>
> Check out [VSF SDK official integration modules](https://docs.vuestorefront.io/sdk/modules/).
> Check out [Alokai SDK official integration modules](https://docs.alokai.com/sdk/modules/).
For detailed information on how to get started, configure, and use this project built with VSF SDK, please refer to the [VSF SDK official documentation](https://docs.vuestorefront.io/sdk/sdk/) and [Nuxt.js](https://nuxt.com).
For detailed information on how to get started, configure, and use this project built with Alokai SDK, please refer to the [Alokai SDK official documentation](https://docs.alokai.com/sdk/) and [Nuxt.js](https://nuxt.com).

### Localization

Expand Down Expand Up @@ -290,4 +290,4 @@ You can configure your LHCI tests to block the merging of a Pull Request if the

#### More about performance

Additional performance good practices and information can be found [HERE](https://docs.vuestorefront.io/v2/performance/intro.html).
Additional performance good practices and information can be found [HERE](https://docs.alokai.com/v2/performance/intro.html).
25 changes: 10 additions & 15 deletions README.md
Original file line number Diff line number Diff line change
@@ -1,23 +1,18 @@
<p align="center">
<a href="https://https://vuestorefront.io/">
<picture>
<img src="https://user-images.githubusercontent.com/1626923/137092657-fb398d20-b592-4661-a1f9-4135db0b61d5.png" width="400px" height="auto"/>
</picture>
</a>
<h1 align="center">Vue Storefront for Vue (Nuxt 3) Boilerplate</h1>
</p>
![Alokai](https://res.cloudinary.com/vue-storefront/image/upload/v1710754524/Logo_green_2x_z4vmhz.png)

<h1 align="center">Alokai for Vue (Nuxt 3) Boilerplate</h1>

[![GitHub Repo stars](https://img.shields.io/github/stars/vuestorefront/vue-storefront?style=social)](https://github.com/vuestorefront/vue-storefront)
[![Twitter Follow](https://img.shields.io/twitter/follow/vuestorefront?style=social)](https://twitter.com/vuestorefront)
[![YouTube Channel Subscribers](https://img.shields.io/youtube/channel/subscribers/UCkm1F3Cglty3CE1QwKQUhhg?style=social)](https://www.youtube.com/c/VueStorefront)
[![Discord](https://img.shields.io/discord/770285988244750366?label=join%20discord&logo=Discord&logoColor=white)](https://discord.vuestorefront.io)

## Getting Started with Vue Storefront
## Getting Started with Alokai

To get started, see the following guides:

- [Introduction]([https://docs.vuestorefront.io/v2/getting-started/introduction.html](https://docs.vuestorefront.io/general)) to learn what is Vue Storefront.
- [Storefronts in Vue Storefront ecosystem](https://docs.vuestorefront.io/storefronts)
- [Introduction](https://docs.alokai.com/v2/getting-started/introduction.html) to learn what is Alokai.
- [Storefront in Alokai ecosystem](https://docs.alokai.com/storefront)
## Prerequisites:

- `Node.js` 20+
Expand Down Expand Up @@ -57,8 +52,8 @@ $ yarn dev
- Staged code linting with [lint-staged](https://github.com/okonet/lint-staged).
- [Progressive Web App](https://developer.mozilla.org/en-US/docs/Web/Progressive_web_apps/Guides/What_is_a_progressive_web_app) features with [Vite PWA for Nuxt](https://vite-pwa-org.netlify.app/).
- `i18n` localisation powered by [Nuxt-i18n](https://i18n.nuxtjs.org).
- [Vue Storefront SDK](https://docs.vuestorefront.io/sdk/) ready - integrate headless E-commerce platform with your project easily.
- [Vue Storefront Middleware](https://docs.vuestorefront.io/v2/architecture/server-middleware.html).
- [Alokai SDK](https://docs.alokai.com/sdk/) ready - integrate headless E-commerce platform with your project easily.
- [Alokai Middleware](https://docs.alokai.com/v2/architecture/server-middleware.html).
- Maximize lighthouse score.

## Guide
Expand All @@ -75,8 +70,8 @@ Please see our [contributing.md](contributing.md) for more information.

## Resources

- [Vue Storefront Documentation](https://docs.vuestorefront.io/v2/)
- [Vue Storefront Enterprise Documentation](https://docs.vuestorefront.io/v2/general/enterprise.html)
- [Alokai Documentation](https://docs.alokai.com)
- [Alokai Enterprise Documentation](https://docs.alokai.com/v2/general/enterprise.html)
- [Storefront UI 2 Documentation](https://docs.storefrontui.io/v2/)
- [Community Chat](http://discord.vuestorefront.io)

Expand Down

0 comments on commit 2a5e20d

Please sign in to comment.