pyvuejs 0.4.0

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 create-project --name=sample_project

[console output]
[pyvuejs | 2020-07-28T23:27:49Z] INFO: Creating pyvuejs project...
[pyvuejs | 2020-07-28T23:27:49Z] INFO: Extracting template files...
[pyvuejs | 2020-07-28T23:27:49Z] INFO: Project "sample_project" is ready!

manage apps with cli

• main app cannot be removed

<# create #>
python .\manage.py create-app --name=sample_app

[console output]
[pyvuejs | 2020-07-28T23:28:23Z] INFO: Creating pyvuejs app...
[pyvuejs | 2020-07-28T23:28:23Z] INFO: Extracting template files...
[pyvuejs | 2020-07-28T23:28:23Z] INFO: App "sample_app" is ready!

<# remove #>
python .\manage.py remove-app --name=sample_app

[console output]
[pyvuejs | 2020-07-28T23:28:55Z] INFO: Removing app "sample_app"...
[pyvuejs | 2020-07-28T23:28:55Z] INFO: App "sample_app" removed!

start project with cli

• default host = "0.0.0.0", port = 8000
• both host and port are positional arguments

python .\manage.py start --host=127.0.0.1 --port=8000

[console output]
[pyvuejs | 2020-07-28T23:31:45Z] INFO: Preparing server...

[pyvuejs | 2020-07-28T23:31:45Z] INFO: Setting routing points...
[pyvuejs | 2020-07-28T23:31:45Z] INFO: Setting view/component points...
[pyvuejs | 2020-07-28T23:31:45Z] INFO: Setting function points...
[pyvuejs | 2020-07-28T23:31:45Z] INFO: finished

[pyvuejs | 2020-07-28T23:31:45Z] INFO: Interpreting project "sample_project"...

[pyvuejs | 2020-07-28T23:31:45Z] INFO: Interpreting app "main"...
[pyvuejs | 2020-07-28T23:31:45Z] INFO: Interpreting pvue file...
[pyvuejs | 2020-07-28T23:31:45Z] INFO: finished
[pyvuejs | 2020-07-28T23:31:45Z] INFO: Interpreting models...
[pyvuejs | 2020-07-28T23:31:45Z] INFO: Model mainApp loaded
[pyvuejs | 2020-07-28T23:31:45Z] INFO: finished

[pyvuejs | 2020-07-28T23:31:45Z] INFO: Linking static to server...
[pyvuejs | 2020-07-28T23:31:45Z] INFO: finished

[pyvuejs | 2020-07-28T23:31:45Z] INFO: Project is ready!

[pyvuejs | 2020-07-28T23:31:45Z] INFO: Server started on "http://127.0.0.1:8000/"
[pyvuejs | 2020-07-28T23:31:45Z] INFO: Please check Devtool to show data transfers
Running on http://0.0.0.0:8000 (CTRL + C to quit)

[web console output]
[pyvuejs | 2020-07-28T23:32:40Z] INFO: Model 127.0.0.1/main/mainApp created
[pyvuejs | 2020-07-28T23:32:40Z] INFO: View 127.0.0.1/main loaded

start project standalone mode

• switch mode to standalone
• host and port options are available
• using pycefsharp

python .\manage.py start --host=127.0.0.1 --port=8000 --mode=standalone

[console output]
[pyvuejs | 2020-07-28T23:38:37Z] INFO: Start server on background...
[pyvuejs | 2020-07-28T23:38:37Z] INFO: Setting up webview...
[pyvuejs | 2020-07-28T23:38:37Z] INFO: Webview is loaded
Running on http://0.0.0.0:8000 (CTRL + C to quit)
[pyvuejs | 2020-07-28T23:39:26Z] INFO: Shutting down background server...

