DEV Community

loading...
Cover image for Using React Hooks with Django through Svelte and MQTT hub

Using React Hooks with Django through Svelte and MQTT hub

Dr Abstract
Inventor, Founder of ZIM JavaScript Canvas Framework and Nodism, Professor of Interactive Media at Sheridan, Canadian New Media Awards Programmer and Educator
・2 min read

Not everything has to be complicated. The code below is all you need to get started with an AMAZING world of Interactive Media. I have been coding for 40 years ever since Fortran was a thing. I have tried lots of libraries, platforms, etc. If you are at all visually creative and just want to have fun coding and make cool stuff here is the code you need to get started.

<!doctype html>
<html>
<head>
<meta charset="utf-8" />
<title>ZIM - Code Creativity</title>
<script src="https://zimjs.org/cdn/1.3.2/createjs.js"></script>
<script src="https://zimjs.org/cdn/cat/02/zim.js"></script>
<script>
const frame = new Frame("fit", 1024, 768, light, dark);
frame.on("ready", () => {
    const stage = frame.stage;
    let stageW = frame.width;
    let stageH = frame.height;

    // put your code here
    new Circle(100, red).center().drag();

    stage.update();
});
</script>
<meta name="viewport" content="width=device-width, user-scalable=no" />
</head>
<body></body>
</html>
Enter fullscreen mode Exit fullscreen mode

You will be called a Front-End Developer working on the open-source HTML 5 Canvas with JavaScript and ZIM - https://zimjs.com.

Alt Text

ZIM is new and extremely powerful and fun to code with. You can take a look at the Dev site if you must https://dev.zimjs.com but we suggest you press on the TEN BANNERS on the front page of the types of things perfect for Canvas coding or check out the examples at https://zimjs.com/examples and see if you might want to make these very colorful and fun apps.

If you want a quick taste of what the code will do go to https://zimjs.com/lab and type:

new Blob({color:purple}).center();
Enter fullscreen mode Exit fullscreen mode

The Intro page at https://zimjs.com/intro shows a good cross-section of what can be done with ZIM and there is a huge Learn section at https://zimjs.com/learn as well as lots of videos at https://zimjs.com/vids. If you are on CodePen here is a ZIM CodePen Topic https://codepen.io/topic/zim - just fork any of the many templates or examples there. Cheers and sorry for the title - did we get you?

Dr Abstract


If you have not checked out the Canvas recently - you simply must! Here is the ZIM Dev Site and some In-depth Guides by Dr Abstract including Your Guide to Coding Creativity on the Canvas.

Discussion (2)

Collapse
giorgosk profile image
Giorgos Kontopoulos 👀

Yeah misleading title, a turnoff, otherwise would be interesting post

Collapse
zimlearn profile image
Dr Abstract Author

Well... after dozens of hopefully interesting posts with not much interaction, we thought we would goof around a bit and see what happens. A sort of parody on the fast moving Dev world. Thanks for the comment! Yay - interaction!