A single module to link Python ecosystem to the Web

Overview

Maintenance made-with-python PyPI version shields.io Documentation Status PRs welcome Donate

A single module to link Python ecosystem to the Web. Have a quick look at the Gallery first to get convinced !

FAQ For any questions, please use Stackoverflow with the tag Epyk we will be happy to answer (unfortunately we cannot yet create tags in this platform)

This project is in active and constant improvement so do not forget to run the below command to always get the latest version install.

pip install epyk --upgrade

Presentation

About the project


We started the implementation of Epyk already few years ago in order to help Python developers (from beginner to advanced) to present their work to clients or colleagues. At this time there were only few packages in Python available and it was quite difficult for people to move to web technologies like JS, HTML and CSS.

With this idea we started to create Epyk, a kind of transpiler which is dedicated to assist from Python the developers to develop rich web UI. It will try, thanks to the autocompletion provided by the library, to familiarise the developer / data scientist in the wording of web technologies. Indeed we tried as much as possible to keep the same naming convention for CSS attributes and Javascript function to simplify the review of the transpiled HTML page if needed.

Today Epyk is a bit more than a transpiler as it will encompass more than 100 JavaScript and CSS modules.

Most of the popular web libraries (JQuery, Bootstrap, ApexCharts, ChartJs, Tabulator, AgGrid...) are available from the Epyk components. The resulting page transpiled will only import the ones needed for the selected components.

Library's target


Epyk's is to ensure the implementation of a coherent system using a minimum of layers. With Epyk the user stays in the Python layer to drive and optimize the data transformation. This Framework also encourages the implementation of Micro services and cloud based architecture.

The full documentation is available on Read the Docs

In the Template Repository lot of examples are available to run as static pages or with underlying Python servers:

_ fastapi_viewer.py: A simple interactive web page to display data from pandas_datareader.

  • fastapi_viewer_logs.py: An interactive web page to display log messages based on user inputs/filters
  • fastapi_webscraping.py: An example of report extracting data from a website to analyse the prices
  • fastapi_db.py : An App to display documentation and allow a versioning in a SqLite database.

Also a Gallery is available to get more visible results

Quickstart

For people impatient to understand the concept, you can test the below minimalist dashboard.

Install Epyk

pip install epyk

The below code will create a simple interactive dashboard relying on internal mock data.

import epyk as pk

# Just to get mock data to test
from epyk.tests import mocks

page = pk.Page()
page.headers.dev()

js_data = page.data.js.record(data=mocks.languages)
filter1 = js_data.filterGroup("filter1")

select = page.ui.select([
  {"value": '', 'name': 'name'},
  {"value": 'type', 'name': 'code'},
])

bar = page.ui.charts.chartJs.bar(mocks.languages, y_columns=["rating", 'change'], x_axis='name')
pie = page.ui.charts.chartJs.pie(mocks.languages, y_columns=['change'], x_axis='name')
page.ui.row([bar, pie])

select.change([
  bar.build(filter1.group().sumBy(['rating', 'change'], select.dom.content, 'name')),
  pie.build(filter1.group().sumBy(['change'], select.dom.content, 'name')),
])

More information in the doc Getting started with Epyk

Compatibility

No dependency hence the library can be integrated to any existing Python project

Epyk is compatible with the most common Web Python Frameworks (Flask and Django). By default, the server package embeds a Flask app as it is easier to install and ready to use.

The Framework can be included within a Jupyter or JupyterLab project. But this will lead to some limitations - for example Ajax and Socket will not be available.

The generated Web pages are compatible with the common modern web frameworks.

But the target is to be full stack developers and be flexible enough to integrate our UI pages to any existing ecosystem. Thus some outs features are available to wrap page to be visible on any server.

This encourages the collaboration and breaks the IT silos. It can fully work in an Agile way of working as developers, business analysts, product owners and users can work on the same stack and improve directly the final product. Any work done on the side within Jupyter or standalone Python scripts can be easily integrated !

Epyk can be integrated to any Python web servers and can be linked to JavaScript web framework. It is collaborative library focusing on the data transformation and promoting the team collaboration.