[pycefsharp console output]
[0728/233838.805:INFO:CONSOLE(14)] "[pyvuejs | 2020-07-28T23:38:38Z] INFO: Model 127.0.0.1/main/mainApp created", source: http://127.0.0.1:8000/static/pyvuejs.utils.js (14)
[0728/233838.806:INFO:CONSOLE(14)] "[pyvuejs | 2020-07-28T23:38:38Z] INFO: View 127.0.0.1/main loaded", source: http://127.0.0.1:8000/static/pyvuejs.utils.js (14)

stop server from cli

• server can be closed by cli

python .\manage.py stop

[server console output]
[pyvuejs | 2020-07-28T23:43:35Z] INFO: Server is shutting down...

VIEW editing guide

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 -->
        <pvue-component endpoint="[componentName]"></pvue-component>
    </div>
</template>

resources(optional)

• resources block loads app's static files
• app's static url is "/app"

<resources>
    <!-- css -->
    <link rel="stylesheet" href="/app/[staticFileName]">
    <!-- js -->
    <script type="text/javascript" src="/app/[staticFileName]"></script>
</resources>

style(optional)

• style block is style part of template block

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

Model editing guide

• Model base class is in pyvuejs.models
• bindings are in pyvuejs.binders

from pyvuejs.models import Model
from pyvuejs.binder import model_variable, event, method

class mainApp(Model):
    """variables
    - model_variable: variable for model locally
    - session_variable: variable for session(global)
    """
    username:str = model_variable("")

    """events
    - load: when model init
    - show: when view show
    """
    @event("load")
    def onload(self):
        print("hello, pyvuejs!")

    """methods
    any method in Model decorated "method"
    """
    @method
    def change_username(self):
        self.username = "pyvuejs"

Todo

• enable componenting(V 0.2.0)
  • component properties
• multi locational data binding(V 0.2.0)
• dataSession (V 0.2.0)
• sync variables during method runs
  • only session available
• add vue properties
  • method (V 0.1.0)
  • [x] computed (V 0.2.0)
    • removed (V 0.4.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]" />"

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

  • move multi locational strategy to initial viewpoints
  • add event bind decoration as "@event"
    • currently only support for "load", "show" event
  • enabled to import python modules in app's directory
    • base directory of modules is plugins

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

  • change pyvuejs object to class with constructor
  • bug fixed
    • pyvuejs calls other view's models also

• V 0.3.0 [2020/07/21]

  • change backend server to flask from quart
  • changes in requirements.txt
  • bug fixed
    • session datas are not sync from view to model

• V 0.3.0.Rev1 [2020/07/21]

  • bug fixed
    • session datas changed in vue model are not sync to model

• V 0.3.1 [2020/07/21]

  • cli changed
    • "init" command is available from module cli
    • "run", "stop", "create", "remove" commands are moved to manage.py
  • logger added
    • server logs server-side loggings only
    • client(web) logs client-side loggings only

• V 0.3.2 [2020/07/22]

  • standalone mode added
    • use PySide2 WebEngineView as UI
  • "logging" option added
    • if enable, server log to console
    • if not, server doesn't log to console

• V 0.3.2.Rev1 [2020/07/22]

  • webview window can be invoked from model with name webview

• V 0.3.2.Rev2 [2020/07/22]

  • bug fixed
    • multiple session datas upload correctly

• V 0.3.3 [2020/07/22]

  • bug fixed
    • model's native functions got erros during interpreting
  • add pyvue-component tag and change component to pyvue-component
    • format change to normal html format, "<pyvue-component endpoint="componentName">"
  • webview attribute changed to appView
  • creating a new WebView window is available from model

• V 0.3.3.Rev1 [2020/07/22]

  • bug fixed
    • decorator text was miss-parsed

• V 0.3.4 [2020/07/22]

  • change UI module from PySide2 to pycefsharp
    • appView can be invoked, too

• V 0.4.0 [2020/07/28]
  • change structure of project
    • project now managed by app
      • app has single view.html file
      • app can has multiple models in models.py
    • project information managed by .config file
  • cli changed
    • cli provides as follows
      • create-project
      • create-app
      • remove-app
      • start
      • stop