Top

Nuxt Documentation

Fastkart offers stunning and one-of-a-kind website demos tailored to your grocery, bakery, and online store needs. With Fastkart, you'll find everything you require to craft the ideal website for your business. Fastkart - your all-in-one solution!

Getting Started

How to start

Welcome to Nuxt! Nuxt helps you build modern applications for the web, mobile, or desktop.

For getting started a Nuxt application you needs two things as Prerequisites.

Prerequisites

For getting started a Nuxt application you needs two things as Prerequisites.

  • Before you begin, make sure your development environment includes Node and an npm package manager.
  • Node.js

    1. Download latest version of node.js from nodejs.org. 20.9.0
    2. Install Node.js using downloaded file
    3. To check your node version, run node -v in a terminal/console window.

    Npm package manager

    1. Nuxt CLI, and Nuxt apps depend on features and functionality provided by libraries that are available as npm packages. To download and install npm packages, you must have an, you must have an npm package manager.
    2. This Quick Start uses the npm client command line interface, which is installed with Node.js by default. To check that you have the npm client installed, run npm -v in a terminal/console window.
    3. For better understanding Nuxt we suggest you to once go through official documentation of Nuxt from Nuxt Docs.

    Nuxt setup

    If you want Fastkart theme setup then directly follow next Fastkart setup section

    Create Initial application

    1. Run the command react create and provide the name my-app, as shown here:
    2. npx nuxi@latest init my-app 
    3. The nuxt new command prompts you for information about features to include in the initial app project. Accept the defaults by pressing the Enter or Return key.

    Serve Application

    1. Go to the workspace folder (my-app).
    2. cd my-app 
    3. Install the dependencies:
    4. npm install 
    5. Launch the server by using command npm run dev
    6. npm run dev 

    Fastkart setup

    If you have already download and install node.js ignore prerequisites accordingly.

    Node.js

    1. Download latest version of node.js from nodejs.org.
    2. Install Node.js using downloaded file
    3. To check your node version, run node -v in a terminal/console window.

    Setup Fastkart template by

    1. Download and extract an Fastkart template from themeforest
    2. Extract it and then go in to theme folder.
    3. cd theme
    4. Import all dependency by installing npm command
    5. npm install
    6. Now you are in stage to successfully run Fastkart using below command:
    7. npm run dev

    Once you serve your application by default it will take their defalult port so you can open port using localhost:3000

    Make sure you are not running any other nuxt project in local if so then use new generated port from terminal with label called app running at:

    Setup environments

    You must need to setup environment url If you using different port you need configure in HandleRequest.js file

    For example your local server url is http://localhost:3000/ then your environment URL should be like http://localhost:3000/assets/data

    Note:- We are using mock json data that's why we have configured url using like this http://localhost:3000/assets/data if you are using Your Api then you can change accordingly as per your requirement

    You must need to setup environment url If you using different port you need configure in HandleRequest.js file

    export const HandleRequest = (url, { method = "get", key, cache = false, ...options }) => {
        return useFetch(url, {
        baseURL: 'http://localhost:3000/api/',
        headers: GetHeaders(),
        ...options,
        method,
        key,
        onResponse(context) {
        options.onResponse && options.onResponse(context);
        }
      })
    }
    
                          

    Use environment

    import { HandleRequest } from "~~/composables/HandleRequest";
    
      export const useDataStore = defineStore("data-store", () => {
       let  Products = ref([]),
       
       const GetAllProduct = async () => {
        HandleRequest('product', {
          key: 'getAllProductsInStore',
          onResponse({ response }) {
            Products.value = response._data;
          }
        })
      };
    
      })
    
    }
    Some Common solution if you do not run project successfully
  • Use Latest Version of node.js
  • Remove node_module and package-lock.json file and again do npm install
  • You can again download theme from themeforst and then again run
  • Then also if you don't solve issue you can generate a ticket.
  • Build Application

    1. Build you application for host on server using below command:
    2. npm run build