Giter VIP home page Giter VIP logo

vue's Introduction

vue

GoDoc

Package vue is the progressive framework for WebAssembly applications.

Install

GOARCH=wasm GOOS=js go get github.com/norunners/vue

Requires Go 1.12 or higher.

Goals

  • Provide a unified solution for a framework, state manager and router in the frontend space.
  • Leverage templating to separate application logic from frontend rendering.
  • Simplify data binding to ease the relation of state management to rendering.
  • Encourage component reuse to promote development productivity.
  • Follow an idiomatic Go translation of the familiar Vue API.

Hello World!

The main.go file is compiled to a .wasm WebAssembly file.

package main

import "github.com/norunners/vue"

type Data struct {
	Message string
}

func main() {
	vue.New(
		vue.El("#app"),
		vue.Template("<p>{{ Message }}</p>"),
		vue.Data(Data{Message: "Hello WebAssembly!"}),
	)

	select {}
}

The index.wasmgo.html file fetches and runs a .wasm WebAssembly file.

<!doctype html>
<html>
    <head>
        <meta charset="utf-8">
        <script src="{{ .Script }}"></script>
    </head>
    <body>
        <div id="app"></div>
        <script src="{{ .Loader }}"></script>
    </body>
</html>

Note, the example above is compatible with wasmgo.

Serve Examples

Install wasmgo to serve examples.

go get -u github.com/dave/wasmgo

Serve an example locally.

cd examples/01-declarative-rendering
wasmgo serve

Status

Alpha - The state of this project is experimental until the common features of Vue are implemented. The plan is to follow the Vue API closely except for areas of major simplification, which may lead to a subset of the Vue API. During this stage, the API is expected to encounter minor breaking changes but increase in stability as the project progresses.

F.A.Q.

Why Vue?

One of the common themes of existing frameworks is to combine component application logic with frontend rendering. This can lead to a confusing mental model to reason about because both concerns may be mixed together in the same logic. By design, Vue renders components with templates which ensures application logic is developed separately from frontend rending.

Another commonality of existing frameworks is to unnecessarily expose the relation of state management to rendering in the API. By design, Vue binds data in both directions which ensures automatic updating and rendering when state changes.

This project aims to combine the simplicity of Vue with the power of Go WebAssembly.

License

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.