Getting started with docker
Easiest way is to use docker repo from https://github.com/odoogap/vuestorefront-docker.git and get both servers running then stop the one you will use to develop on the backend or on the frontend.
# Create a test folder
mkdir ~/test
# Clone Vuestorefront docker repo
$> git clone --branch 16.0 --recurse-submodules https://github.com/odoogap/vuestorefront-docker.git ~/test/vuestorefront-docker
$> cd ~/test/vuestorefront-docker
$> docker-compose up --build -d
# You might want to check what happens under the hood
$> docker-compose logs -fYou will need to wait a bit, while Odoo creates a new database and installs the graphql_vuestorefront module.
How to setup Vue Storefront on your local
Considering you are a frontend Nuxtjs./Vue.js developer, now you have Odoo/PostgreSql/Redis running on docker and you can use it while you code on your laptop. You just need to stop vsf container and run it directly on your local.
# Stop Vuestorefront container only
$> docker-compose stop vsf
# Start with Vuestorefront odoo template
$> git clone --branch main --recurse-submodules https://github.com/vuestorefront-community/template-odoo.git ~/test/vuestorefront-template
$> cd ~/test/vuestorefront-template
# create the .env file (we use use environment variables in production)
$> cp .env.example .envEdit the .env file and make it look like this:
NODE_ENV=production
PORT=3000
NODE_LOCALE=en-US
HOST=127.0.0.1
REDIS_ENABLED=true
REDIS_HOST=127.0.0.1
REDIS_PORT=6379
REDIS_DATABASE=0
NUXT_TELEMETRY_DISABLED=1
BASE_URL=http://localhost:8069/
SITE_URL=http://localhost:3000/
NODE_API_BASE_URL=http://localhost:3000/api/If you need you can disable Redis using REDIS_ENABLE=false and also NODE_ENV=development for extended logging. Now you can fire it up with:
# install dependencies
$> yarn install
# generate routes and redirects from ODOO
$> yarn update:routes
$> yarn update:redirects
# serve with hot reload at localhost:3000
$> yarn dev
# build for production and launch server
$> yarn build
# build local
$> yarn build:localHow to setup Odoo server on your local
I’m considering you are an Odoo developer
Same way as referred on top, we will now stop Odoo server and run it on our local as VueStorefront container is querying http://localhost:8069. OR you just use the http://localhost:8069/graphiql/vsf to test the endpoints you are creating.
# Stop Vuestorefront container only
$> docker-compose stop odoo
$> git clone --branch 16.0 --recurse-submodules https://github.com/odoogap/vuestorefront.git ~/test/vuestorefront-addons
# Activate Virtual Environment (I assume you have it already)
source ~/envs/16.0/bin/activate
# Run Odoo considering Odoo is cloned at ~/git/odoo/16.0
~/git/odoo/16.0/odoo-bin --addons-path ~/git/odoo/16.0/addons/,~/test/vuestorefront-addons -d v16_vsf -i graphql_vuestorefrontCheck what happens inside Redis
If you want check what happens inside Redis, just use the following command:
# Redis
docker exec -it redis redis-cli
# You will get this prompt
127.0.0.1:6379>
# Now try listing the keys (learn more at: https://redis.io/commands/ )
127.0.0.1:6379> keys *Check it out on Youtube
If you still have doubts just check our Youtube Video:
If you need help with your Vue Storefront project just reach out, we can help with both Odoo or Nuxt.js / Vue.js side.
Contact us!
