Tell me more ×
Programmers Stack Exchange is a question and answer site for professional programmers interested in conceptual questions about software development. It's 100% free, no registration required.

I'm not coming from web-development at all, but am looking to build a web application.

So far, I've looked into all the server-side stuff (for example, I think my stack will be Linux + node.js + ExpressJS + MongoDB), and have learnt a lot! At this point, I'm comfortable setting up an HTTP server, routing requests, using RESTfull interaction with a database, and serving dynamic HTML using an HTML template engine like ejs or Jade. I even looked into Websockets as a means for establishing a TCP connection to add fast user interaction without page refreshing.

Now I'm looking to do pretty stuff; add graphs, tabs, ect to my web-applications! I've looked into things like Dojo, JQuery, CanvasJS, AngularJS ect, and all them seem cool. Problem is, now that I think of it, I have no idea how client-side programming works. For example, in AngularJS I may find something like:

   <head>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.min.js"></script>
    <script src="components.js"></script>
  </head>

What is this saying? Does my server actually replace "components.js" with the actual "componennts.js" code before transmitting the response? What's going on with the https://ajax... source? Does the browser, (or the server?) actually have to go to this url, and retrieve code?

As I said, as far as I'm concerned, the server responds with an HTML document composed of ASCII characters. What then, is actually running on the client side, and how does it get this code? (i.e. on V8 or whatever).

share|improve this question
 
HTML is processed by the client (==browser). The client fetches that URL and executes it. –  Guy Sirton Jul 23 at 19:43
1  
 
@GuySirton Thanks for the link! So for something like Dojo/Angular ect; all the Dojo code is actually stored externally, and anyone who wants to use Dojo actually just requests their scripts from the browser? –  Colin Martell Jul 23 at 19:48
 
@ColinMartell: Sometimes web pages download JS components from central locations and sometimes you download them and stick those on your own web server... Google does serve Angular from their servers so you don't have to ( blog.angularjs.org/2012/07/… ) –  Guy Sirton Jul 23 at 19:50
 
@ColinMartell That is more or less correct. There are several ways that Javascript can be linked to a web page. For reusable code like Dogo/Angular/etc., the external source file is the common way to do it. When your browser encounters a <script> tag with a src attribute, it will fetch that source file and inject it into your page so that all of its public functions and data become available to other scripts on your page. It is that code that makes up client-side web scripting. –  Dan Albert Jul 23 at 19:54
show 6 more comments

1 Answer

up vote 5 down vote accepted

When a client makes a request to your Web Server requesting a resource -for example, the main Page- your server returns that resource. In case that resource is an HTML file, it is possible -and common- that to show your site you also require additional resources -images, CSS stylesheets, JS files- so the Browser can render your page correctly. That assets can be on the same web server that host your application or can be hosted somewhere else.

With this line of code:

 <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.min.js"></script>

Your HTML file is saying that it requires the file angular.min.js, and that file is locate in the https://ajax.googleapis.com servers. On the other side, this line of code:

 <script src="components.js"></script>

States that your site requires the components.js, and that file is located within your Web Server (for example, in http://www.mysite.com/components.js). So, when a user access to your site his Browser will load some files from your Web Server and some other from external repositories. Every file will be downloaded and stored in the Client's PC to load your site.

share|improve this answer
 
Oh ok. I just never knew this. Sounds cool! Thanks! –  Colin Martell Jul 23 at 20:03
 
@ColinMartell: As an aside, most SO users recommend using a 3rd party server for your library scripts (see Where do you include the jQuery library from?). Obviously this doesn't apply to your site-specific scripts. –  Brian Jul 23 at 20:18
 
@Brian Great link! Thanks so much! –  Colin Martell Jul 23 at 20:36

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.