//

edited April 2016 in p5.js

/

Answers

  • edited August 2015 Answer ✓

    Is it possible/practical to make a fully operating website with Processing?

    Shortest answer is: Yes! Practical answer is: We shouldn't! ~:>
    However in this context, Processing means its JavaScript variant called p5.js: http://p5js.org/

    • Web programming is somehow very complicated for various reasons.
    • Web pages started w/ Gopher & HTTP protocols. But they only rendered static pages.
    • HTTP protocol introduced the famous HTML.
    • JavaScript & CSS shown up much later into the scene.
    • CSS expanded HTML's capabilities.
    • While JavaScript introduced real programming capabilities for web pages!
    • All of them, HTML, CSS and JS, can add and remove DOM elements from web pages.
    • The catch is, their syntax is completely different from each other! #-o
    • And each 1 is better fit to deal w/ specific DOM elements than the other.
    • So in order to make dynamic web pages, we need to learn 3 disparage syntaxes! /:)
    • However, among those 3, JS is clearly the most powerful b/c it's a real programming language.
    • Therefore we can add & remove DOM elements programmatically by JS alone if we wish so.
    • However, practical web pages include all those 3 working together: HTML + CSS + JS! :-\"

    I dunno much HTML. Much less CSS. Still need to learn them like you do! X_X
    However, if you wanna learn about DOM manipulation via p5.js API, go here:
    http://p5js.org/reference/#/libraries/p5.dom

  • edited April 2016

    //

  • edited August 2015 Answer ✓

    I'll just start learning these 4 languages.

    4? You mean Python too? Python isn't necessary for web development!
    I believe you've got your hands full already! Better keep focused for awhile! 8-X

    Reference for JavaScript language: https://developer.Mozilla.org/en-US/docs/Web/JavaScript

    And all Web API too: https://developer.Mozilla.org/en-US/docs/Web/API
    Focus on HTMLElement : https://developer.Mozilla.org/en-US/docs/Web/API/HTMLElement

    I guess it's easy to see how daunting a task to learn web page development from those links above! >-)

  • edited April 2016

    //

  • edited August 2015 Answer ✓

    Ah! Now I've got it! :D
    As a last advise, the following article introduces JS very easily. Worth checking out: O:-)
    https://developer.Mozilla.org/en-US/docs/Web/JavaScript/A_re-introduction_to_JavaScript

  • for a plain website just use html

    just 10 lines or so

  • edited April 2016

    //

  • edited August 2015

    @GrooseMcHades said:

    Can I develop an entire website with Processing

    In theory yes - if you're using the JS flavours - but you would be insane to try, even using p5.js...

    If you want to put content on the web (whether it be static or dynamic) before doing anything else learn HTML!!! It's not even a programming language; just a markup language. You need to fully understand how to build semantic HTML - and how a browser interprets it - before thinking about adding styling (via CSS) and interactivity (via JS).

    If you don't know how to use HTML properly you'll land up coding things in Processing that take 30 seconds to implement in HTML/CSS. You'll waste hours trying to style content that will take minutes in HTML/CSS. You'll waste days/weeks trying to implement interactivity that will take minutes/hours in HTML/CSS/JS...

    Processing was never designed for building websites; but you can create interactive sketches that you then embed in a website... Since your focus is online output I'd certainly recommend p5.js as the flavour of Processing to use; but first concentrate your efforts on building an understanding of general JS coding: you'll then know when to add interactivity directly to DOM elements (added using HTML) with JS and when to use the canvas element added via Processing.

    A not very inspiring example perhaps, but my bouncing balls demo is an example of what I'm talking about: the balls are bouncing around in a p5.js sketch; but the controls are added using vanilla JS commands (I didn't bother with the p5.js DOM methods that indirectly hook into these) which output standard HTML form elements into the web page outside the sketch. Coding those controls directly in a sketch window would have been hugely time-consuming...

    Here for once I can claim authority over @GoToLoop (edit: not that I need to: he's saying more or less the same in a different way): I have years of experience working on the web and in web development and working with HTML/CSS/JS :)

  • The thing is, I don't want a plain website

    The problem is that to have a "dynamic" website, you have to know how to make a "plain" website first. Instead of looking at the whole big picture, try to break your goal down into individual small steps that you can tackle one at a time.

    Step 1: Learn html. Make a basic "hello world" website. Step 2: Learn css. Make your basic "hello world" website pretty. Step 3: Learn basic JavaScript. Make your website interactive. Step 4: Learn Processing.js.

    Optionally, you might eventually want to learn server-side development as well, if you want to handle things like form submissions, logins, or file uploads. Again, approach the problem one small step at a time instead of trying to take it on all at once.

Sign In or Register to comment.