Code Monkey home page Code Monkey logo

pode.web's Introduction

Pode.Web

This is still a work in progress, until v1.0.0 expect possible breaking changes in some releases.

MIT licensed Documentation GitHub Actions Discord GitHub Sponsors

PowerShell Docker

๐Ÿ’ A lot of my free time, evenings, and weekends goes into making Pode happen; please do consider sponsoring as it will really help! ๐Ÿ˜Š

This is a web template framework for use with the Pode PowerShell web server (v2.6.0+).

It allows you to build web pages purely with PowerShell - no HTML, CSS, or JavaScript knowledge required!

You can build charts, forms, tables, general text, tabs, login pages, etc. There's a light, dark, and terminal themes, and you can supply a custom CSS file.

๐Ÿ“ฆ Libraries

The Pode.Web templates are built using Bootstrap, jQuery, Material Design Icons, Chart.js, and Highlight.js.

๐Ÿ“˜ Documentation

All documentation and tutorials for Pode.Web can be found here - this documentation will be for the latest release.

To see the docs for other releases, branches or tags, you can host the documentation locally. To do so you'll need to have the InvokeBuild module installed; then:

Invoke-Build Docs

Then navigate to http://127.0.0.1:8000 in your browser.

๐Ÿš€ Features

  • Like Pode, this is already cross-platform! (with support for PS5)
  • Easily add pages, with different layouts and elements
  • Support for authentication with a login page!
  • Create line, bar, pie, and doughnut charts
  • Support for forms, with all kinds of input elements
  • Show toast messages on the page, or send desktop notifications
  • Display data in tables, with pagination, sorting and filtering
  • Use a stepper for a more controlled flow of form input
  • Or, use a tabs layout for your pages!
  • Show or right code via the Monaco editor (still WIP)
  • Render code in code-blocks with code highlighting!
  • Support for Light, Dark, Terminal, and custom themes

๐Ÿ“ฆ Install

You can install Pode.Web from the PowerShell Gallery, or via Docker:

# powershell gallery
Install-Module -Name Pode.Web

# docker
docker pull badgerati/pode.web

๐Ÿ™Œ Contributing

Pull Requests, Bug Reports and Feature Requests are welcome! Feel free to help out with Issues and Projects!

To build Pode.Web, before running any examples, run the following:

Invoke-Build Build

To work on issues you can fork Pode.Web, and then open a Pull Request for approval. Pull Requests should be made against the develop branch. Each Pull Request should also have an appropriate issue created.

๐Ÿ”ฅ Quick Example

The below will build a web page that shows a chart with the top 10 processes running on your machine, and that auto-refreshes every minute:

Import-Module Pode.Web

Start-PodeServer {
    # add a simple endpoint
    Add-PodeEndpoint -Address localhost -Port 8090 -Protocol Http

    # set the use of the pode.web templates
    Use-PodeWebTemplates -Title 'Example' -Theme Dark

    # add the page
    Add-PodeWebPage -Name Processes -Icon Activity -Layouts @(
        New-PodeWebChart -Name 'Top Processes' -Type Bar -AutoRefresh -AsCard -ScriptBlock {
            Get-Process |
                Sort-Object -Property CPU -Descending |
                Select-Object -First 10 |
                ConvertTo-PodeWebChartData -LabelProperty ProcessName -DatasetProperty CPU
        }
    )
}

chart_processes

pode.web's People

Contributors

badgerati avatar dependabot[bot] avatar ili101 avatar thekamilpro avatar the-mentor avatar eremindv avatar dolearnwhilealive avatar

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.