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
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...
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
after that i want to a new shop page in that so what can i do for that
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.
getting this error
i am creating new header file for my custom header
als
you need to ensure the path does in fact lead to the sdk file
i not got any SDK file when i install vue storefront
how did you create the project?
using this command
npx @vue-storefront/[email protected] generate store
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
so first i install this right
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.
ok
i am going right
error in that also
did you run
yarn install
?yes
🤔 let me check it out real quick, one sec
ok sir
It's working fine for me. Did you run
yarn install
from the root directory of the project?yes its right
does it install cleanly without errors?
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
In our docs
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.
which version is require for this
Do you mean node version?
yes
The package that was failing to install has >=16.17 listed.
ok i have 16.13.2 node version
Which, at first glance, appears to be less than 16.17, correct?
and how can i customize this page where i got this page path
I don't recognize the page. Which project are you in? In any case, it's an application like any other.
ok
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.
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.
sure thing 😄
sorry for again
but try to install using CLI i got this error
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.
ok