Code Monkey home page Code Monkey logo

web-whiteboard's Introduction

Webboard

Welcome!

This is the repository for Webboard, an open source, multi-platform, intelligent whiteboarding Progressive Web Application!

This PWA is built with the PWABuilder pwa-starter. The PWABuilder pwa-starter is our opinionated, best practices, production tested starter that we use to build all of our PWAs, including PWABuilder itself. The pwa-starter is a starter codebase, just like create-react-app or the Angular CLI can generate, that uses the PWABuilder team's preferred front-end tech stack:

  • lit: Our framework of choice. Lit gives us a way to write code that feels remarkably familiar to popular frameworks like React but that compiles down to browser native Web Components with a tiny runtime that provides things such as performant asynchronous rendering. Put plainly, Lit provides that great developer experience that we may be used too but without any sacrifice in either load-time performance or runtime performance.
  • Vaadin Router: For routing, we use the Vaadin router. It is built with web components, has a tiny package size and all the features you expect from modern routers.
  • Shadow DOM, CSS Variables, Shadow Parts: Modern CSS is incredibly powerful, especially when combining the Shadow DOM, CSS variables and the Shadow Parts APIs. This provides a lot of the features we normally use a CSS pre-processor for, but without the extra complication that a CSS pre-processor adds to your build steps!
  • Rollup: Rollup is a "bundler" or build tool that will make working with NPM modules easy while also helping ensure our code is ready for production. It allows us to do things such as minify our code, run Workbox (another tool I will introduce next) and other build steps.
  • Workbox: Workbox is a tool that makes working with Service Workers easy!
  • TypeScript: TypeScript gives us features such as auto complete in our editors that helps make the development process easier, along with being perfect for working in a team because you can provide types for your APIs, making your code almost self-documenting.

You can find more details about it here.

Screenshots

example image

Get it

Main Features

  • Integrated File System: Webboard uses the new File System Access API to work with the file system. This enables Webboard to have the same edit+save experience as any other native app, such as Paint.
  • Low Latency Inking: Webboard uses the new Ink API available in Edge to enable native-like, low latency inking.
  • Pen, touch and mouse support: Webboard makes use of the Pointer Events API to support pen, touch and mouse input with the same code!
  • Share API: Webboard makes use of the Web Share API to enable sharing of boards using the native Windows share UI.

web-whiteboard's People

Contributors

dependabot[bot] avatar jgw96 avatar judahgabriel 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.