Jodit — лучший WYSIWYG редактор

👁 0 просмотров
1 Звезда2 Звезды3 Звезды4 Звезды5 Звезд (Пока оценок нет)
Загрузка...

Отличный редактор WYSIWYG, написанный на чистом TypeScript без использования дополнительных библиотек. Это редактор файлов и редактор изображений. Позволяет также работать и в динамическом режиме, если вам нужно показать редактор в попап — диалоге. Пример с jsFiddle

Double Click event in Vue.js

👁 256 просмотров
1 Звезда2 Звезды3 Звезды4 Звезды5 Звезд (Пока оценок нет)
Загрузка...

This example will show you how to organize a double click event in Vue.js

Firebase и Ionic. Настройка и операции CRUD

👁 132 просмотров
1 Звезда2 Звезды3 Звезды4 Звезды5 Звезд (Пока оценок нет)
Загрузка...

Этот пост пошагово расскажет, как реализовать CRUD — операции на Angular 5 для Firebase — проекта. Итак, давайте продемонстрируем Create Read Update and Delete операции на Angular 5 проекта.

О Firebase

Firebase — это NoSQL — база данных, которая продвигается в облачном хранении информации, поэтому нет необходимости закупать отдельный сервер для проекта, учитывая, что бесплатная версия вполне хватает для мелких проектов или проектов для демонстративной работы. База данных Firebase Realtime — это база данных NoSQL, размещенная в облаке. С его помощью вы храните и синхронизируете данные между пользователями в режиме реального времени.

Что включает в себя Firebase:

  • Realtime Database — облачная база данных для хранения данных в JSON формате;
  • Cloud Storage — облачное место для хранения файлов;
  • Hosting — хостинг для WEB — сайта;
  • Performance Monitoring — инструменты мониторинга;
  • Authentication — система аутинтификации через различные платформы провайдеров;
  • Crashlytics — система мониторинга багов и ошибок;
  • Test Lab for Android — лаборотория для тестирования устройств на системе Androidж
  • Cloud Firestore — база данных для хранения, получения и синхронизации данных и файлов в глобальном масштабе.

В данной работе будем использовать только Realtime Database для хранения и получения JSON — данных в реальном времени.

Требуемые инструменты

Для работы будут необходимы следующие инструменты:

– Ionic CLI
– Angular 5
– AngularFirebase
– Ionicons
– VS Code & Visual Studio Editor

Описание примера

В примере будет полноценное приложение Ionic, в котором будет реализовано CRUD с удаленной БД Firebase на вашем аккаунте Google. Дополнительно покажем, как реализовать каркас формы приема и выдачи данных.

Описание шагов

Создадим базовое приложение Ionic для мобильного телефона. Будем следовать следующему пошаговому курсу:

  • Шаг 1. Создаем приложение.
  • Шаг 2. Устанавливаем зависимости (AngularFire2 и Firebase).
  • Шаг 3: Создаем поставщика/провайдера для выполнения коммуникации CRUD.
  • Шаг 4.  Устанавливаем домашнюю страницу для отображения зарегистрированных контактов.
  • Шаг 5: Создаем страницу для добавления / изменения контактов.

Шаг 1. Создаем приложение

Создаем новое приложение по команде

ionic start Courses blank

Приложение будет представлять из себя список курсов. И будет состоять из страниц:

  • home.html — список всех курсов;
  • course-edit.html — страница редактирования курса;
  • course-info.html — страница просмотра информации о курсе;
  • course.html — страница прохождения курса.

Создадим их:

ionic g page course-edit
ionic g page course-info
ionic g page course

Шаг 2. Устанавливаем зависимости

Для этого набираем:

npm install firebase angularfire2 --save

Чтобы начинать  работу с базой данных Firebase необходимо в главном модуле подключить зависимости:

 

Шаг 3. Создаем провайдера

Провайдер нужен для создания управления промежуточными операциями CRUD. Создается из консоли:

ionic g provider course

 

Пост не закончен …

Работа через менеджер версий Node.js (NVM)

👁 197 просмотров
1 Звезда2 Звезды3 Звезды4 Звезды5 Звезд (Пока оценок нет)
Загрузка...

Что такое NVM?

NVM(Node Version Manager) — это простой bash — скрипт, который позволяет упралять(устанавливать, обновлять, активировать, удалять) разные версии Node.js на одной машине так, что они выполняются в изолированных друг от друга средах. Таким образом, можно работать с разными версиями одного программного обеспечения не задевая или разрушая их модульные зависимости.

