pyvuejs 0.2.2.post5

Pythonic Vue.js

pyvuejs

Install

using pip

pip install pyvuejs

from git

git clone https://github.com/eseunghwan/pyvuejs.git
cd pyvuejs
python setup.py install

Usage

create project with cli

python -m pyvuejs init

[output]
//=========== pyvuejs project init ===========//
AppName: 

move to project directory and start with cli

• default host = "0.0.0.0", port = 8000

python -m pyvuejs start

[output]
//=========== start pyvuejs app ===========//
Running on http://0.0.0.0:8000 (CTRL + C to quit)
[2020-07-17 18:46:40,927] Running on 0.0.0.0:8000 over http (CTRL + C to quit)

start command line options

• host only

python -m pyvuejs start 127.0.0.1

• port only

python -m pyvuejs start 9000

• both host and port

python -m pyvuejs start 127.0.0.1 9000

PVUE editing guide

pvue file is a single view file against with vue file

prefix(optional, default = "view")

• prefix defines pvue is view or component

<!-- if pvue is view -->
!prefix view
<!-- if pvue is component -->
!prefix component
<!-- if blank, consider as view -->

template(required)

• template block is shown part of pvue
• code style is very same as Vue.js

<template>
    <div id="app1">
        <!-- elements -->
        <p>{{ testVar }}</p>
        <!-- to use session values -->
        <p>{{ session.sharedVar }}</p>
        <button>click me!</button>

        <!-- if show components -->
        <component name="[componentName]" />
    </div>
</template>

model(required)

• model block is server-side part of pvue
• code style is python, it's sensitive to tabs

<model>
Model app1:
    # variables
    testVar = 10
    # to upload variable too session
    sharedVar:session = 30

    # compute methods
    @method
    # to use session, add "session" argument to function
    def sub_testVar(self, session):
        self.testVar -= 1

        # defined by ":session", use it without define to session in code
        print(session["sharedVar"])
</model>

• connect to vue properties
  • currently, computed and method are enable
  • add decorator on top of function

  @method
  def get_sample(self):
      self.sample = "It's sample!"
  

style(optional)

• style block is style part of template block

<style>
div#app1 {
    /* styles */
}
</style>

script(optional)

• script block runs in page
• custom events, attributes can be set in script block

<script>
    /* scripts */
</script>

Todo

• enable componenting(V 0.2.0)
  • component properties
• multi locational data binding(V 0.2.0)
• dataSession (V 0.2.0)
• add vue properties
  • method (V 0.1.0)
  • computed (V 0.2.0)

License

pyvuejs is MIT license

Release History

• V 0.1.0 [2020/07/17]
  • initial commit

• V 0.2.0 [2020/07/18]

  • enable componenting
  • multi locational data binding
  • add computed binding
  • dataSession

• V 0.2.1 [2020/07/19]

  • change decoration as "@method", "@compute"
  • multi locational strategy changed to IP from idGeneration

• V 0.2.2 [2020/07/19]

  • bug fixes
  • parsing errors if model block is empy

• V 0.2.2.Rev1 [2020/07/19]

  • bug fixes
  • show default favicon correctly

• V 0.2.2.Rev2 [2020/07/20]

  • remove "Variable" model
  • change component's default size to 100% of parent

• V 0.2.2.Rev3

  • depricated
  • revoke changes and upgrade to Rev4

• V 0.2.2.Rev4 [2020/07/20]

  • variables can upload to session by adding ":session" when it's definition
  • session variables can be used in template by calling "sesssion" dictionary

• V 0.2.2.Rev5 [2020/07/20]

  • change component parsing logic
  • component tag format changed to "<component name="[componentName]" />"