Welcome to the Treehouse Community
Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.
Looking to learn something new?
Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.
Start your free trial
Nithin KV
809 PointsHow to call nodejs in html file?
I have a nodejs file called app.js. this file contains the code for getting social media share count. It's working perfectly when I'm calling app.js in console. I want to show the count in index.html file. I wrote code document.getElementById("shareCount").textContent = total; in my app.js.
Not able to call this nodejs file in my Html. How to do this? hat is the best way? Please help
5 Answers
Dastan Akhmetov
11,651 PointsHi Nithin,
I guess I understand you, lemme try :)
Think of nodejs as a remote server. When you open a page, your browser sends a request to the server where nodejs is, it runs the code in your app.js file, and when a response is ready, it sends back data to your browser. On the other hand, javascript you run on your browser is included into webpage as a part, and it can run without webserver, since the browser is giving it the power. Hence, nodejs application runs in different environment rather than a "normal" javascript, which runs in a browser. So you cannot run nodejs application in a browser, because it simply won't do anything unless the code is similar to a "front-end" javascript.
In your particular case, to get social media share count number you can use jQuery library, because methods like https.get() are little differently presented in jQuery.
Watching these should solve your problem:
https://teamtreehouse.com/library/ajax-basics AJAX Basics to understand how to use browser's capabilities to send and receive data asynchronously.
https://teamtreehouse.com/library/jquery-basics jQuery Basics to understand how to easily manipulate DOM (Document Object Model) and more.
Hope it helps
Nithin KV
809 PointsI did the same functionality with ajax. I just want to try nodejs instead of ajax. I mean the functionality to get share count.
Dastan Akhmetov
11,651 PointsYou can do nodejs but only on server side, as Johan Marais said earlier: "Node runs as the Backend. Hence you need the server part to keep it alive and working.", nodejs scripts will not run in your browser. However if you managed to make the same functionality with ajax then you reached your goal :)
Nithin KV
809 PointsHi Johan,
This is my app.js :
var https = require("https");
var pathname_arr = ["http://techcrunch.com/2016/06/06/blue-origin-continues-successful-record-setting-year-with-another-nasa-contract/", "http://techcrunch.com/2016/06/06/30m-stampede-2-supercomputer-will-provide-18-petaflops-of-data-crunching-power-to-researchers-nationwide/", "http://techcrunch.com/2016/06/06/doz-launches-quoter-a-semi-automated-service-to-get-a-quote-and-hire-marketing-freelancers-in-no-time/"];
pathname_arr.forEach(get_shareCount);
function get_shareCount(pathname){ var total = 0;
https.get('https://api.facebook.com/method/links.getStats?urls='+pathname+'&format=json', function(res) {
res.on('data', function(d) {
var objres = JSON.parse(d);
total += objres[0].share_count;
console.log(pathname+" fb share count is : "+ total);
document.getElementById("shareCount").textContent = total;
});
}).on('error', function(e) {
console.error(e.message);
});
}
This is my Index.html :-
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Share Count</title>
<body>
<div id="shareCount"></div>
<script src="scripts/app.js"></script> </body> </html>
It's working when I'm running app.js in console. I need to show this in my html file. I'm new to nodejs.
Johan Marais
15,920 PointsHi Nithin
Node is a JavaScript runtime. In order to run the code as you have it here you would need it to run in a server. If you wish to execute this code directly from the HTML page i would suggest you use jQuery and run it when the page is ready.
I would recommend that you do the following two courses first to understand Node better:
This should give you a clear understanding of how Node works and how to get data to your HTML page.
Hope this helps. :)
Johan Marais
15,920 PointsNode runs as the Backend. Hence you need the server part to keep it alive and working.
Nithin KV
809 PointsOK Thanks. Can I call the "total" value from app.js through ajax in html file?
Dastan Akhmetov
11,651 PointsNo, you cannot. AJAX sends a request to web-servers, you cannot make ajax to an html file or app.js
Nithin KV
809 Pointsok thanks Dastan.
Johan Marais
15,920 PointsJohan Marais
15,920 PointsCould you share your Code. This will allow me to check how it gets executed. :)