Quick Start

Installation

To create a new Olovajs project with Vilo, you can use the following command:

npm create vilo@latest

OR

# npm 7+, extra double-dash is needed:
npm create vilo@latest my-vilo-project -- --template olova

Running Your Project

After creating your Olovajs project, you can start the development server by running:

npm run dev

Additional Commands

• Vilo also provides other commands to help manage and build your project. Here are a few examples:

• Build for Production: Use npm run build to compile and optimize your project for production. Preview Production Build: Run npm run preview to preview the production build locally.

Getting Started with CDN

Include the Olova Library

You can easily include Olova in your project using a CDN link. Just add the following script tag to your HTML file:

// Here's the correct import statement for CDN usage
import { createApp } from "//unpkg.com/olova";

Create Your First App

Here’s a simple example to create a reactive counter application using Olova:

<div id="app">
  <template>
    <button @click="increment">{ count }</button>
  </template>
</div>

<script type="module">
  import { createApp } from "//unpkg.com/olova";

  const app = createApp({
    data: {
      count: 0,
    },
    methods: {
      increment() {
        this.count++;
      },
    },
  });
  app.mount("#app");
</script>

Future Enhancements

In the future, we will introduce a build method that allows you to optimize your Olova applications using Vite. This will enable you to create production-ready builds effortlessly while leveraging modern JavaScript features and tools.

For now, you can start building with Olova using the CDN, and keep an eye out for updates regarding the build method integration!

Conclusion

You are now set up to start developing applications with Olova! Explore the features, and build dynamic, reactive web applications easily. Stay tuned for more updates, including the upcoming build method with Vite for enhanced development workflows.