Why a browser designed to parse html, css, javascript only? - browser

I am learning how a browser works. Can anybody explain why browsers are designed to render html only even if we write web application in other server languages like php, python, ruby on rails?.

Because other languages like php, nees's a "motor" to run, and then motor here is server, witch will send html to browser for parsing. Heres a picture, cuz everybody love's pictures.
EDIT: In between 3 and 4 it will do necessary php running etc.

Related

Can I use browser's website code to recreate a website by my own way(change design, etc)?

For example, we have a cool styled website, can we use developer options(f12) from browser to snatch this?
Ignoring any legal / copyright implications, you can grab the client-side code this way, yes. All HTML, CSS, JavaScript and imagery can be seen through the F12 Developer Tools.
However, there is no way to know what server-side code a website is using (outside of the server owner themselves configuring something incorrectly and thereby exposing that information).
The answer from Obsidian Age is a good one. I'm going to add some more information that may be useful to you.
I've used this technique myself of getting source code via the developer window. Usually I want to find out how they did some neat CSS or JS trick so that I can try it in my own apps.
The files that make up a website such as HTML, JavaScript, and CSS you can find in the Network tab and can easily copy these.
However you should know the JS, CSS, and even (sometimes to a degree) the HTML files have been minimized and are typically missing any comments from the original developers. Chrome has a nice feature that will un-compress JS files and you can even set break points and step through the JS code.

PDF export from Java web application, with client-side visualizations

I've been converting HTML + CSS to PDF in server-side Java, e.g., Flying Saucer (http://code.google.com/p/flying-saucer/)
Now I need to look at alternative approaches with the growth in client-side visualization APIs like RaphaelJS, that should also be included in PDF exports.
Ideally, I would just have a print-friendly layout and CSS (kind of like Google maps does) and there would be some magic way that a Javascript call could silently "print" the window to a PDF file, rather than having a separate PDF generation pipeline.
Is there any such thing?
If not, what other approaches would you recommend?
For example
run Raphael server-side with node.js or Rhino, use Batik to convert SVG output to image, render PDF server-side
same thing but do some hack to grab SVG from the work that Raphael already did client-side
Do a headless-browser on the server, like wkhtmltopdf or phantomjs, to capture and execute the generated HTML/JS server side.
Any success with any of those approaches or other suggestions?
Those two options worked for me:
Client-side PNG generation with html2canvas (only works where canvas is supported)
Server-side PDF or PNG generation, with wkhtmltopdf (you might need xvfb)
Please ask if you need more details about how to use those solutions.
I set up a (very) simple test of both PhantomJS and CasperJS in order to be able to print a PDF server-side with a headless browser. It sure needs additionnal non-Java tools but I think this approach is more future-proof.
In those exemples, I am able to dynamically load a web page, let angular initialize and then interact with it with Javascript code in order to print the page as a user would have modify it in a real browser.
Here are my examples: https://github.com/fmarot/miscPOC/tree/master/angularAppOutputPDF

What web development tools will allow a page to be viewed by any internet connected device?

I know that Apple products like the iPad or the iPhone have trouble with flash apps.
What web development tools should I use in order to avoid compatibility issues when creating a website? My only constraint is that the languages must provide for interactivity and animation - such as in jQuery.
HTML, CSS, and PHP are a few that I can think of that will behave on 99% of all internet enabled devices.
What tools & languages are available to use when creating a website intended to be viewed on any device's internet "explorer"?
Should I just stick to HTML, CSS, & PHP? I want a certain level of interactivity so that, for example, a user can hover over images and have pop-ups containing data to appear... or when an object is clicked, an action can happen without a page reload.
Can someone point me in the right direction and help me develop a list of languages that are all-device friendly?
I am familiar with programming in several web-focused languages, I'm just wondering which ones to stay away from. Certain ones will limit the devices that can view the site and besides that constraint, the site needs to be interactive and animated.
HTML, CSS, PHP, JQUERY are truly your best bet for developing for a wide range of devices. If the scope of devices is the main goal I would stay away from using HTML5 and CSS3. You still may run into problems using much jquery with IE7 below. Mobile browsers on the other hand are much more advanced or up to date with standards then desktop browsers. I would suggest creating two versions of your application. One dedicated to running on mobile devices and one for desktop browsers. It is a shame apple wouldn't support flash applications. If all you need is hoovers for interaction you won't even need jquery / but for the other it will be useful.
The "Web" is a name for the concept of having interlinked documents accessible over the internet. Therefore, to have a website you really only need a document able to link to other documents, namely HTML.
HTML is not really a programming language or a tool though, it is a document format.
If you want to make a website you need use HTML to Markup what you're writing. Then you use CSS to format different sections of the document you marked up.
PHP though, is completely separate from this, PHP is for creating dynamic HTML, or any document on the server side.
If you want to achieve a flash-effect on a site you use Javascript to modify the page content (HTML) and appearance (CSS).
If you need to learn HTML/CSS I would highly recommend http://htmldog.com/
As per the question, HTML CSS and Javascript are pretty much the only mobile-browser compatible method for website content as they don't need plugins.
What exactly are you trying to do?

importance of JS to help me to decide to use or not the TEMPLATE LAYOUT MODULE (css3)

I would like to use this JS plugin to use the CSS template layout :
http://code.google.com/p/css-template-layout/
But I know that it is recommended to first have a website working without JS. So, my project consist in doing a tourism website...will I lose a lot of 'potential user' if JS is required to visit my website ?
Tkx,
About 4% of my visitors don't have javascript support includes bots though, that would explain quite a few percent. There are a few classes of browser that won't run your javascript as intended:
Screen readers/accessible browsers (like for blind people)
Mobile browsers
Console-based browsers (Used sometimes by sysadmins from servers with no gui installed)
Off-brand browsers or older browsers with buggy javascript engines
Search Engines (Google)
I don't think that many people just turn javascript off anymore. However, things like NoScript --where javascript is disabled for a site initially and must be explicitly enabled-- are becoming more popular.
The problem is more apparent on mobile browsers, but you will likely serve different content to them anyway.

Drag and drop into a browser application

We have a browser based application written in PHP in which I want to drag-n-drop files from the windows explorer or directly email attachments(this would be very cool). On dropping the files in the browser application, it should save it on a particular folder on the server. Any help on how this can be achieved would be really appreciated.
JS or HTML5 would seem to be your best bets. But I have had trouble with d&d in MSIE (FF was ok). The downside is that HTML is not scheduled to be finalized until 2022(!) - you can expect support before then (even today), but it may not be consistent.
There is a good HTML demo here http://ljouanneau.com/lab/html5/demodragdrop.html
This will also allow you to d&d stuff from the browser to the PC (bi-directional)
I don't do JS so can't help you there, sorry (I'm a PHP guy too ;-)

Resources