Versalearn Web Client

Versatile AI ready for assistance.

Setup

Make sure to install the dependencies:

# npm
npm install

# pnpm
pnpm install

# yarn
yarn install

Start the development server on http://localhost:3000:

# npm
npm run dev

# pnpm
pnpm run dev

# yarn
yarn dev

Build the application for production:

# npm
npm run build

# pnpm
pnpm run build

# yarn
yarn build

Locally preview production build:

# npm
npm run preview

# pnpm
pnpm run preview

# yarn
yarn preview

Check out the deployment documentation for more information.

Put the logic on the page level not the component level. Use slot to put the logic from outside the component (page level).
What can be included inside components is property and style, not the logic.
Reusable component can be achieved by nesting smaller components inside larger component.
Only use store if the state is gonna be used in multiple files.

Disable adblocker as it would throw a cannot load module warning. Making your variable/function null or undefined. reference
For data fetching, use $fetch in client side and useFetch in server side. This is because $fetch will be performed twice if it used in components without wrapper (not inside a function)
Composables is run both in server and client.

The code execution order in nuxt application:

Main structure of response contains serveral main keys:

let response: {
    status: number,
    context: object,
    content: object
}