A
Alokai•10mo ago
Altamash

Create Shop

Hii Guys, @rohrig @skirianov I want to create new shop page in my vue storefront with all categories product in one and fetch from megnto 2 and also how to customize that all thing How to customize internal pages in Vue Storefront
42 Replies
rohrig
rohrig•10mo ago
Hi @Altamash 👋 , you can use this repo for inspiration: https://github.com/TidycodeIT/nuxt3-magento-sdk-storefront Please let me know if you have more questions after giving this a look. 😄
GitHub
GitHub - TidycodeIT/nuxt3-magento-sdk-storefront: A boilerplate sto...
A boilerplate storefront build with the Vue Storefront Magento 2 Integration and Storefront UI - GitHub - TidycodeIT/nuxt3-magento-sdk-storefront: A boilerplate storefront build with the Vue Storef...
Altamash
Altamash•10mo ago
Thank you so much for your reply @rohrig sir i have already install vue storefront and connect with magento
after that i want to a new shop page in that so what can i do for that
rohrig
rohrig•10mo ago
If you scroll down to the bottom of the quick start page here: https://docs.vuestorefront.io/integrations/magento/getting-started/quick-start you will see an example of fetching products.
Vue Storefront Docs
Quick start
Your Vue Storefront application has two parts:
Altamash
Altamash•10mo ago
getting this error
No description
Altamash
Altamash•10mo ago
i am creating new header file for my custom header als
rohrig
rohrig•10mo ago
you need to ensure the path does in fact lead to the sdk file
Altamash
Altamash•10mo ago
i not got any SDK file when i install vue storefront
rohrig
rohrig•10mo ago
how did you create the project?
Altamash
Altamash•10mo ago
No description
Altamash
Altamash•10mo ago
using this command npx @vue-storefront/cli@4.4.2 generate store
rohrig
rohrig•10mo ago
Ah I see. The docs I've linked are for the newer version. This command creates a store for using the previous version. I would recommend going through the guide I linked step-by-step
Altamash
Altamash•10mo ago
so first i install this right
rohrig
rohrig•10mo ago
That's one way to go. That way the SDK is already installed. But you're free to use any frontend app you like. Nuxt, Next Qwik. The SDK work in all of them.
Altamash
Altamash•10mo ago
ok
Altamash
Altamash•10mo ago
i am going right
No description
No description
Altamash
Altamash•10mo ago
error in that also
No description
rohrig
rohrig•10mo ago
did you run yarn install?
Altamash
Altamash•10mo ago
yes
rohrig
rohrig•10mo ago
🤔 let me check it out real quick, one sec
Altamash
Altamash•10mo ago
ok sir
rohrig
rohrig•10mo ago
It's working fine for me. Did you run yarn install from the root directory of the project?
Altamash
Altamash•10mo ago
yes its right
No description
rohrig
rohrig•10mo ago
does it install cleanly without errors?
Altamash
Altamash•10mo ago
No description
rohrig
rohrig•10mo ago
Try upgrading your node version. Here's a guide to using node version manager: https://www.freecodecamp.org/news/node-version-manager-nvm-install-guide/ There also seem to be some issues with running it on windows. You can also try WSL, which I quite enjoyed when I was on windows.
freeCodeCamp.org
Node Version Manager – NVM Install Guide
In this article, I'll explain how you can install NVM, or Node Version Manager, on Windows, Linux, and Mac. What is NVM? Node Version Manager (NVM), as the name implies, is a tool for managing Node versions on your device. Different projects on your device may be using different versions
No description
rohrig
rohrig•10mo ago
In our docs
No description
rohrig
rohrig•10mo ago
Vue Storefront Docs
Magento Installation
Welcome to this Magento 2 installation guide! This guide will help you install Magento 2 on your local machine using our CLI.
Altamash
Altamash•10mo ago
which version is require for this
rohrig
rohrig•10mo ago
Do you mean node version?
Altamash
Altamash•10mo ago
yes
rohrig
rohrig•10mo ago
The package that was failing to install has >=16.17 listed.
Altamash
Altamash•10mo ago
ok i have 16.13.2 node version
rohrig
rohrig•10mo ago
Which, at first glance, appears to be less than 16.17, correct?
Altamash
Altamash•10mo ago
and how can i customize this page where i got this page path
No description
rohrig
rohrig•10mo ago
I don't recognize the page. Which project are you in? In any case, it's an application like any other.
Altamash
Altamash•10mo ago
ok
rohrig
rohrig•10mo ago
If it's a Nuxt 3 app, you can check the the Nuxt 3 documentation: https://nuxt.com/
Nuxt
The Intuitive Web Framework
Build your next Vue.js application with confidence using Nuxt. An open source framework under MIT license that makes web development simple and powerful.
Altamash
Altamash•10mo ago
thank you so much for giving me your beautiful time I will pray that God gives you a good and healthy life.😊 If there will be some further question then I will connect with you again.
rohrig
rohrig•10mo ago
sure thing 😄
Altamash
Altamash•10mo ago
sorry for again but try to install using CLI i got this error
No description
No description
rohrig
rohrig•10mo ago
are you using WSL? It looks like you're not 🤔 As the docs indicate, it won't work directly on widows. You first need to install WSL to use the command line.
Altamash
Altamash•10mo ago
ok