jQuery>> better-big-canvas>> 返回
项目作者： ChristianTovar

项目描述 ：
🎨 Improved version of Big Canvas built from scratch using Phoenix LiveView.
高级语言： Elixir
项目地址: git://github.com/ChristianTovar/better-big-canvas.git
创建时间： 2020-08-10T01:00:33Z
项目社区：https://github.com/ChristianTovar/better-big-canvas
开源协议：MIT License
下载


Better Big Canvas

Worflow Badge
License badge

Description

Better Big Canvas is an improved version of Tech Lead’s Big Canvas written in Elixir from scratch. It uses Phoenix LiveView for server side rendering and supports real-time pubsub drawing support. For more information regarding how this application was implemented, visit the following post.

Getting Started

To start Better Big Canvas:

  • Install dependencies with mix deps.get
  • Install Node.js dependencies with npm install inside the assets directory
  • Start Phoenix endpoint with mix phx.server
  • Create/Reset the mnesia database by visiting localhost:4000/reset

Now you can visit localhost:4000 from your browser, enjoy drawing to your heart’s content!

Drawing Example

Click on any square from the main board, you’ll be redirected to a canvas where you can draw anything you want. If you return to the main board, you can preview what you just drew, take a look:

Draw Example

Real-Time Example

One of the main features of Better Big Canvas, is the ability to update the previews of the main board in real-time! Everytime you update a canvas, the changes will be immediately reflected on the correspoding preview canvas of the board. Here’s an example of 2 browser windows opened at the same time, if a canvas is edited, the main board will reflect those changes:

Draw Example

License

MIT. See the LICENSE.md in this repository for more details.