Monday 4 February 2019

Create empty ReactJs Application in Visual Studio

Make sure you have Node.Js component installed for Visual Studio

How to verify Node.Js installed for Visual Studio or not?
Go to Windows > Visual Studio Installer > Modify > Verify Node.Js development




Just few clicks now and your first VS React Application is ready with initial template.


Server.ts
Vital gateway of project that allow us to configure listening port and end point for the project. It is typescript file having extension .ts. Let's have look on each line with comment.

//common es6 syntax to load object(http) from installed module(http).
import http = require('http');

//define port, default port for Node.Js project is 1337 that we can change.
var port = process.env.port || 1337;

//A method of http that we use to create server instance for project. Each request/response will be coming/server through (req,res)
http.createServer(function (req, res) {
    // set response header
    res.writeHead(200, { 'Content-Type''text/html' });
    // set response content    
    res.write('<html><body><h1>Hello World</h1></body></html>');
    res.end();
}).listen(port);

Output



Notes:

Details es6 syntax could be found here
https://codeburst.io/es6-tutorial-for-beginners-5f3c4e7960be
https://www.tutorialspoint.com/es6/es6_syntax.htm

Mode Core module like (http, url, path, fs, util and querystring) could be found here
https://www.tutorialsteacher.com/nodejs/nodejs-modules