Почему NVM?

В любой момент вы захотите работать с различными проектами, используя различные версии Node.js и NVM позволяет устанавливать разные версии для различных проектов. NVM позволяет работать  с разными версиями посредством сессий, при котором каждая сессия соответствует версии Node.js.

Установка NVM

Установка на Linux/Ubuntu очень легко делается, сначала надо будет скачать через ссылку, указав версию(на момент написания версия была v0.33.8 и это можно проверить по ссылке на официальном репозитории).

Скачка через curl:

curl -o- https://raw.githubusercontent.com/creationix/nvm/v0.33.8/install.sh | bash

или через wget:

wget -qO- https://raw.githubusercontent.com/creationix/nvm/v0.33.8/install.sh | bash

Возможно, что после установки вам придется закрыть и еще раз открыть консоль, но в большинстве этого не требуется.

Скрипт клонирует репозиторий nvm в директорию  ~/.nvm и добавляет исходные строки в наш профиль в виде:   ~/.bash_profile~/.zshrc~/.profile или ~/.bashrc

Установка Node.js используя NVM

Давайте рассмотрим процесс установки Node.js через NVM и это легко. Перед тем, как установить Node.js, нам необходимо узнать какие версии на данный момент доступны для загрузки и установки и для этой проверки есть команда:

nvm ls-remote

Если в списке есть желаемая версия, то ее можно установить через команду с указанием этой версии:

nvm install 5.0

И потом можно менять оболочки(сессии) использования версии через команду:

nvm use 5.0

Использование NVM

Чтобы посмотреть список установленных версий Node.js можно набрать команду:

nvm ls

И если мы в большинстве используем определенную версию Node.js, то можем установить ее по умолчанию:

nvm alias default 5.0

И все это дело можно гибко настраивать, создавая файл .nvmrc в корневой директории проекта с указанием необходимых данных версии Node.js для запуска проекта.

 

Заключение

Управление версиями на одной машине — это ключевая задача, но утомительная. Задачи должны быть автоматизированы и для этого и создавался NVM, который помогает нам управлять различными версиями Node.js без труда. Дополнительно про возможности NVM можно почитать на официальной странице репозитория.

 

Вызов кода C# из JavaScript

👁 263 просмотров
1 Звезда2 Звезды3 Звезды4 Звезды5 Звезд (Пока оценок нет)
Загрузка...

При разработке JavaScript — приложений на платформе .NET очень часто, даже не очень, а требуется использовать JavaScript — функции вызова кода C#. Так как JavaScript не умеет пользоваться файловой системой не может работать с БД, то нам необходим код C#, который подгрузит данные из файла, запишет в файл, почитает и перезапишет данные в БД, обработает методами .NET данные и т.д.
Есть 2 похода того, как это сделать:

  • использовать специальный метод JS window.external, который будет содержать метод, определяемый в классе COM — объекта;
  • использовать ASP.NET страницы или любого другого серверного языка и подгрузить их через Ajax — запросы.

В данном посте рассмотрим первый вариант. Ниже представлен класс, который мы определяем , как видимый COM — объект

 

namespace MyApp
{
    [ComVisible(true)] //Устанавливаем как видимый COM
    public class ScriptClass
    {
        public ScriptClass()
        {
        }
        //Данный метод будем вызывать из JS
        public void readFile()
        {
            MessageBox.Show("File Reading!");
        }
    }
}

Далее нужно установить параметры для браузера, который мы используем в проекте

WebBrowser webBrowser = new WebBrowser(); 
webBrowser.ObjectForScripting = new ScriptClass(); 
webBrowser.Navigate("http://websofter.ru/");

Теперь, чтобы запустить данный код из JS, нам надо написать в обработчике такой код

window.external.readFile();

Использование JavaScript в WebBrowser .NET/C#

👁 681 просмотров
1 Звезда2 Звезды3 Звезды4 Звезды5 Звезд (2 оценок, среднее: 4,00 из 5)
Загрузка...

При использовании JavaScript в .NET объекте WebBrowser нужно учитывать некоторые ньюансы, связанные с загрузкой страницы. Для того, чтобы выполнить какой-то JavaScript — код необходимо проверить загрузку страницы. Простое решение — это использование в C# специального слушателя события — WebBrowser.DocumentCompleted, который вызывается, когда страница полностью загружена.

