Testp5: Unterschied zwischen den Versionen
Aus exmediawiki
Karin (Diskussion | Beiträge) |
Karin (Diskussion | Beiträge) |
||
| (Eine dazwischenliegende Version desselben Benutzers wird nicht angezeigt) | |||
| Zeile 2: | Zeile 2: | ||
If you want to work with p5.js on your computer, you need an editor. <br> | If you want to work with p5.js on your computer, you need an editor. <br> | ||
| − | The most simple one being text editor. There are also several code editors you can choose from, e.g. [https://subethaedit.net/ subethaedit], [https://www.sublimetext.com/2 sublime text 2], [http://brackets.io/ brackets], https://atom.io/ atom], [https://notepad-plus-plus.org/ notepad++] just to name a few. | + | The most simple one being text editor. There are also several code editors you can choose from, e.g. [https://subethaedit.net/ subethaedit], [https://www.sublimetext.com/2 sublime text 2], [http://brackets.io/ brackets], [https://atom.io/ atom], [https://notepad-plus-plus.org/ notepad++] just to name a few. |
| + | <br> | ||
E.g. in subethaedit you can write, execute and manage different languages, for the purposes of p5.js it is javascript. It enables you to work with javascript locally on your computer. Furthermore you can use it to write your own html-code to execute your js-file and test it directly in your browser. Later on you can embed the html-page on a website. | E.g. in subethaedit you can write, execute and manage different languages, for the purposes of p5.js it is javascript. It enables you to work with javascript locally on your computer. Furthermore you can use it to write your own html-code to execute your js-file and test it directly in your browser. Later on you can embed the html-page on a website. | ||
| Zeile 37: | Zeile 38: | ||
</HTML> | </HTML> | ||
| + | <br> | ||
The line <script src="forexample.js"></script> refers to the file forexample.js, which you work on in the editor. | The line <script src="forexample.js"></script> refers to the file forexample.js, which you work on in the editor. | ||
The necessary libraries can accessed directly by referencing to the online repositories. This also ensures that you always work with the most recent update. If you prefer to work with libraries downloaded directled from p5, you'll need to include these in the folder you are also storing your .js-file. | The necessary libraries can accessed directly by referencing to the online repositories. This also ensures that you always work with the most recent update. If you prefer to work with libraries downloaded directled from p5, you'll need to include these in the folder you are also storing your .js-file. | ||
| + | <br> | ||
For more information: [https://p5js.org/get-started/#settingUp setup of p5 on your computer], [https://p5js.org/get-started/ get started]. | For more information: [https://p5js.org/get-started/#settingUp setup of p5 on your computer], [https://p5js.org/get-started/ get started]. | ||
Aktuelle Version vom 2. Februar 2021, 17:06 Uhr
How to work locally with p5
If you want to work with p5.js on your computer, you need an editor.
The most simple one being text editor. There are also several code editors you can choose from, e.g. subethaedit, sublime text 2, brackets, atom, notepad++ just to name a few.
E.g. in subethaedit you can write, execute and manage different languages, for the purposes of p5.js it is javascript. It enables you to work with javascript locally on your computer. Furthermore you can use it to write your own html-code to execute your js-file and test it directly in your browser. Later on you can embed the html-page on a website.
the html-page can look like this:
<HTML>
<HEAD>
<meta http-equiv="Content-Type" Content-Type: text/javascript;charset=utf-8">
<meta charset="utf-8"/>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<TITLE>for_example</TITLE>
<script src="https://cdn.jsdelivr.net/npm/p5@1.0.0/lib/p5.min.js"></script>
</HEAD>
<BODY BGCOLOR="#cdcdcd">
<script src="forexample.js"></script>
</BODY>
</HTML>
The line <script src="forexample.js"></script> refers to the file forexample.js, which you work on in the editor.
The necessary libraries can accessed directly by referencing to the online repositories. This also ensures that you always work with the most recent update. If you prefer to work with libraries downloaded directled from p5, you'll need to include these in the folder you are also storing your .js-file.
For more information: setup of p5 on your computer, get started.