Giter Club home page Giter Club logo

p5.js-blackboard's Introduction

p5.js blackboard

Features -

Customization :-

  • You can switch between colors by using the colorPicker
  • You can also change the size of the Chalk by usingthe Slider
  • If you want more Customization, you can create anew branch and you can even code your own shortcuts,you can even create a new slider for something else..
  • This project is completely open source.

Usage Instructions :-

  • Use the slider to adjust the size of the brush.
  • Use the colour Picker to choose your very own unique color.
  • When you want to clear the screen, hit 'C' on your keyboard or click the 'Clear' Button.
  • If you want to contribute to the project, hit the 'Improve the app button'.

How to use :-

Open in your Browser from one of these deployments :-

Deployment 1 - Vercel

Deployment 2 - GitHub

OR

Download The source code files and run the server on your computer.

Requirements -

  • node.js (for running server)
  • Terminal / Command Prompt / Git bash

How to run the Blackboard -

  • Open Terminal / Command Prompt / Git bash
  • 'cd' to the directory where the server.js file is stored.
  • Then type 'node server.js'
  • In your Browser, go to localhost:3030 or click this text.

Or if you dont want to run the server, follow these steps -

  • Go to the 'public' folder in your File Explorer or Finder
  • And then open the 'index.html' file in your broser.

That's it! this is how you setup blackboard on your local computer!

Made by Samyak Bambole

Liscence - MIT

p5.js-blackboard's People

Contributors

samyakbambole avatar

Stargazers

 avatar  avatar  avatar

Watchers

 avatar  avatar

p5.js-blackboard's Issues

Update The server.js to be more friendly.

The server, while running, should print out the following -

If you want to save space on your computer, use one of these deployments -

  • Vercel Deployment - 'deploymant link'
  • GitHub Pages Deployment - 'deployment link'

Improove This app!

I would Like many People to improove this app. I will try to merge all the PRs I can.

Slider problem

When I tried to increase the size of the brush with the slider, the area near the slider got painted.
slider

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.