Пример вызовава JavaScript — кода из C#

Ниже дан пример его использования. Пусть у нас есть HTML сраница index.html со следующим JavaScript — методом, который определен в head

<script>
	function runScript(){
		alert("Hello World!");
	}
</script>

Тогда вызов данного метода через C# будет выглядеть вот так

public MyForm()
{
//...
//Сначала определяем новое событие для браузера и передаем имя обработчика
            string appDir = Path.GetDirectoryName(Assembly.GetExecutingAssembly().GetName().CodeBase);
            webBrowser.Url = new Uri(Path.Combine(appDir, @"pages\index.html"));
  webBrowser.DocumentCompleted += new WebBrowserDocumentCompletedEventHandler(runWebScripts);
}

//Далее, в классе определяем новый обработчик
void runWebScripts(object sender, WebBrowserDocumentCompletedEventArgs e)
{
   webBrowser.Document.InvokeScript("runScript", new object[] { });
}

 Пример создания JavaScript — кода и его запуска из C#

Теперь посмотрим как создать новый элемент в DOM через C# и создать в нем код JavaScript

public MyForm()
{
//...
//Сначала определяем новое событие для браузера и передаем имя обработчика
            string appDir = Path.GetDirectoryName(Assembly.GetExecutingAssembly().GetName().CodeBase);
            webBrowser.Url = new Uri(Path.Combine(appDir, @"pages\index.html"));
  webBrowser.DocumentCompleted += new WebBrowserDocumentCompletedEventHandler(runWebScripts);
}

//Далее, в классе определяем новый обработчик
void runWebScripts(object sender, WebBrowserDocumentCompletedEventArgs e)
{

            HtmlDocument doc = webBrowser.Document;
            HtmlElement head = doc.GetElementsByTagName("head")[0];
            HtmlElement s = doc.CreateElement("script");
            s.SetAttribute("text", "function sayHello() { alert('hello'); }");
            head.AppendChild(s);
            webBrowser.Document.InvokeScript("sayHello");

}

Мы добаляем в тег head новый элемент script и устанавливаем в качестве его атрибута text JavaScript — код и далее вызываем этот код с помощью метода InvokeScript

Подключение jQuery в WebBrowser через C# в виде гиперссылки

Давайте посмотрим, как использовать библиотеку jQuery в своем проекте на C#. Для этого нам необходимо создать новый элемент script и передать в атрибут src значение ссылки, для примера подключим библиотеку из стандартной ссылки Google

public MyForm()
{
//...
//Сначала определяем новое событие для браузера и передаем имя обработчика
            string appDir = Path.GetDirectoryName(Assembly.GetExecutingAssembly().GetName().CodeBase);
            webBrowser.Url = new Uri(Path.Combine(appDir, @"pages\index.html"));
  webBrowser.DocumentCompleted += new WebBrowserDocumentCompletedEventHandler(runWebScripts);
}
//Далее, в классе определяем новый обработчик
void runWebScripts(object sender, WebBrowserDocumentCompletedEventArgs e)
{
            //Получаем доступ к тегу head
            HtmlDocument doc = webBrowser.Document;
            HtmlElement head = doc.GetElementsByTagName("head")[0];

            //Подключаем библиотеку
            HtmlElement jQuery = doc.CreateElement("script");
            jQuery.SetAttribute("src", "http://code.jquery.com/jquery-latest.min.js");
            head.AppendChild(jQuery);
            
            //Далее запускаем код, содержащий jQuery
            HtmlElement script = doc.CreateElement("script");
            script.SetAttribute("text", "function setRedColor() { $('body').css({ 'background-color': 'red' }); }");
            head.AppendChild(script);

            //Вызываем метод, содержащий код jQuery
            webBrowser.Document.InvokeScript("setRedColor");

}

Подобным образом можно подключить не только jQuery библиотеку, но и любой удаленный JavaScript файл.

Подключение jQuery в WebBrowser через C# из локального хранилища

Если нам необходимо подгрузить jQuery или любой JavaScript — файл локально, то тут необходимо учитывать некоторые особенности, связанные с jQuery, так как при локальном подключении у вас может выскочить ошибка такого рода: Object doesn’t support property or method ‘defineProperty’, который означает: Объект не поддерживает свойство или метод ‘defineProperty’. Что непонятно, так это то, что при подключении через удаленную гиперссылку эта ошибка не выводиться и браузер работает нормально. Данная ошибка актуальная для версий IE 10 — 11 и выше, возможно. В IE он поддерживается, а в IE 8 — ограниченно. Решением данной проблемы является использование тегов для переключения браузера в режимы совместимости с ранними версиями. Подробно про это написано в официальной статье Microsoft «Specifying legacy document modes»