Have a look at the Design and Architecture documentation to get more details.

Usage

First install Epyk to your Python environment

From static pages


pip install epyk

Create a report and change CSS3 or add JavaScript events.

import epyk as pk

page = pk.Page()
page.headers.dev()

button = page.ui.button("Click me")
button.style.css.color = "red"
button.click([
    page.js.console.log("log message")
])
.... 

# Then to produce the html page
page.outs.html_file(path="/templates", name="test")

Using a web server


Go to the next level and add real time flux in few lines or code. Epyk allows to integrate concepts of Reactive programming thanks to Python 3 and asyncio. All the features available in JavaScript (socket, websocket, observable ...) can be used as long as the underlying webserver is compatible.

If the underlying web server is not compatible with those modern features, Ajax (post, get...) are also available. More examples are available in the []template / interactive](https://github.com/epykure/epyk-templates/tree/master/interactives) section.

On the client side

page = Report()
page.headers.dev()

socket.connect(url="127.0.0.1", port=3000, namespace="/news")
input = rptObj.ui.input()

pie = rptObj.ui.charts.chartJs.polar([], y_columns=[1], x_axis="x")

container.subscribe(socket, 'news received', data=socket.message['content'])
pie.subscribe(socket, 'news received', data=socket.message['pie'])

rptObj.ui.button("Send").click([
  socket.emit("new news", input.dom.content)
])

page.outs.html_file(path="/templates", name="socket_example")

On the server side (using socketio)

from flask import Flask, render_template_string
from flask_socketio import SocketIO, emit

app = Flask(__name__)

app.config['SECRET_KEY'] = 'secret!'
socketio = SocketIO(app)

 
@socketio.on('new news', namespace='/news')
def new_news(message):
  values = getSeries(5, 100)
  result_pie = chart_data.chartJs.y(values, [1, 4, 5], 'g')
  emit('news received', {"content": message, 'pie': result_pie}, broadcast=True)

From Notebooks


We maintain a separate Github repository of Jupyter Notebooks that contain an interactive tutorial and examples:

https://nbviewer.jupyter.org/github/epykure/epyk-templates-notebooks/

To launch a live notebook server with those notebook using binder click on one of the following badge:

Binder

More examples are available on the official repository

Coming soon

Epyk Studio is a rich and collaborative framework to simplify the use of this library with bespoke configuration / styles. You can start downloading it here or contribute to the project on the Github repository. This is still under development hence it is not yet official released

Feedback and Contribution

See CONTRIBUTING.md

Please get in touch if there is any feature you feel Epyk-UI needs.

Donate

Want to donate? Feel free. Send to blockchain

Comments
  • Bug in css for button

    Bug in css for button

    It looks like the button references the base name of the css class instead whereas the class is declared as the css class name suffixed with the htmlId.

    For instance:

    Whereas the styles are declared as such:

    .cssbuttonbasic_button_2051657361000 {font-weight: bold ;padding: 1px 10px ;margin: 2px 0 2px 0 ;text-decoration: none ;border-radius: 5px ;white-space: nowrap ;display: inline-block ;-webkit-appearance: none ;-moz-appearance: none ;border: 1px solid #1b5e20 ;color: #000000 ;background-color: #FFFFFF ;} .cssbuttonbasic_button_2051657361000:hover {text-decoration: none ;cursor: pointer ;background-color: #1b5e20 ;color: #e8f5e9 ;} .cssbuttonbasic_button_2051657361000:focus {outline: 0 ;} .cssbuttonbasic_button_2051657361000:disabled {cursor: none ;background-color: #1b5e20 ;color: #43a047 ;font-style: italic ;}

    bug 
    opened by epykachu 3
  • Add api folder in the root

    Add api folder in the root

    Add dedicated API folder in order to simplify the structure object and not always use dictionaries.

    This might help on transparency and also ensure a good structure of the input data.

    question 
    opened by epykure 2
  • Add banners for sponsor

    Add banners for sponsor

    Create new new interface in banners components to add sponsors in a simple way.

    The component should have title, content and a list of sponsors defined in the following repository. https://github.com/epykure/ressources/tree/master/logos

    Ideally the pictures should be downloaded when this component is used.

    opened by epykure 1
  • Slight change in how the css classes get added

    Slight change in how the css classes get added

    Hello, in the Html.py module I have changed the order of the pyClassNames so that the latest added classes get precedence in the css world:

    elif pyClassNames is not None:
      pyClsNames = [cls.get_ref() if hasattr(cls, 'get_ref') else cls for cls in pyClassNames['main']][::-1]
    

    this fixes an issue whereby all the classes that were defined previously would take precedence over the newly defined attributes.

    Let me know if there's a cleaner to achieve this.

    question 
    opened by epykachu 1
  • Create feature to check if a component is visible

    Create feature to check if a component is visible

    Add some feature to make this available: https://stackoverflow.com/questions/5353934/check-if-element-is-visible-on-screen

    An example https://jsfiddle.net/t2L274ty/1/

    enhancement 
    opened by epykure 1
  • Remove the force of the html folder when we output an html file

    Remove the force of the html folder when we output an html file

    I think we should remove the fact that we force the output to go to an html folder when the user specifies a path, if he doesn't then no problem, but if he does then that path should be where the file is created.

    enhancement question 
    opened by epykachu 1
  • Review the CSS Framework

    Review the CSS Framework

    Totally review the design of this module in order to add flexibility and to make it more user friendly.

    All the CSS attributes and classes should be statically defined

    bug 
    opened by epykure 1
  • Add Vignet Video

    Add Vignet Video

    This is a nice task for a first issue into the project.

    We would need to add a vignet video component.

    You can refer to the vignet components as it should exactly the same code structure.

    The reference is in epyk.core.components.CompVignets.image.

    You need the same signature and instead of an image component inside the method you would need a video component found in CompMedia.Media instead of CompImages.Images.

    enhancement good first issue 
    opened by epykachu 0
  • Add hierarchy of components

    Add hierarchy of components

    It might be good to add htmlItems to any components in order to be able to know the children of a main components.

    This could be useful in the Bootstrap extension (or in the composite items) when we are changing a style or replacing a CSS class.

    Once this will be available the module BsStyle.py can be updated accordingly

    enhancement 
    opened by epykure 0
  • Make the utf8 -> html code automatic

    Make the utf8 -> html code automatic

    Try to make the conversion from utf8 to html code for the display in the UI less manual.

    The mapping is done here: PyExt.py but maybe there is a better way to do it

    UTF8_TO_HTML = { b'\xe2\x80\x99': "'", b'\xe2\x81\x80': entities.EntUtf8.CHARACTER_TIE, b'\xe2\x81\x81': entities.EntUtf8.CARET_INSERTION_POINT, b'\xe2\x81\x82': entities.EntUtf8.ASTERISM, b'\xe2\x81\x83': entities.EntUtf8.HYPHEN_BULLET, b'\xe2\x81\x84': entities.EntUtf8.FRACTION_SLASH,

    opened by epykure 0
  • Add Arrow functions

    Add Arrow functions

    Create in the module JsFncs.py a class Arrows() which will allow the definition of arrow functions

    https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/Arrow_functions

    Also add a decorator to specify that this function is not compatible for Internet Explorer.

    enhancement 
    opened by epykure 0
Releases(1.6.2)
  • 1.6.2(Sep 7, 2021)

    This release brings lot of bug fixes and a link with popular external web frameworks.

    • Integrate Moment library to the ase Javascript features.
    • Improve documentation.
    • Jquery UI shortcut in the Web frameworks.
    • Toast Framework (first version).
    • Add column style for fields.
    • Add Bootstrap Dominus Tempus.
    • New vega chart libs.
    • Add leaflet event object.
    • Add JavaScript Fetch API.

    More details available in the changelog file.

    Source code(tar.gz)
    Source code(zip)
    epyk-1.6.2-py2.py3-none-any.whl(3.03 MB)
  • 1.5.0(Apr 5, 2021)

    [1.5.9] - 2021-04-05

    Added

    • Add input number styles.
    • Add fields.number interface.
    • Add XMLHttpRequest timeout.
    • Add data apexCharts shortcut for events.
    • Add new input data in data_urls (owid repo)
    • Add trigger shortcut to dom property.
    • Add Poller components.
    • Add CSS calc for width.
    • Add more and filter button.
    • Add Github standard text reference component.
    • New Apex Gauge component.
    • New CSS Style configs with predefined CSS inline configurations.
    • Add a themes property to change the themes with auto completion.
    • Add Index and step to be able to create custom themes from the available ones.
    • Add predefined CSS classes overrides.
    • Add white and black themes properties.
    • Introduce first version of skins for websites.
    • data ListItems (first version).
    • Add standard menu bar for HTML components
    • Add the options to get all the components in powered.
    • Add standard function for copy, download and clear.
    • Add url JavaScript attribute.
    • Add options in the Item list add() method.
    • Add getUrlFromData() method in the Js core module to convert variable to url.
    • Add URL property to window JS core module.
    • Add Stringify function for objects.
    • Add predefined fixed icon component.
    • Add predefined left input component.
    • Add align argument to formula component.
    • Add better management of the Interfaces skins
    • Add min-height to the Highlight component
    • Add is_true options to the automatic import manager
    • Markdown Python conversion function.
    • Icons menu.
    • Add Bootstrap icon family from standard components.
    • Add paragraph as an Interface shortcut.
    • Add Texts menu.
    • Add Items lists menu.
    • Add copyToClipboard DOM shortcut to components.

    Changed

    • Change button live style.
    • Change Rich, Vignets and number interfaces.
    • Change data default values for Sparkline interfaces.
    • Add nowrap style to list of links.
    • Include the color reference for the standard color names in charts.
    • Fix toMoney formatter for ApexCharts (to be done for other charts).
    • Default behaviour for icons application links.
    • Rename module GrpChart to GrpClsChart to follow the naming convention.
    • Use of notch to get the main color used instead of an index in the CSS predefined classes.
    • Remove Default.font() function from css.
    • Change color allocation for powered by component.
    • Change List menu component.
    • Change icon colors for input fields.
    • ChartJs JavaScript data() interface => align with build method.
    • ChartJs common series attributes.
    • Changed the Paragraph Markdown display

    Fixed

    • Link builder function.
    • Extensible search class width.
    • List tag position.
    • Fix jqueryui dependency with popperjs.
    • Handle not checked state for radio.
    • Height for the chart.
    • Update ApexChart package version.
    • Fix the Input options.
    • Remove the use of the static default CSS module for sizes.
    • Review all the existing themes.
    • Centralise the charts colors codes for themes.
    • Create dark mode and align grey color codes.
    • Fix ChartJs builder function names.
    • Fix context menu for Lists.
    • Fix add JavaScript function for Items list.
    • Fix slider component.
    • Align slider with the new options model.
    • fix external JavaScript text injection.
    • Highlights builder improvement.
    • Highlights Options definition.
    • Fix the CSS style of the print component.
    • Fixed webworkers integration from Flask.
    • Fixed PivotTableJs component renderers.
    • Fixed Icon family use.
    • Fixed color for content editable.
    Source code(tar.gz)
    Source code(zip)
    epyk-1.5.9-py2.py3-none-any.whl(2.86 MB)
This package is a python library with tools for the Molecular Simulation - Software Gromos.

This package is a python library with tools for the Molecular Simulation - Software Gromos. It allows you to easily set up, manage and analyze simulations in python.

14 Sep 28, 2022
Network automation lab using nornir, scrapli, and containerlab with Arista EOS

nornir-scrapli-eos-lab Network automation lab using nornir, scrapli, and containerlab with Arista EOS. Objectives Deploy base configs to 4xArista devi

Vireak Ouk 13 Jul 07, 2022
Enabling easy statistical significance testing for deep neural networks.

deep-significance: Easy and Better Significance Testing for Deep Neural Networks Contents ⁉️ Why 📥 Installation 🔖 Examples Intermezzo: Almost Stocha

Dennis Ulmer 270 Dec 20, 2022
Pytest plugin for testing the idempotency of a function.

pytest-idempotent Pytest plugin for testing the idempotency of a function. Usage pip install pytest-idempotent Documentation Suppose we had the follo

Tyler Yep 3 Dec 14, 2022
✅ Python web automation and testing. 🚀 Fast, easy, reliable. 💠

Build fast, reliable, end-to-end tests. SeleniumBase is a Python framework for web automation, end-to-end testing, and more. Tests are run with "pytes

SeleniumBase 3k Jan 04, 2023
Thin-wrapper around the mock package for easier use with pytest

pytest-mock This plugin provides a mocker fixture which is a thin-wrapper around the patching API provided by the mock package: import os class UnixF

pytest-dev 1.5k Jan 05, 2023
show python coverage information directly in emacs

show python coverage information directly in emacs

wouter bolsterlee 30 Oct 26, 2022
Obsei is a low code AI powered automation tool.

Obsei is a low code AI powered automation tool. It can be used in various business flows like social listening, AI based alerting, brand image analysis, comparative study and more .

Obsei 782 Dec 31, 2022
This repository has automation content to test Arista devices.

Network tests automation Network tests automation About this repository Requirements Requirements on your laptop Requirements on the switches Quick te

Netdevops Community 17 Nov 04, 2022
输入Google Hacking语句,自动调用Chrome浏览器爬取结果

Google-Hacking-Crawler 该脚本可输入Google Hacking语句,自动调用Chrome浏览器爬取结果 环境配置 python -m pip install -r requirements.txt 下载Chrome浏览器

Jarcis 4 Jun 21, 2022
A utility for mocking out the Python Requests library.

Responses A utility library for mocking out the requests Python library. Note Responses requires Python 2.7 or newer, and requests = 2.0 Installing p

Sentry 3.8k Jan 03, 2023
Useful additions to Django's default TestCase

django-test-plus Useful additions to Django's default TestCase from REVSYS Rationale Let's face it, writing tests isn't always fun. Part of the reason

REVSYS 546 Dec 22, 2022
Implement unittest, removing all global variable and returning values

Implement unittest, removing all global variable and returning values

Placide 1 Nov 01, 2021
pytest_pyramid provides basic fixtures for testing pyramid applications with pytest test suite

pytest_pyramid pytest_pyramid provides basic fixtures for testing pyramid applications with pytest test suite. By default, pytest_pyramid will create

Grzegorz Śliwiński 12 Dec 04, 2022
Scalable user load testing tool written in Python

Locust Locust is an easy to use, scriptable and scalable performance testing tool. You define the behaviour of your users in regular Python code, inst

Locust.io 20.4k Jan 04, 2023
Show, Edit and Tell: A Framework for Editing Image Captions, CVPR 2020

Show, Edit and Tell: A Framework for Editing Image Captions | arXiv This contains the source code for Show, Edit and Tell: A Framework for Editing Ima

Fawaz Sammani 76 Nov 25, 2022
Ab testing - The using AB test to test of difference of conversion rate

Facebook recently introduced a new type of offer that is an alternative to the current type of bidding called maximum bidding he introduced average bidding.

5 Nov 21, 2022
Multi-asset backtesting framework. An intuitive API lets analysts try out their strategies right away

Multi-asset backtesting framework. An intuitive API lets analysts try out their strategies right away. Fast execution of profit-take/loss-cut orders is built-in. Seamless with Pandas.

Epymetheus 39 Jan 06, 2023
Generates realistic traffic for load testing tile servers

Generates realistic traffic for load testing tile servers. Useful for: Measuring throughput, latency and concurrency of your tile serving stack. Ident

Brandon Liu 23 Dec 05, 2022
An Instagram bot that can mass text users, receive and read a text, and store it somewhere with user details.

Instagram Bot 🤖 July 14, 2021 Overview 👍 A multifunctionality automated instagram bot that can mass text users, receive and read a message and store

Abhilash Datta 14 Dec 06, 2022