Sample Project

The WireBootstrap for Vue.js solution includes a sample project that demonstrates how to use WireBootstrap in Vue.js applications.

The following sections detail the main parts of the sample project.

Public Directory

The public directory contains the static run-time elements of a Vue.js application. This directory is the root directory serving the application to a web browser.

index.html

index.html is the page that contains the root Vue.js element and, once rendered, the hierarchy of child elements within.

Sample Data

The sample data used in the project is in a JSON file located at \data\sample-data.json. The objects that expose this data to components is located in the source code directory.

theme

The sample project uses a simple Bootstrap theme from Colorlib. These assets are located in the \theme directory.

Source Code

The entry point for the Vue.js application is at \src\main.js.

There are several data functions that serve the sample data to components. These functions are located at \src\sample-data.js.

Directive

The source code for the WireBootstrap Vue Directive is at \src\WireConfigDirective.js.

Components

Also stored in the \src directory are the components used to demonstration the different ways in which the WireBootstrap Vue Directive can be used within Vue.js applications.