Из данной статьи следует, что для совместимости нужно использовать мета — тег

<meta http-equiv="x-ua-compatible" content="IE=edge" />

Запись атрибута content дает указание на то, с какой версией IE следует иметь совместимость. В нашем случае, данная запись эквивалентна использованию типа документа HTML5 и совместимости с другими браузерами. Это заставит Internet Explorer работать в режиме последней поддерживаемой спецификации документа. Значение «IE=edge» является наиболее полезным для регулярного поддерживания веб-сайтов, которые отрабатываются на совместимость между несколькими браузерами, в том числе Internet Explorer.
Данный тег совместимости необходимо в начале тега head в документе.

Итак, теперь, собственно сам код подключения. HTML документ будет таким

 

...
<head>
    <meta http-equiv="x-ua-compatible" content="IE=edge" />
</head>
...

C# — код будет таким

HtmlDocument doc = wbTestEditor.Document;
HtmlElement head = doc.GetElementsByTagName("head")[0];
HtmlElement s = doc.CreateElement("script");
s.SetAttribute("src", Environment.CurrentDirectory + @"\pages\js\jquery-2.1.3.min.js");
head.AppendChild(s);

Свойство Environment.CurrentDirectory содержит корневую папку запускаемой программы, а @ нужен для обработки слэшей в нормальном виде, чтобы не писать как \\. Environment.CurrentDirectory — это тоже самое, если бы мы писали как Path.GetDirectoryName(Assembly.GetExecutingAssembly().GetName().CodeBase), но в коротком виде.

Графический редактор на JavaScript. Часть 1. Введение

👁 293 просмотров
1 Звезда2 Звезды3 Звезды4 Звезды5 Звезд (Пока оценок нет)
Загрузка...

Данный цикл статей будет относится к проектированию простого графического редактора на основе клиентского языка JavaScript и серверного языка PHP. Графический редактор будет иметь возможность создавать простейшие примитивы: линия, эллипс, прямоугольник, многоугольник. Опишем возможность добавления, редактирования и удаления примитивов из текстового файла. Прорисовка примитивов будет производиться средствами HTML5 Canvas. HTML5 интегрирован с языком JavaScript и позволяет нам напрямую использовать API Canvas.

1. Клиентская часть на JavaScript

Клиентская часть, как известно, выполняется в браузера удаленного пользователя и для того, чтобы пользователь имел возможность редактировать файл на сервере необходимо будет иметь постоянную связь с PHP скриптом, для передачи параметров интерактивного редактирования примитива. Для этого будем использовать технологию ассинхроной связи с сервером AJAX. Для кроссбраузерной совместимости будем сразу использовать какую-нибудь библиотеку JavaScript, чтобы не отвлекаться на ненужные приемы совместимости и лучщим решением будет jQuery.

2. Серверная часть на PHP

Серверная часть будет написана на PHP. Необходимость в использовании PHP обусловлено тем, что JavaScript не имеет возможности работать с файлами: записывать, удалять, редактировать… Поэтому использование серверного языка — это одна из необходимостей для создания и редактирования графического файла, в котором будут храниться наши данные.

3. Расширение файла

Для того, чтобы сохранить наши примитивы для передачи между пользователями будем использовать обычный текстовый файл с расширением *.sgf(Simple Graphic Format). Название расширения не играет роли, можно любое, которое угодно вам и от этого файл не перестает быть текстовым. Другое дело — это , если бы мы использовали бинарный файл с 16-ричными значениями, но нас сейчас интересует первый вариант в виду легкости разработки и быстроты реализации.

4. Стрктура файла

Файл является собственным, структурированным, а это значит, что он не стнадартизирован как xml, хотя, можно было бы и его использовать, но не будем плодить копию SVG, а создадим свою структуру с нуля, чтобы лучше понять процесс разработки

Создание архитектуры масштабируемого приложения Node.js

👁 535 просмотров
1 Звезда2 Звезды3 Звезды4 Звезды5 Звезд (2 оценок, среднее: 1,50 из 5)
Загрузка...

Понятие «Архитектура приложения»

