Real time code sharing for your lectures and presentations.
JavaScript CSS HTML Vue PHP
Switch branches/tags
Nothing to show
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Failed to load latest commit information.
app
bin
lib
resources
site
test
.babelrc
.editorconfig
.eslintrc.js
.gitignore
.npmignore
license.md
package-lock.json
package.json
readme.md

readme.md

Keppler

Real time code sharing for your lectures and presentations.

Website

What is keppler

Start keppler inside your project folder, share the URL with your audience and start coding. Any time you save a file, viewers will receive those changes. They can browse through the files, go back in history, copy the code, download the project, preview images, chat with other viewers, ask the presenter to slow down, etc.

Keppler screen

Keppler screen

Keppler screen

Instructions

1 - Install Keppler globally

You must have NodeJS and NPM already installed. In your console, run:

(You may need to add sudo at start)

npm install -g keppler

2 - Launch Keppler inside your project folder

In your console, navigate to your project folder. Then launch Keppler:

cd ./my-awesome-project
keppler

Keppler should open in your default browser and start watching any changes you make inside the folder.

3 - Share the URL with your audience

Simply share the URL that should appear and your audience will have access to your code through Keppler. By default, you must be on the same network.

Configuration

You can add configuration arguments when calling Keppler.

keppler "My project" --debug 0 --port 1234 --exclude "node_modules/**" --open true --test true --limit 200 --max-file-size 99999

And you can use shortcuts for those same arguments.

keppler "My project" -d 0 -p 1234 -e "node_modules/**" -oti -l 200 -m 99999

All those arguments are optional. You can simply run Keppler.

keppler

Arguments list

Debug level
parameter --debug
shortcut --d
default value (number)1
description How much logs should be shown
0: almost no log
1: primary logs
2: too much logs
parameter --name
shortcut -n
default value (string) folder name
description Project name
(you can simply add a string after keppler keyword like keppler "My project")
parameter --exclude
shortcut -e
default value (string)**/.DS_Store,**/node_modules/**,**/vendor/**,**/.git,**/.vscode,**/.env,**/.log,.idea/**,**/*___jb_old___,**/*___jb_tmp___
description List of paths to exclude (glob pattern with comma seperation)
parameter --open
shortcut -o
default value (bool)true
description Open Keppler in default browser
parameter --test
shortcut -t
default value (bool)false
description Start a test project with demo contents
⚠️ Only for development purpose
parameter --limit
shortcut -l
default value (number)99
description Limit of files above which nothing will be sent at start
⚠️ Too much files may cause issues
parameter --max-file-size
shortcut -m
default value (number)99999
description Maximum file size in octets
(99999 ≈ 100ko)
parameter --server
shortcut -s
default value (bool)false
description Start keppler server only
(if you want to run an online instance)
parameter --host
shortcut -h
default value (string)``
description Server host
(if you want to connect to an online instance)
parameter --port
shortcut -p
default value (number)1571
description Server port

Online instance

You can run Keppler online. Anyone with access to the server will be able to see the projects without having to be on the same network as you.

Keppler doesn't provide any host solution. You'll have to use your own server.

On the server

Install Node.js

Install keppler

npm install -g keppler

Start a keppler instance with the --server parameter

keppler --server

On you local machine

Start keppler with the --host parameter and server domain as the value

keppler "My awesome project" --host 12.34.56.78

Features

  • Work in any modern browser
  • File tree
  • Fuzzy search
  • File history/versions
  • File versions differences
  • Easy copy to clipboard
  • Accessible by anyone on the same network
  • App like design
  • Syntax coloring
  • Multiple projects in one Keppler instance
  • Chat with other viewers and associate specific files and lines with your messages
  • Open in default browser
  • Download file button
  • Download project button
  • Alert button
  • Tooltips
  • Online support

Credits

Development
UX / UI
  • Tom Bonnike
  • Thibaud Vaubourg
  • Aymeric Sans
  • Axel Chalon