Lattice Grid Buy a licence

tutorials

Lattice Grid Tutorials: Build Real Things, Step by Step

Build real things, step by step. Complete, build-along projects with real code at every step and a live sandbox you can run and edit. Follow one end to end and you have something that works, not a snippet you still have to assemble.

Start here

  • Build a CRUD app with Lattice Grid, Node and DynamoDB

    • Part 1: read the data Live

      Create a DynamoDB table, a Node Lambda function in front of it, and a web page that reads your own products into a sortable, filterable grid.

    • Part 2: create, edit and delete Live

      The grid's cells become editable, the Lambda learns three more verbs, and an edit in the browser lands in DynamoDB before the cell stops flashing.

    • Part 3: edit in place Live

      Cells become editable and each committed change is patched to DynamoDB while the grid shows it, with the old value put back if the server says no.

  • Build a real-time operations console

    Drive a whole operations screen from one live feed: three linked grids and a chart, partitioned by the Data Router, with no backend.

    Also built for ReactVueSvelteAngular

  • Build a back-office admin panel

    Turn one dataset into an editable admin panel: inline and bulk edits, validation that refuses bad values, optimistic write-back to your API, per-cell permissions and undo.

  • Build a real-time trading terminal

    Drive a trading desk from one live price feed: positions, order-book depth and a blotter, with live mark-to-market P&L and flash formatting on every tick.

  • Build an analytics workbench

    Turn a dataset into an analysis tool: a cross-tab pivot, charts that cross-filter with the grid, a statistics panel and a regression toolkit with residual diagnostics.

  • Build an observability log explorer

    Explore a million log rows: virtualized scroll, a live tail, quick and set filters with facets, sparklines, a control chart and a saved view you can share in the URL.

  • Build a manufacturing SPC dashboard

    Build statistical process control from readings off the line: an individuals and moving-range chart, process capability with Cp and Cpk, and out-of-spec flagging.

  • Build a project management app

    Drive an editable Gantt and a Kanban board from one task list: a critical path, dependencies and milestones on the timeline, the same work as cards on the board, and every edit kept in sync.

  • Edit a pandas DataFrame in the browser

    Pass a DataFrame to LatticeGridWidget, edit a cell, and read it back with the exact dtype it started with, including the UTC rule a timestamp column follows. A runnable script and its real output.

  • Add a live grid to a Jupyter notebook cell

    Evaluate LatticeGridWidget as the last line of a cell and it renders an interactive grid. An executed notebook, with the real output of every cell: render, edit, append and delete rows.

  • Add a Lattice Grid to a Dash app

    Render lattice_grid_dash.LatticeGrid over a DataFrame and read every edit from an ordinary Dash callback. A complete app.py, with the callback’s real output.

  • Render a Parquet file in a JavaScript grid

    A Parquet file a pandas job wrote stays where it sits: DuckDB queries it in the tab, and only the visible page crosses into the browser. Complete source, and the measured byte counts.

  • Build an SPC / Cpk control-chart dashboard

    Declare a tolerance once with spec, and Cp, Cpk, the defect rate, and a control, moving-range and capability chart all read it. The complete runnable file, and how to read what it draws.