- Configuring Nuxt. Before building the image, you have to change a little bit in.env nuxt file. Find HOST declaration. Just replace 127.0.0.1 (or localhost) for name of your service declared in docker-compose.yml. In that way an internal Docker address wil be passed to your Nuxt.js. You are ready to build and test your docker image.
- Before we start with our Nuxt Js Cheat Sheet, lets learn about Nuxt. Nuxt.js is a free and open source web application framework based on Vue.js, Node.js, Webpack and Babel.js. The framework is advertised as a 'meta-framework for universal applications' Lets look at some of the essentials in Nuxt.
The Ultimate Nuxt.js Cheat Sheet. In this article, we will looking into some of the Nuxt essential and how we can use them in our application. Itβs advisable to understand the basic of Vuejs before moving into Nuxt js. Before we start with our Nuxt Js. The Ultimate Nuxt.js Cheat Sheet. In this article, we will looking into some of the Nuxt essential and how we can use them in our. The open-source frontend for any eCommerce. Built with a PWA and headless approach, using a modern JS stack. We have custom integrations with Magento, commercetools, Shopware and Shopify and total coverage is just a matter of time.
How do you use Nuxt together with the Composition API? In this tutorial, we take a quick look on how to integrate the API with the help of the 'nuxt-composition-api' module.
Table of Contents
Introduction
Note: This quick tutorial is for developers familiar with the basics of Nuxt.js. I recommend skimming through the Composition API specification first. Please note that using the API in production is not recommended
1. QuickStart Vue 3 Composition API with the nuxt-composition-api
module
As usual, we start with a fresh Nuxt project.
Nuxt modules give you the ability to extend your app with additional plugins and configuration options across different projects. Luckily @danielroe π has created a module to get started quickly with the Vue Composition API.
nuxt.config.js
π That's it, we've already finished the API integration.
So, what's happening here exactly?
- The module installs
@vue/composition-api
into the Nuxt plugin context. This means you can use the API everywhere in your app without manual integration of any additional plugins.
Further, you can make use of some useful functions:
useFetch
for asynchronous data-fetching andwithContext
to access the Nuxt.js context easily.
You can find additional information on the nuxt-composition-api
GitHub page.
2. Install @vue/composition-api
as a plugin
Naturally, we can integrate the Composition API as a plugin too. Please note that you have to handle fetch and context management yourself.
- plugins/composition-api.js
Please let me know if you're interested in reading more on the new Vue Composition API.
Nuxt Js Cheat Sheet 2019
Further reading
Install Nuxt Js
Vue 3 Cheat Sheet
Vue composition API
Composition API on github