1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
|
---
title: Przygotowanie środowiska programisty Node
slug: Learn/Server-side/Express_Nodejs/development_environment
tags:
- Express
- Node
- Początkujący
- Wprowadzenie
- środowisko programisty
translation_of: Learn/Server-side/Express_Nodejs/development_environment
---
<div>{{LearnSidebar}}</div>
<div>{{PreviousMenuNext("Learn/Server-side/Express_Nodejs/Introduction", "Learn/Server-side/Express_Nodejs/Tutorial_local_library_website", "Learn/Server-side/Express_Nodejs")}}</div>
<p class="summary"></p>
<p class="summary">Gdy już wiesz do czego służy Express, nadszedł czas, żeby pokazać Ci jak przygotować i przetestować środowisko programistyczne Node/Express w różnych systemach operacyjnych: Windows, Linux (Ubuntu) i macOS. Jakiegokolwiek systemu byś nie używał, w tym artykułe przygotujemy wszystko co Ci będzie potrzebne, by zacząć tworzyć aplikacje w Express.</p>
<p class="summary"></p>
<table class="learn-box standard-table">
<tbody>
<tr>
<th scope="row">Wymagania:</th>
<td>
<p>Umiejętność pracy z terminalem lub w trybie wiersza poleceń. Umiejętność instalacji oprogramowania w systemie operacyjnym Twojego komputera, który będzie służył do programowania.</p>
</td>
</tr>
<tr>
<th scope="row">Cel:</th>
<td>Przygotowanie środowiska programisty do tworzenia aplikacji w Express(4.x) na Twoim komputerze.</td>
</tr>
</tbody>
</table>
<h2 id="Przegląd_środowiska_programisty_Express">Przegląd środowiska programisty Express</h2>
<p>Instalacja środowisk <em>Node</em> i <em>Express</em> jest stosunkowo prosta. W tej sekcji dokonamy przeglądu wszystkich potrzebnych narzędzi, przedstawimy kilka prostych metod instalacji <em>Node </em>(<em>Express </em>także) w systemach operacyjnych Ubuntu, macOS i Windows. Na koniec przetestujemy przygotowane środowisko.</p>
<h3 id="Co_to_jest_środowisko_programisty_Express">Co to jest środowisko programisty Express?</h3>
<p>Środowisko do tworzenia aplikacji <em>Express </em>wymaga zainstalowania pakietu <em>Node.js</em>, menadżera pakietów <em>NPM</em> oraz opcjonalnie pakietu <em>Express Application Generator.</em></p>
<p>Środowisko <em>Node </em>i menadżer <em>NPM </em>mogą zostać zainstalowane razem z różnych źódeł. Mogą być to pakiety binarne, pakiety instalacyjne, menadżery pakietów systemu operacyjnego lub pliki źródłowe (co zostanie pokazane w następnych sekcjach). Sam <em>Express</em> jest instalowany przez <em>NPM</em>, podobnie jak pozostałe zależności aplikacji webowej (inne biblioteki w tym silnik szablonów, sterowniki baz danych, moduły warstwy pośredniej do autentykacji, obsługi plików statycznych itd.)</p>
<p>Przy pomocy <em>NPM </em>możemy też zainstalować <em>Express Application Generator</em>, który jest bardzo użytecznym narzędziem do generowania szkieletu aplikacji webowej w architekturze MVC. Oczywiście jest to narzędzie opcjonalne i nie jest wymagane, aby tworzyć aplikacje webowe przy pomocy <em>Express</em> o podobnej architekturze. Będziemy niego korzystać, ponieważ ułatwia trudne początki w pracy nad aplikacją i promuje modułową strukturę aplikacji.</p>
<div class="note">
<p><strong>Uwaga: </strong>W odróżnieniu od pozostalych frameworków, środowisko programisty nie zawiera oddzielnego serwera WWW do celów deweloperskich. W Node/Express aplikacja sama tworzy i uruchamia własny serwer internetowy!</p>
</div>
<p>Potrzebne będą także inne narzędzia, które są typowymi składnikami środowiska programisty, jak edytory tekstu czy środowisko IDE do edycji kodu, systemy kontroli wersji np. Git, dzięki którym możemy bezpiecznie zarządzać wersjami kodu. Zakładamy, że posiadasz już tego typu narzędzia zainstalowane (w szczególności edytor tekstu).</p>
<h3 id="Jakie_systemy_operacyjne_są_wspierane">Jakie systemy operacyjne są wspierane?</h3>
<p><em>Node </em>można uruchomić w systemie Windows, macOS, wszelkim odmianach systemu Linux, czy kontenerach typu Docker (pełna lista znajduje się na stronie Node.js <a href="https://nodejs.org/en/download/">Downloads</a>). Praktycznie każdy komputer ma wystarczającą wydajność do uruchomienia <em>Node</em> w trakcie tworzenia aplikacji. <em>Express </em>jest uruchamiane w środowisku <em>Node</em>, co oznacza, że może działać na dowolnej platformie obsługującej Node.</p>
<p>W tym artykule wyjaśnimy proces instalacji w systemie Windows, maxOS i dystrybucji Ubuntu systemu Linux.</p>
<h3 id="Z_jakie_wersji_NodeExpress_możemy_skorzystać">Z jakie wersji Node/Express możemy skorzystać?</h3>
<p>Środowisko <em>Node </em>wystepuje w <a href="https://nodejs.org/en/blog/release/">wielu wersjach</a> - najnowsze zawierają poprawki błędów, wsparcie dla najnowszych wersji standardu ECMASript (JavaScript) oraz lepsze API. </p>
<p>Zasadniczo powinieneś korzystać z najbardziej aktualnej wersji <em>LTS</em> (ang. <em>long-term supported</em> - o długim okresie wsparcia) ponieważ jest bardziej stabilna od bieżących wersji, przy zachowaniu w miarę aktualnej funkcjonalności (i jest nadal aktywnie utrzymywana). Z wersji najbardziej aktualnych możesz korzystać, gdy chcesz mieć dostęp do najnowszych funkcji, których brak w wersji <em>LTS</em>.</p>
<p>W przypadku pakietu <em>Express </em>powinieneś zawsze korzystać z najnowszej wersji</p>
<h3 id="A_co_z_bazami_i_pozostałymi_zależnościami">A co z bazami i pozostałymi zależnościami?</h3>
<p>Pozostałe potrzebne elementy aplikacji, jak sterowniki baz danych, generatory widoków, moduły autentykacji itd. są importowane do środowiska aplikacji za pomocą menadżera <em>NPM</em>. Zajmiemy się nim w późniejszych artykułach dotyczących tworzenia aplikacji.</p>
<h2 id="Instalacja_Node">Instalacja Node</h2>
<p>W tej sekcji zajmiemy się najłatwiejszym sposobem instalacji Node.js w wersji <em>LTS </em>dla różnych systemów operacyjnych: Ubuntu Linux 18.04, maxOS i Windows 10. </p>
<div class="note">
<p><strong>Wskazówka: </strong>Jeśli korzystasz z innego systemu operacyjnego lub po prostu chcesz poznać inne możliwości swojej platformy zobacz <a href="https://nodejs.org/en/download/package-manager/">Installing Node.js via package manager</a> (nodejs.org).</p>
</div>
<h3 id="macOS">macOS</h3>
<p>Instalacja <em>Node </em>wraz z <em>NPM </em>w systemach Windows i macOS jest dość łatwa, wystarczy użyć instalatora:</p>
<ol>
<li>Pobierz wymagany instalator:
<ol>
<li>wejdź na stronę <a href="https://nodejs.org/en/">https://nodejs.org/en/</a></li>
<li>Wybierz przycisk z napisem "Recommended for most users", którym pobierzesz najnowszą wersję <em>LTS</em>.</li>
</ol>
</li>
<li>Zainstaluj <em>Node </em>podwójnie klikając w pobrany plik i postępuj zgodnie z pojawiającymi instrukcjami.</li>
</ol>
<h3 id="Windows">Windows</h3>
<p>Najbardziej wskazaną metoda instalacji <em>Node </em>i <em>NPM </em>w systemie Windows jest skorzystanie z możliwości podsystemu Linux v2 (WSL2), co wymaga zainstalowania niejawnego programu testów systemu Windows (zobacz <a href="https://docs.microsoft.com/windows/nodejs/setup-on-wsl2">Set up your Node.js development environment with WSL 2</a>).</p>
<p>Po zainstalowaniu podsytemu Linux możesz zainstalować Ubuntu 18.04 jako system dla środowiska Node.js. Gdy już WSL2 i Ubuntu zostały zainstalowane, możesz kontynuować proces instalacji Node.js zgodnie z opisem w punkcie dotyczącym instalacji Node na Ubutu 18.04.</p>
<h3 id="Ubuntu_18.04">Ubuntu 18.04</h3>
<p>Najbardziej aktualną wersję <em>LTS </em>środowiska <em>Node </em>12.x najłatwiej jest zainstalować korzystając z <a href="https://nodejs.org/en/download/package-manager/#debian-and-ubuntu-based-linux-distributions">menadżera pakietów</a> pobranego z binarnego repozytorium systemu Ubuntu. Można to zrobić dwoma poleceniami w Twoim terminalu:</p>
<pre class="brush: bash notranslate">curl -sL https://deb.nodesource.com/setup_10.x | sudo -E bash -
sudo apt-get install -y nodejs
</pre>
<div class="warning">
<p><strong>Uwaga:</strong> Nie instaluj wprost z normalnych repozytoriów Ubuntu, ponieważ zawierają one bardzo stare wersje Node.</p>
</div>
<ol>
</ol>
<h3 id="Testowanie_Node.js_i_NPM_po_instalacji">Testowanie Node.js i NPM po instalacji</h3>
<p>Testujemy poprawność instalacji wpisując polecenie "version" w wierszu poleceń. Jeśli instalacja się powiodła to zostanie wyśiwetlony numer aktualnej wersji:</p>
<pre class="brush: bash notranslate">> node -v
v10.16.0</pre>
<p>Razem ze środowiskiem <em>Node.js</em> powinien zostać zainstalowany także menadżer <em>NPM.</em> Poprawność instalacji możemy przetestować ten sam sposób:</p>
<pre class="brush: bash notranslate">> npm -v
6.9.0</pre>
<p>Przeprowadzimy teraz test działania środowiska tworząc prosty serwer z użyciem wyłącznie pakietów znajdujących w <em>Node</em>, który wygeneruje dokument z napisem "Hello World":</p>
<ol>
<li>Skopuj poniższy tekst do pliku o nazwie <strong>hellonode.js</strong>. Kod wykorzystuje wyłącznie funkcje <em>Node </em>(nie zawiera żadnych funkcji <em>Express</em>) i jest napisany z wykorzystaniem składni ES6:
<pre class="brush: js notranslate">//Load HTTP module
const http = require("http");
const hostname = '127.0.0.1';
const port = 3000;
//Create HTTP server and listen on port 3000 for requests
const server = http.createServer((req, res) => {
//Set the response HTTP header with HTTP status and Content type
res.statusCode = 200;
res.setHeader('Content-Type', 'text/plain');
res.end('Hello World\n');
});
//listen for request on port 3000, and as a callback function have the port listened on logged
server.listen(port, hostname, () => {
console.log(`Server running at http://${hostname}:${port}/`);
});
</pre>
<p>W kodzie znajduje się import modułu "http", który to moduł jest wykorzystany do utworzenia serwera (<code>createServer()</code>) nasłuchującego na porcie 3000. Skrypt wysyła na konsolę komunikat z informacją pod jakim adresem URL działa nasz serwer. Funkcja tworząca serwer (<code>createServer()</code>) pobiera argument w postaci definicji funkcji zwrotnej, która zostanie wywołana w chwili odebrania żądania. W funkcji zwrotnej tworzymy prostą odpowiedź z kodem statusu HTTP 200 ("OK") i zwykłym tekstem "Hello World".</p>
<div class="note">
<p><strong>Uwaga:</strong> Nie przejmuj się, jeśli nie rozumiesz tego kodu. Wszystko wyjaśnimy ze szczegółami, gdy zaczniemy korzystać z Express. </p>
</div>
</li>
<li>Uruchom serwer przechodząć najpierw w terminalu do katalogu z plikiem <code>hellonode.js</code> a następnie wydając polecenie <code>node</code> z nazwą skryptu:
<pre class="brush: bash notranslate">>node hellonode.js
Server running at http://127.0.0.1:3000/
</pre>
</li>
<li>W przeglądarce wpisz URL <a href="http://127.0.0.1:3000">http://127.0.0.1:3000 </a>. Jeśli wszystko pracuje poprawnie w przegladarce powinieneś zobaczyć napis "Hello World".</li>
</ol>
<h2 id="Korzystanie_z_NPM">Korzystanie z NPM</h2>
<p>Drugim ważnym narzędziem po samym <em>Node </em>jest menadżer pakietów <a href="https://docs.npmjs.com/">NPM</a>. Głównym jego zadaniem jest pobieranie pakietów (bibliotek JavaScript), których aplikacja potrzebuje w trakcie tworzenia, testowania i pracy w środowisku produkcyjnym. Możesz też go potrzebować do uruchamiania testów i narzędzi wykorzystywanych w trakcie programowania. </p>
<div class="note">
<p><strong>Uwaga:</strong> Z punktu widzenia Node, Express jest tylko jednym z wielu pakietów, których potrzebujesz w swoim kodzie i musisz zainstalować przy pomocą NPM.</p>
</div>
<p>Możesz pobierać każdy z wymaganych modułów wpisując polecenia dla NPM do każdego modułu. W praktyce o wiele wygodniejszym rozwiązaniem jest zarządzanie zależnościami poprzez specjalny plik tekstowy o nazwie <a href="https://docs.npmjs.com/files/package.json">package.json</a>. W pliku tym znajduje się lista wszystkich potrzebnych modułów wymaganych przez tworzony pakiet JavaScript, a także nazwa pakietu, wersja, opis, początkowy plik do uruchomienia, zależności produkcyjne, zależności deweloperskie, wersja środowiska <em>Node</em>, w której pakiet może pracować itd. Plik <strong>package.json </strong>powinien zawierać wszystkie informacje wymagane przez <em>NPM</em>, dzięki którym możliwe jest pobranie i uruchomienie Twojej aplikacji (jeśli piszesz bibliotekę wykorzystywaną przez innych użytkowników musisz skorzystać z definicji opisującej załadowanie pakietu do repozytorium npm).</p>
<h3 id="Dodawanie_zależności">Dodawanie zależności</h3>
<p>W kolejnych krokach opiszemy jak możesz użyć <em>NPM</em> do pobrania pakietu, zapisania go w zależnościach projektu i oznaczenia go jako wymaganego przez naszą aplikację <em>Node</em>.</p>
<div class="note">
<p><strong>Uwaga: </strong>Pokażemy teraz instrukcje pobrania i instalacji pakietu <em>Express. </em>Później poznamy jak ten pakiet i pozostałe zostaną automatycznie wyspecyfikowane w projekcie, gdy utworzymy go modułem <em>Express Application Generator. </em>Ta sekcja jest po to, abyś mógł zrozumieć jak działa sam NPM i jakie korzyści daje wykorzystanie generatora aplikacji.</p>
</div>
<ol>
<li>Zaczniemy od utworzenia katalogu na Twoją nową aplikację.Potem musimy do niego wejść:
<pre class="brush: bash notranslate">mkdir myapp
cd myapp</pre>
</li>
<li>
<p>Poleceniem <code>init</code> narzędzia npm utworzymy plik <strong>package.json</strong> dla naszej aplikacji. Pojawią się pytania o kilka istotnych rzeczy, jak nazwa i wersja Twojej aplikacji, nazwę pliku wejściowego aplikacji (domyślnie jest to <strong>index.js</strong>). Na razie zaakceptujemy ustawienia domyślne:</p>
<pre class="brush: bash notranslate">npm init</pre>
<p>Jeśli zajrzysz do pliku <strong>package.json</strong>, to zobaczysz zakceptowane ustawienia domyślne wraz z licencją na końcu.</p>
<pre class="brush: json notranslate">{
"name": "myapp",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"author": "",
"license": "ISC"
}
</pre>
</li>
<li>W kolejnym kroku zainstalujemy moduł <em>Expess </em>w katalogu <code>myapp</code> co spowoduje dodanie tego modułu jako zależności w naszym pliku <strong>package.json</strong>. </li>
<li>
<pre class="brush: bash notranslate">npm install express</pre>
<p>Możemy teraz zobaczyć dodaną na końcu w pliku <strong>package.json</strong> sekcję, która dołączy do naszej aplikacji pakiet Express.</p>
<pre class="brush: json notranslate">{
"name": "myapp",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"author": "",
"license": "ISC",
<strong> "dependencies": {
"express": "^4.16.4"
}</strong>
}
</pre>
</li>
<li>Kolejnym krokiem po dołączeniu zależności do projektu, jest zaimportowanie pakietu w pliku źródłowym przy pomocy wywołania funkcji <code>require()</code>. Utwórz teraz plik <strong>index.js</strong> w katalogu aplikacji <code>myapp</code> i wpisz do niego poniższą zawartość:
<pre class="brush: js notranslate">const express = require('express')
const app = express();
app.get('/', (req, res) => {
res.send('Hello World!')
});
app.listen(8000, () => {
console.log('Example app listening on port 8000!')
});
</pre>
<p>Utworzony kod to odpowiednik aplikacji typu "Hello World!" w <em>Express</em>. Najpierw importujemy pakiet "express" funkcją <code>require()</code>, a następnie tworzymy serwer (<code>app</code>), który nasłuchuje żądań na porcie 8000 i wysyła komunikaty na konsolę z informacją o porcie pracującego serwera. Funkcja <code>app.get()</code> realizuje obsługę żądań wyłacznie typu GET skierowanych do głównej ścieżki URL aplikacji ('/'), na które generuje odpowiedź z komunikatem "Hello World!".</p>
</li>
<li>Możesz uruchomić serwer wywołując w terminalu polecenie node z parametrem w postaci nazwy naszego skryptu:
<pre class="brush: bash notranslate">>node index.js
Example app listening on port 8000
</pre>
</li>
<li>Otwórz w przeglądarce stronę z URL (<a href="http://127.0.0.1:8000/">http://127.0.0.1:8000/</a>). Jeśli wszystko pracuje poprawnie powinieneś zobaczyć stronę z napisem "Hello World!".</li>
</ol>
<h3 id="Zależności_środowiska_deweloperskiego">Zależności środowiska deweloperskiego</h3>
<p>Jeśli jakiś pakiet wykorzystujesz tylko podczas tworzenia aplikacji to powinieneś go dodać jako zależność deweloperską - "development dependency" (to spowoduje, że użytkownicy Twojej aplikacji (lub pakietu) nie będą instalować takiego pakietu w wersji produkcyjnej). Na przykład, gdy chcesz skorzystać z popularnej biblioteki <a href="http://eslint.org/">eslint</a> (jest to tzw. linter) to powinieneś wywołać NPM następująco:</p>
<pre class="brush: bash notranslate"><code>npm install eslint --save-dev</code></pre>
<p>W efekcie dostaniesz nowy wpis w pliku <strong>package.json</strong> Twojej aplikacji:</p>
<pre class="brush: js notranslate"> "devDependencies": {
"eslint": "^4.12.1"
}
</pre>
<div class="note">
<p><strong>Uwaga:</strong> "<a href="https://en.wikipedia.org/wiki/Lint_(software)">Linter</a>y" to narzędzia do statycznej analizy kodu aplikacji służące do wykrywania i raportowania fragmentów, które nie są zgodne/lub są zgodne z dobrymi praktykami tworzenia oprogramowania.</p>
</div>
<h3 id="Uruchamianie_zadań">Uruchamianie zadań</h3>
<p>Oprócz dodawania i pobierania zależności, w pliku <strong>package.json</strong> możesz też definiować tzw. nazwane skrypty. Przy pomocy NPM możesz je później uruchamiać poleceniem <a href="https://docs.npmjs.com/cli/run-script">run-script</a>. Jest to typowe rozwiązanie stosowane do automatyzacji takich zadań jak uruchamianie testów, fragmentów tworzonej aplikacji czy budowania ciągu uruchamianych narzędzi (np. uruchamianie narzędzi minimalizujących objętość kodu JavaScript, zmiany rozmiaru obrazów, LINT, analizatory kodu itp.).</p>
<div class="note">
<p><strong>Uwaga:</strong> Możesz też korzystać z innych narzędzi do tego celu jak <a href="http://gulpjs.com/">Gulp</a> lub <a href="http://gruntjs.com/">Grunt</a> .</p>
</div>
<p>Przykładem może być skrypt do uruchomienia narzędzia eslint (jako zależność deweloperska) w postaci bloku dodanego do pliku <strong>package.json</strong> (zakładamy, że żródła naszej aplikacji znajdują się w katalogu /src/js):</p>
<pre class="brush: js notranslate">"scripts": {
...
"lint": "eslint src/js"
...
}
</pre>
<p>Wyjaśnijmy teraz co dodaliśmu w bloku "scripts": jest to polecenie, które musiałbyś wpisać w oknie terminala, żeby uruchomić <code>eslint</code> dla wszystkich plików JavaScript w katalogu <code>src/js</code>. Aby móć później się odwołać do tego polecenia nazwaliśmy go skrótem <code>lint</code>. </p>
<p>Teraz możemy uruchomić <em>eslint</em> wywołując NPM z naszym skrótem:</p>
<pre class="brush: bash notranslate"><code>npm run-script lint
# OR (using the alias)
npm run lint</code>
</pre>
<p>Choć wydaje się, że wywołanie utworzonego skrótu nie jest krótsze od oryginalnego polecenia, to pamiętaj, że możesz w skryptach zawrzeć znacznie dłuższe polecenia, jak i całe ciągi poleceń. Możesz też stworzyć jeden skrypt, który uruchamia wszystkie testy.</p>
<h2 id="Instalacja_generator_aplikacji_Express_-_Express_Application_Generator">Instalacja generator aplikacji Express - Express Application Generator</h2>
<p><a href="https://expressjs.com/en/starter/generator.html">Express Application Generator</a> to narzędzie do generowania szkieletu aplikacji Express. Zaczniemy od zainstalowania generatora przy pomocy NPM z flagą <code>-g</code>:</p>
<pre class="notranslate"><code>npm install express-generator -g</code></pre>
<div class="blockIndicator note">
<p><strong>Uwaga: </strong>Może pojawić się konieczność wstawienia na początku wiersza polecenia <code>sudo</code> w systemach Ubuntu lub macOS. Flaga <code>-g</code> powoduje zainstalowanie pakietu w trybie globalnym, ktory pozwala na wywołanie go z dowolnego katalogu.</p>
</div>
<p>Żeby utworzyć aplikację "helloworld" z domyślnymi ustawieniami, wejdź do katalogu, w którym chcesz ją utworzyć i uruchom polecenie:</p>
<pre class="brush: bash notranslate">express helloworld</pre>
<div class="note">
<p><strong>Uwaga: </strong>Podczas instalacji możesz<strong> </strong>podać bibliotekę szablonów i wiele innych ustawień. Wpisz polecenie <code>help</code> żeby zobaczyć wszystkie możliwości:</p>
<pre class="brush: bash notranslate">express --help
</pre>
</div>
<p>NPM będzie tworzył nową aplikację Express w podfolderze bieżącego katalogu wypisując na konsoli komunikaty obrazujące postęp instalacji. Po zakończeniu zobaczysz komunikat z poleceniem instalującym zależności Node i uruchamiające aplikację.</p>
<div class="note">
<p><strong>Uwaga</strong>: Nowa aplikacja posiada własny plik package.json w swoim głównym katalogu. Możesz go otworzyć i sprawdzić zainstalowane zależności, w tym Express i bibliotekę szablonów Jade:</p>
<pre class="brush: js notranslate">{
"name": "helloworld",
"version": "0.0.0",
"private": true,
"scripts": {
"start": "node ./bin/www"
},
"dependencies": {
"cookie-parser": "~1.4.3",
"debug": "~2.6.9",
"express": "~4.16.0",
"http-errors": "~1.6.2",
"jade": "~1.11.0",
"morgan": "~1.9.0"
}
}
</pre>
</div>
<p>Zainstaluj wszystkie zależności do swojej aplikacji przy pomocy NPM:</p>
<pre class="brush: bash notranslate">cd helloworld
npm install
</pre>
<p>Następnie uruchom aplikację (polecenia różnią się nieco dla systemów Widnows i Lunux/macOS):</p>
<pre class="brush: bash notranslate"># Run the helloworld on Windows with Command Prompt
SET DEBUG=helloworld:* & npm start
# Run the helloworld on Windows with PowerShell
SET DEBUG=helloworld:* | npm start
# Run helloworld on Linux/macOS
DEBUG=helloworld:* npm start
</pre>
<p>Polecenie DEBUG jest bardzo przydatne, gdyż uruchamia rejestrowanie zdarzeń, które możemy zobaczyć poniżej:</p>
<pre class="brush: bash notranslate">>SET DEBUG=helloworld:* & npm start
> helloworld@0.0.0 start D:\Github\expresstests\helloworld
> node ./bin/www
helloworld:server Listening on port 3000 +0ms</pre>
<p>Otwórz przeglądarkę i wpisz adres <a href="http://127.0.0.1:3000/">http://127.0.0.1:3000/</a>, a zobaczysz domyślną stronę powitalną aplikacji Express.</p>
<p><img alt="Express - Generated App Default Screen" src="https://mdn.mozillademos.org/files/14331/express_default_screen.png" style="border-style: solid; border-width: 1px; display: block; height: 301px; margin: 0px auto; width: 675px;"></p>
<p>Więcej o wygenerowanej aplikacji dowiemy się w artykule o generowaniu szkieletu aplikacji.</p>
<ul>
</ul>
<h2 id="Podsumowanie">Podsumowanie</h2>
<p>Masz przygotowane środowisko do tworzenia i uruchamiania aplikacji webowych w środowisku Node. Poznałeś działanie menadżera NPM, dowiedziałeś się jak zaimportować pakiet Express do swojej aplikacji i jak utworzyć szkielet aplikacji przy pomocy generatora aplikacji Express a potem go uruchomić.</p>
<p>W następnym artykule zaczniemy prawdziwe szkolenie, w trakcie którego stworzymy kompletną aplikację webową korzystając z Node.js i dostępnych w nim narzędzi.</p>
<h2 id="Zobacz_także">Zobacz także</h2>
<ul>
<li><a href="https://nodejs.org/en/download/">Downloads</a> page (nodejs.org)</li>
<li><a href="https://nodejs.org/en/download/package-manager/">Installing Node.js via package manager</a> (nodejs.org)</li>
<li><a href="http://expressjs.com/en/starter/installing.html">Installing Express</a> (expressjs.com)</li>
<li><a href="https://expressjs.com/en/starter/generator.html">Express Application Generator</a> (expressjs.com)</li>
<li><a href="https://docs.microsoft.com/windows/nodejs/">Using Node.js with Windows subsystem for Linux</a> (docs.microsoft.com)</li>
</ul>
<p>{{PreviousMenuNext("Learn/Server-side/Express_Nodejs/Introduction", "Learn/Server-side/Express_Nodejs/Tutorial_local_library_website", "Learn/Server-side/Express_Nodejs")}}</p>
<h2 id="W_tym_module">W tym module</h2>
<ul>
<li><a href="/pl/docs/Learn/Server-side/Express_Nodejs/Introduction">Wprowadzenie do Express/Node</a></li>
<li><a href="/pl/docs/Learn/Server-side/Express_Nodejs/development_environment">Przygotowanie środowiska programisty Node</a></li>
<li><a href="/pl/docs/Learn/Server-side/Express_Nodejs/Tutorial_local_library_website">Szkolenie z Express: aplikacja webowa Biblioteka </a></li>
<li><a href="/en-US/pl/Learn/Server-side/Express_Nodejs/skeleton_website">Szkolenie z Express - część 2: Tworzenie szkieletu aplikacji</a></li>
<li><a href="/en-US/docs/Learn/Server-side/Express_Nodejs/mongoose">Express Tutorial Part 3: Using a Database (with Mongoose)</a></li>
<li><a href="/en-US/docs/Learn/Server-side/Express_Nodejs/routes">Express Tutorial Part 4: Routes and controllers</a></li>
<li><a href="/en-US/docs/Learn/Server-side/Express_Nodejs/Displaying_data">Express Tutorial Part 5: Displaying library data</a></li>
<li><a href="/en-US/docs/Learn/Server-side/Express_Nodejs/forms">Express Tutorial Part 6: Working with forms</a></li>
<li><a href="/en-US/docs/Learn/Server-side/Express_Nodejs/deployment">Express Tutorial Part 7: Deploying to production</a></li>
</ul>
|