Любая программа, будь то десктопная или WEB, должна иметь определенные правила оформления кода: классов, файлов, методов, частей и т.д. Это делается, скорее всего, для того, чтобы увеличить производительность труда разработчиков и уменьшить риск возникновения непредвиденной работы программы, которую можно быстро идентифицировать и отладить. Существуют несколько подходов того, как должна строиться архитектура WEB — приложения, в частности, эти же правила можно перенести и на приложения Node.js — это MVC, HMVC, MOVE и другие. В данной же статье рассмотрим простейший пример реализации архитектуры приложения на основе модели MVC (Model-View-Controller). Не будем придумывать что такое MVC,  а приведем цитату первого абзаца из Википедии:

Model-view-controller (MVC, «модель-представление-поведение», «модель-представление-контроллер», «модель-вид-контроллер») — схема использования нескольких шаблонов проектирования, с помощью которых модель данных приложения, пользовательский интерфейс и взаимодействие с пользователем разделены на три отдельных компонента таким образом, чтобы модификация одного из компонентов оказывала минимальное воздействие на остальные. Данная схема проектирования часто используется для построения архитектурного каркаса, когда переходят от теории к реализации в конкретной предметной области

Модель MVC, как и любая другая, — это такая вещь, которая призвана упростить разделение труда разработчиков. Так, если одна группа разрабатывает интерфейс, другая — пишет код, третья — разрабатывает модель взаимодействия и хранения, то MVC с легкостью может все это соединить воедино, чтобы получить рабочее приложение и наоборот — может разделить так, что одна модель может иметь несколько представлений, к примеру, одни и те же данные из БД выводятся на одной странице сайта в виде круговой диаграммы, а в другой -в виде таблицы, но данные неизменны или другой пример, где один и тот же запрос пользователя может воздействовать на модель по разному в различных представления, в зависимости от настроек контроллера и вида. По способу взаимодействия MVC можно подразделить на MVC с пассивной моделью, где данные отправляет на вид контроллер и с активной моделью, где данные отправляет на вид сама модель

mvc-active-passive-model

Это не единственное отличие, которое может быть в MVC, их ровно столько, сколько может позволить себе любой разработчик, но концепция MVC едина для всех.

Модульность в Node.js

Прежде чем рассмотрим реализацию архитектуры приложения в Node.js, давайте обсудим про модульность в Node.js. Как известно Node.js — это модульная платформа, в котором все работает по принципу лего. Даже простой пример

var http = require('http');//Подключаем модуль приема и отправки по протоколу Http 
//Создаем объект нового сервера 
http.createServer(function (req, res) { //Передаем заголовок res.writeHead(200, {'Content-Type': 'text/plain'}); //Выводим запись 
res.end('Hello World\n'); }).listen(1337, '127.0.0.1');//Указываем адрес хоста 
//Уведомляем в консоли о том, что запущен наш сервер console.log('Server running at http://127.0.0.1:1337/');

подключает модуль http для приема и отправки запросов, который находиться в составе Node.js,  а другой модуль, к примеру, fs нужен Node.js для работы с файловой системой компьютера и он тоже входит в стандартный набор Node.js, но это не значит, что платформа Node.js содержит модули для решения всех задач, которые встречаются у разработчиков, к примеру, в стандартный состав Node.js не входит модуль для работы с сокетами и для этого нам надо его установить через консоль командой

npm install socket.io

Отсюда мы понимаем, что для того чтобы создать масштабируемое приложение нам будет необходимо разделить его на отдельные модули и подключать их к программе по мере необходимости и Node.js позволяет нам создавать собственные модули. Для примера разделим выше приведенный простой код на модули и получим идентичный результат. Чтобы разбить код на модули нам необходимо создавать файлы модулей, к примеру, мы создадим новый модуль под названием server в файле serevr.js и поместим в нее весь код работы с запросами к серверу, а в файле index.js мы запустим наш пользовательский модуль server.  Название модуля соответствует названию файла без расширения .js, код в файле server.js будет следующим

 

var http = require('http');//Подключаем модуль протокола http

function start()//Создаем метод запуска модуля
{
	function onRequest(req, res){
	  //Передаем заголовок
	  res.writeHead(200, {'Content-Type': 'text/plain'});
	  //Выводим запись
	  res.end('Hello World from Server!\n');
	}
	//Указываем адрес хоста
	http.createServer(onRequest).listen(1337, '127.0.0.1');
}
//Указываем, что данный метод доступен из вне
exports.start = start;

