Worldboard

Inspiration

As the coronavirus situation progresses on and on, people are becoming more dependent on technology and engineered products. There are many online collaborative whiteboards already in the digital world, such as Google's Jamboard. But hey, INIT is all about learning, building, and sharing ;), so I teamed up with foop (aka Weiyi) to create an interactive whiteboard of our own.

What it does

There are various components and features of our project. This whiteboard is actually just a canvas built using p5.js. By adding some more Javascript libraries/modules/thingamajigs, we were able to bring in Node.js, socket.io and Express to create our whiteboard project.

How we built it

We built it by referring to The Coding Train's collaborative canvas tutorial. It was an interesting guide as to how p5.js worked, and I really loved the enthusiasm and bounciness of Daniel Shiffman.

Challenges we ran into

Originally, we referred to The Coding Train's Github repository and used the code in that repository to follow the video. However, we soon discovered that the code in the repository was not alike to the code shown in the video, which caused us some confusion. Nonetheless, both of us pulled through, watched the tutorial, learnt a lot of things, and created this project.

Accomplishments that we're proud of

We are extremely proud of working together and creating a project like this.

What we learned

I know foop has worked with Express and sockets before, but I didn't explore much in Javascript beyond Node. I think we can say that we have learnt quite a lot, regardless of our difference in competency.

What's next for Worldboard

I actually have some plans for Worldboard that I think I will implement in the future if I can find a way to. I would like to add more colour options to the board.

Built With

• css
• express.js
• html
• node.js
• p5
• socket