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)
✅ 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
d4rk Ghost is all in one hacking framework For red team Pentesting

d4rk ghost is all in one Hacking framework For red team Pentesting it contains all modules , information_gathering exploitation + vulnerability scanning + ddos attacks with 12 methods + proxy scraper

d4rk sh4d0w 15 Dec 15, 2022
pytest splinter and selenium integration for anyone interested in browser interaction in tests

Splinter plugin for the pytest runner Install pytest-splinter pip install pytest-splinter Features The plugin provides a set of fixtures to use splin

pytest-dev 238 Nov 14, 2022
The Social-Engineer Toolkit (SET) repository from TrustedSec - All new versions of SET will be deployed here.

💼 The Social-Engineer Toolkit (SET) 💼 Copyright 2020 The Social-Engineer Toolkit (SET) Written by: David Kennedy (ReL1K) @HackingDave Company: Trust

trustedsec 8.4k Dec 31, 2022
A Python program that will log into your scheduled Google Meets hands free

Chrome GMautomation General Information This Python program will open up Chrome and log into your scheduled Google Meet with camera and mic turned off

Jonathan Leow 5 Dec 31, 2021
0hh1 solver for the web (selenium) and also for mobile (adb)

0hh1 - Solver Aims to solve the '0hh1 puzzle' for all the sizes (4x4, 6x6, 8x8, 10x10 12x12). for both the web version (using selenium) and on android

Adwaith Rajesh 1 Nov 05, 2021
Cloint India Pvt. Ltd's (ClointFusion) Pythonic RPA (Automation) Platform

Welcome to , Made in India with ❤️ Description Cloint India Pvt. Ltd - Python functions for Robotic Process Automation shortly RPA. What is ClointFusi

Cloint India Pvt. Ltd 31 Apr 12, 2022
Django test runner using nose

django-nose django-nose provides all the goodness of nose in your Django tests, like: Testing just your apps by default, not all the standard ones tha

Jazzband 880 Dec 15, 2022
Load Testing ML Microservices for Robustness and Scalability

The demo is aimed at getting started with load testing a microservice before taking it to production. We use FastAPI microservice (to predict weather) and Locust to load test the service (locally or

Emmanuel Raj 13 Jul 05, 2022
Webscreener is a tool for mass web domains pentesting.

Webscreener is a tool for mass web domains pentesting. It is used to take snapshots for domains that is generated by a tool like knockpy or Sublist3r. It cuts out most of the pentesting time by scree

Seekurity 3 Jun 07, 2021
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
A collection of benchmarking tools.

Benchmark Utilities About A collection of benchmarking tools. PYPI Package Table of Contents Using the library Installing and using the library Manual

Kostas Georgiou 2 Jan 28, 2022
Screenplay pattern base for Python automated UI test suites.

ScreenPy TITLE CARD: "ScreenPy" TITLE DISAPPEARS.

Perry Goy 39 Nov 15, 2022
Flexible test automation for Python

Nox - Flexible test automation for Python nox is a command-line tool that automates testing in multiple Python environments, similar to tox. Unlike to

Stargirl Flowers 941 Jan 03, 2023
FakeDataGen is a Full Valid Fake Data Generator.

FakeDataGen is a Full Valid Fake Data Generator. This tool helps you to create fake accounts (in Spanish format) with fully valid data. Within this in

Joel GM 64 Dec 12, 2022
Argument matchers for unittest.mock

callee Argument matchers for unittest.mock More robust tests Python's mocking library (or its backport for Python 3.3) is simple, reliable, and easy

Karol Kuczmarski 77 Nov 03, 2022
Statistical tests for the sequential locality of graphs

Statistical tests for the sequential locality of graphs You can assess the statistical significance of the sequential locality of an adjacency matrix

2 Nov 23, 2021
WomboAI Art Generator

WomboAI Art Generator Automate AI art generation using wombot.art. Also integrated into SnailBot for you to try out. Setup Install Python Go to the py

nbee 7 Dec 03, 2022
Voip Open Linear Testing Suite

VOLTS Voip Open Linear Tester Suite Functional tests for VoIP systems based on voip_patrol and docker 10'000 ft. view System is designed to run simple

Igor Olhovskiy 17 Dec 30, 2022
Tools for test driven data-wrangling and data validation.

datatest: Test driven data-wrangling and data validation Datatest helps to speed up and formalize data-wrangling and data validation tasks. It impleme

269 Dec 16, 2022