А в файле index.js запишем код подключения модуля server и ее запуска

var server = require('./server');//Подключаем наш модуль server
server.start();//Запускаем наш модуль сервер
//Уведомляем в консоли о том, что запущен наш сервер
console.log('Server running at http://127.0.0.1:1337/');

Запускаем наш пример командой

node [ваш путь]/server.js

если все запустилось удачно, то будет следующее сообщение в консоли

start-node-js-hello-world-result

 

После этого идем в браузер и набираем адрес нашего запущенного хоста

http://127.0.0.1:1337/

node-js-h-w-module-from-server

На этом пример создания простого модуля закончено.

Роутер и обработка запросов

В предыдущем пункте мы использовали такую функцию, как onRequest(req, res), где req(request) — объект запроса пользователя, а res(response) — это ответ пользователю. Не имеет значения как называется данная функция, она передается как параметр, для нас важны параметры, которые передаются в данную функцию. Данная функция еще называется функцией обратного вызова(callback), которая работает ассинхронно. Чтобы соответствовать уровню MVC нам необходимо определять получаемые запросы из параметра req  и передавать в параметр  res ответ в виде вида страницы. А вид страницы — это сверстанный HTML файл, и таких файлов столько, сколько необходимо для нашего приложения и пользователь видит только их. Обычно, данные файлы расположены в отдельной папке. Чтобы узнать какой запрос с POST и GET данными отправил пользователь, нам необходим роутер, который будет проверять и выдавать ту информацию, которую мы позволили нашему приложению. Продолжение следует…

Введение в Node.js и запуск «Hello World!»

👁 189 просмотров
1 Звезда2 Звезды3 Звезды4 Звезды5 Звезд (Пока оценок нет)
Загрузка...

Node.js — это интерпретатор для языка JavaScript, который используется в виде серверного языка программирования ровно также, как и PHP, Ruby, Python и т.д. Так, зачем же надо было создавать еще один интерпретатор, если подобных уже немало? А затем, что это совсем необычная технология взаимодействия клиент-сервер. Основное отличие данного интерпретатора в том, что она позволяется быстро исполнять код JavaScript на стороне сервера и мгновенно ассинхронно передавать ответ на запросы удаленных пользователей. По сути дела, Node.js  — движок V8, на котором работает браузер Chrome от Google, который переделали в сервер, добавив к нему необходимые модули работы с файловой системой, с HTTP — запросами, c сокетами и т.д.

Установка Node.js

Скачать и установить Node.js — это проще простого. Для этого заходим на официальный сайт проекта и жмем на зеленную кнопку INSTALL. После скачивания установка происходит в стандартном режиме, если у вас Windows x64, то установщик по умолчанию установит в Node.js  в папке C:\Program Files\nodejs\, соглашаемся с установщиком

node-js-default-path

После установки мы сможем передавать команды управления для Node.js из командной строку, через ключевое слово node.

Запуск рабочего примера «Hello World!»

Давайте запустим пример работы в среде Node.js. Для этого нам нужно место, где будут храниться наши файлы сервера. Представьте это как папку хранения хостов Denvera или OpenServer, хотя для Node.js нет принципиальной разницы где будут храниться ваши исполняемые файлы, но мы условимся хранить наши файлы на диске C:/NodeServer/hostname.loc, а в папку hostname.loc добавим файл index.js со следующим сожержимым

var http = require('http');//Подключаем подуль приема и отправки по протоколу Http
//Создаем объект нового сервера
http.createServer(function (req, res) {
  //Передаем заголовок
  res.writeHead(200, {'Content-Type': 'text/plain'});
  //Выводим запись
  res.end('Hello World\n');
}).listen(1337, '127.0.0.1');//Указываем адрес хоста
//Уведомляем в консоли о том, что запущен наш сервер
console.log('Server running at http://127.0.0.1:1337/');

После записи данного кода сохраняем данный файл и закрываем, переходим в консоль и набираем команду исполнения данного файла с указанием пути

node C:/NodeServer/hostname.loc/index.js

start-node-js-hello-worldЕсли все удачно установилось и запустилось, то увидите следующее собщение

start-node-js-hello-world-result

Теперь отрываем браузер и вводим адрес http://127.0.0.1:1337/ и убеждаемся, что у нас вышла долгожданная строка

node-js-result-in-browser-hw

 

На этом все, Node.js установлен и готов для дальнейшей работы.